Calconic
Calconic is a platform for creating interactive calculators that can be embedded into websites to provide pricing tools, quote calculators, booking estimators, and other interactive forms.
Key features include:
- Drag-and-drop calculator builder
- Pre-built calculator templates
- Custom input fields and formulas
- Interactive quote and pricing calculators
- Embeddable calculators for websites
Calconic integrates with ShopWired by providing an embed script that can be added to website pages using custom HTML so you can display interactive calculators on your website.
Account creation
Account creation
Create an account on the Calconic website at Calconic.
After creating your account, you can build a calculator using the builder or choose a template. Once the calculator is configured, Calconic provides embed code that can be added to your website.
Embedding a calculator on your website
Embedding a calculator on your website
After creating a calculator in your Calconic account, the platform provides embed code that can be added to your website.
To add the calculator to your ShopWired website, Calconic will provide code similar to the example below:
<a href="#/calculator/example-id" data-calculatorid="example-id">Open calculator</a>
<script>
(function(){var qs,j,q,s,d=document, gi=d.getElementById,
ce=d.createElement, gt=d.getElementsByTagName,
id="calconic_", b="https://cdn.calconic.com/static/js/";
if(!gi.call(d,id)){
j=ce.call(d,"script"); j.id=id; j.type="text/javascript"; j.async=true;
j.dataset.calconic=true;
j.src=b+"calconic.min.js";
q=gt.call(d,"script")[0]; q.parentNode.insertBefore(j,q);
}
})();
</script>
The code shown above is provided as an example only. You must copy the exact code provided in your own Calconic account, as the script and any ID values will be unique to your calculator.
- Navigate to Website > Themes
- Select
customise your themefor the theme you want to edit - Select
add a new section - Select the
custom HTMLsection type - Paste the calculator embed code into the Custom HTML setting
- Position the section where the calculator should appear and save your changes
Recommendations
Recommendations
- Use separate pages for different calculators when multiple tools are required
- Test calculators on a draft theme before adding them to your live website
- Keep a record of where calculator embed code has been added to your website
- Update the calculator inside your Calconic account if pricing or formulas change
