You can use Wispform to create an online calculator for your business or service to help streamline processes and/or improve your customer's experiences. Calculators can vary from very simple calculators to generate a quick quote to very complex calculator that involves multiple variables and formulas. Some of the most common types of calculators created on Wispform include:
Calculator content type is a paid feature. If you are on the basic tier, you will be prompted to upgrade to any of our paid plan for $10/month.
Below is step by step instruction on how you can create such a calculator. The example below is a wedding pricing calculator. You can see a live version of the form here.
Step 1: Sign in to Wispform and create a New Content
Step 2: Give your content a name and select the calculator content type
Step 3: First create a welcome page for your calculator
Step 4: Add content for your welcome page and add an image to youor welcome page by using the setting on the right hand side
Step 5: Use the "+" sign on the left hand side to create a second question. This time, create a picture choice question and fill in the content. Here we are asking user's to pick the size of their dream wedding. Once this is complete, use the setting on the right hand side to add a "Calculation Value".
Step 6: For each choice your user pick, set a value for how you would like to use it in the final formula calculation. In this example, we are going to assign $5000 to the small wedding, $10000 to the medium sized wedding, and $50000 to the large sized wedding. Once this is complete, hit save.
Step 7: Create another question using "+" on the left hand side. This time, choose a number question. We are going to ask the user how many wedding dress they would like to rent out. Now if you go to the "Calculation Value" setting on the right hand side, you will see that a value is assigned already. This is because Wispform will automatically take the value that the user input for number question types.
Step 8: Now we are going to create two more question using the "+" sign on the left hand side. One with the type "Date" so user can specify the day of their wedding. Another one with the question type "Email", so user can leave their email behind for you as potential lead.
Step 9: Now that the questions are setup, use the lower "+" sign to create a Result Page. On the result page, go to the right hand side and add a "Calculator Results". This is the variables that will be calculated in your calculator. You can add one or multiple variables.
Step 10: Give your variable a name. Here we are going to set it to wedding price.
Step 11: Once the variable is created, hit the set button to configure this variable
Step 12: In the top bar, choose "Formula". You can use Conditional as well to generate calculation based on logic, but in this example we are going to use formula. In the formula input box, type "@" to pull up the previously configured values in each question. Choose question 2 here which if you remember is 5000 if user chose small, 10000 if user chose medium, and 50000 if user chose large.
Step 13: Complete the formula using mathematical expression such as number, operation sign (+, -, *, /), parenthesis, as well as pull in value with @. In this example, each wedding dress that the user want is going to be multiplied by $50 and then we add that to the cost of the wedding itself configured in question 2. Once this is configured, hit "Save Variable".
Step 14: Go through step 11 - step 13 again. This time, set a discounted value formula, which is the exact same formula as above. Except we are going to apply a 20% discount by multiplying the result by 0.8.
Step 15: Once the values are configured, update your result page with an image and some text. You can type "@" to pull up the variable that you just defined on the right hand side. In this example, we are going to show both the cost of the wedding and the cost of the wedding with the 80% discount.
Step 16: Click on the button in the result page and update the text and the url that the button points to. In this example, we update the text to "Book Now!" and redirect the user to a custom website to checkout. Once the form is built as desired, click on the share link at the top to either get a link to the calculator or embed the calculator into your website.
Step 17: You can do a practice run through the calculator to make sure that you got the formula correct
Thanks for using Wispform's Calculator. Hopefully this tutorial is enough for you to get a taste of what is possible. If you have any question, feel free to reach out to the Wispform team using the chat bubble on the bottom right corner.
Related articles: