keyboard_arrow_left Back to Knowledge Base

Add an interactive calculator to your WIX website

Adding your custom online calculator to a WIX website is really easy. All you have to do is copy your calculator’s code snippet and paste it in a specific place of you WIX website. Follow the instructions below to do that.

And if you haven’t built a calculator yet, learn how to create your first interactive calculator by following our step-by-step tutorial.

Step 1 | Retrieve your calculator’s code snippet:

  1. Sign in to your CALCONIC account.
  2. Click My Calculators.
  3. Choose the calculator you want to embed to your WIX website.
  4. Make sure that the calculator is activated. If it isn’t, click the Inactive label to activate it.
  5. Click the Embed button. Activate your calculator before embeding
  6. (Optional) Click the + New Website button and add your website’s address to whitelist it. Why do you need that? Whitelisting your website address helps to ensure that nobody else can copy your embedding code and your calculator to their website. However, please note that WIX has quite complex address structure:
    • If your website address actually is www.yourdomain.com, then please whitelist the following address www-yourdomain-com.filesusr.com
    • Or if you address actually is yourdomain.wixsite.com, then please whitelist the following address yourdomain-wixsite-com.filesusr.com
    • Additionally, add the static.filesusr.com address to see your calculator in the WIX Editor.
  7. Click Next. Whiteliste the address of your website
  8. Click the Standard tab.
  9. Copy your calculator’s code snippet. Retrieve your calculator’s code snippet

Step 2 | Embed the snippet code to your WIX website:

  1. Sign in to your WIX account and open the WIX Editor.
  2. Click Add (+ icon) on the left side of the Editor.
  3. Click More.
  4. Click HTML iFrame. Add the WIX element for HTML/iFrame embedding
  5. Click the Enter Code button or double-click the added element.
  6. Paste your code snippet.
  7. Click the Apply button. Paste your code snippet
  8. The WIX element might be smaller in size than your calculator and therefore your calculator might look cut. Use the Stretch Handle to lengthen the element or drag the stretch handles on the edge of the element to the size you need. Resize the WIX element

Need a hand building your first web calculator? Contact us via email support@calconic.com.

Build calculator for free!