Using Calculators
Create embeddable cost and pricing calculators for your website.
Adrian avatar
Written by Adrian
Updated over a week ago

With our calculator content item and its formula builder, you can create an interactive calculator which can be easily embedded into your website in minutes. 

Calculators are available for paid plans only but can be tested in draft projects on free plans. Use this feature to create cost estimations and pricing calculators for your services and products, let your users interact on your website, and gather more effective leads.

You also have several designs and content options to customize the look and feel of the calculator, so feel free to experiment.

Table of Contents:

How to Use a Calculator

While you can change the order of things to your liking, we usually recommend that you set up your questions/answers before adding the calculator to your project.

If you want to use the answers to a specific question in the calculation, click on that question in the Editor and activate the "Answer is Required" option. If you want to use a question in a project that has Multiple Outcomes, make sure to also turn on "Individual Score & Calculation" for the question to be available in the formula builder.

To assign individual values for each answer of Multiple Choice, Image Answer or Dropdown elements, activate "Individual Score & Calculation" and input the values in the "VALUE" field. If you do not use individual scores, the calculation will use 1 for correct answers and 0 for incorrect answers by default. Slider elements do not need this option.

Depending on the conditional logic you're using, the Free Text Input element may or may not require the option "Only Accept Numbers" in addition to "Answer is Required" in order to be used in the calculator formula.

Once you've gone through the questions and set everything up, you can add the calculator element from the content elements list. 

Note: The calculator icon might be greyed out. This is because you can currently only drag & drop calculators to "Thank You" and Outcome pages.

Building your Calculation Formula

Click on "Open Formula Builder" to start customizing your calculation. 

When creating a formula you'll be able to choose any of the following:

  • Hidden Fields (Custom Fields or Functional Fields)

  • Multiple Choice Element (with Answer set as required)

  • Image Choice Element (with Answer set as required)

  • Dropdown Element (with Answer set as required)

  • Rating Element (with Answer set as required)

  • Free Text Input Element (with Answer set as required + Only Accept Numbers)

  • Slider Element

You can use basic operators like "+", "-", "*", "/", "^" (plus, minus, multiply, divide, exponent) from your keyboard and create complex formulas, as well as bracket symbols "(" and ")" to control the order of the operations.

Additionally, you can also use advanced functions and conditional operators. Click here for the complete list with examples on how to use the functions.

To start building your formula, click on any question from the list on the left, so it gets added to the formula field.

You can also use keyboard shortcuts (CTRL+A, CTRL+C, CTRL+X, CTRL+V) to edit the calculator formula. Formulas can be copied to and from the editor and external applications.

Please note: you might have to allow clipboard access in your browser (when prompted) to enable keyboard shortcuts.

The formula takes the answers given by any particular user, then calculates and displays the result according to the formula you've set up. You can prevent the participant from seeing the result (to set aside the result for the Analytics or to be used as a piped answer for instance) by enabling the option "Hide for Participants".

You can also use calculation formulas to reach different outcomes, instead of showing the calculator result on the outcome page. This can be done with Score-based Outcomes.

Bear in mind that the calculator result will not be displayed when on "Design Preview" mode, an X will appear in place of the result. Instead, make sure to either click "Try it" when previewing the design, or simply click the eye icon on the navbar and select "Try Draft" so you can test the calculator's functionality.

How to Use the Result of a Calculator When Using a Custom Redirect

In the case you want to redirect to your own website instead of showing the final page of you can't see the result of a calculation, but you can still use its value in the redirect URL. To do so deactivate the redirect and put the calculator element on the page.

After you have created the formula, you can activate the redirect again and use an answer piped variable inside the URL like this:{{ca_xxxxx}}

In the above example, ca_xxxxxx is the calculator ID. You can find this ID on your right side when you select the calculator element in the Editor.

Did this answer your question?