Embedding To Your Webpage: Deploying and adding the shortcode (calculator form) to your page.
Solution
Steps
Copy your embedded shortcode.
Add the shortcode or code module.
Paste the code.
Video Tutorial
Other languages
German: So integrieren Sie Stylish Cost Calculator 2024
Spanish: So integrieren Sie Stylish Cost Calculator 2024
French: Comment intégrer Stylish Cost Calculator 2024
Limitations
Pop-Ups & Overlays
You cannot embed the shortcode on a pop-up or overlay. It will not load the plugin's CSS code properly and it will break. Please load the shortcode on its own landing page.
How to Embed Your Calculator Using Different Builders
Elementor
Step 1. In the elements side panel, locate the "Styled Cost Calculator" widget and drag it to the container.
Step 2. Choose the calculator you want to add. Then click "Update" to preview the page and you're done! Your calculator is ready with Elementor.
You can also add the calculator directly via shortcode. Using Elementor's native shortcode widget, paste the calculator's shortcode, obtainable from the "All Calculators" page of Stylish Cost Calculator.
Gutenberg
Step 1. Head to the page where you want the calculator and click "Add Block." Click the "Shortcode" option.
Step 2. Paste the calculator's shortcode, obtainable from the "All Calculators" page of Stylish Cost Calculator.
DIVI Theme's Builder
Step 1. Insert a new module, which will be a "Code" field. In the editor's pop-up window, replace the "Text" element's content with the calculator's shortcode obtainable from the "All Calculators" page of Stylish Cost Calculator.
WP Bakery (Visual Composer)
Step 1. Replace the "Text" element's content with the calculator's shortcode obtainable from the "All Calculators" page of Stylish Cost Calculator.
Note: First click on the "text" option in the text block. Then insert the shortcode.
Beaver Builder
Step 1. Insert a new module, which will be a "Text" field. In the editor's pop-up window, replace the "Text" element's content with the calculator's shortcode.
Additional Information
All Elements & Features
Learn more about All Elements
Learn more about All Features
Need Support?
Ask a question or request support
Request a feature or give feedback
Updated on: 21/06/2024
Thank you!