Insert calculators into the page
Calculators can be added to the page with easy steps. To open Calculator embed options just click on Embed button:
Following one of the options below in the Cost Calculator dashboard the calculator can be embedded:
You can use shortcodes to show created calculators in some pages or posts manually.
First, click on the embed button of the desired calculator:
Next, in opened Pop Up window expand Insert manually option and copy the Calculator Shortcode:
Then go to the Pages and edit one of the existing pages or click on Add New to create a new page.
You can paste the shortcode that you copied to the front page. To add that shortcode, you can use any page builder plugin (Gutenberg, Elementor, WPBakery) or you can use special elements instead of shortcode.
You can add a Calculator to the existing pages automatically. First, click on the embed button of the desired calculator:
Next, in opened Pop Up window expand "Select existing pages" option and select pages and click on Apply button to embed calculator:
The Calculator will be added to the end of the page.
You can add a Calculator by creating new page. First, click on the embed button of the desired calculator:
Next, in opened Pop Up window expand "Create new page" option and by giving the name click on Create Page button to embed calculator to this new page:
After clicking on Create Page button, you will be redirected to newly created page with Calculator:
You can use "Cost Calculator Builder" widget to inset the calculator with page builder plugins.
In this page builder, there is a special element called Cost Calculator Builder, find that element and drag it.
Then select your calculator that you want to add to the page and click the Update button.
NOTE: In Elementor, you should initially save the calculator and then open it in the page in order to preview the calculator
The result is following:
In WPBakery page builder, there is also a special element called Cost Calculator Builder, find that element, and choose your calculator.
After selecting the necessary calculator, press the Save changes button.
As a result, you can see the calculator when you preview the page.
