keyboard_arrow_left Back to Knowledge Base

Getting started with the Wix Calculator Builder

Engage your site visitors and boost your conversion rates with an attractive and interactive calculator. Prices, discounts, loans, mortgages, body mass index – Wix Calculator Builder app gives you the opportunity to build any custom calculator and add it to your Wix website.

Wix Calculator Builder app is available only on the Wix App Market.

Key Features

Setting up our calculator is a breeze! Just add the info you need, connect the dots with a formula, arrange it how you like, and boom! You're good to go.

Want your calculator to match your website perfectly? No problem! You can change the colors, tweak the text, and more with just a few clicks!

Can't decide where to start? We've got you covered! Pick from a bunch of pre-made templates that you can customize to your liking.

No matter if you're using a phone or a computer, our calculator always looks great!

Your users can easily send their results to their inbox, complete with a detailed summary of their choices and final numbers.

Getting Started

Wix Calculator Builder is super easy to install and use.

You can install the app to your website by finding it on the Wix App Market and clicking on the button Add to site.

How to add app to your site

And that’s it. Your first calculator has been added to your page, now begins the fun part to customize it to fit your needs.

User Interface Overview

Main dashboard

In order to access the main calculator dashboard, click on the calculator widget and then click on the pop up Settings button and the main dashboard will appear.

From the main menu on the left side of the pop-up, you can access the templates, calculator settings and design options as well as contact our customer support team and manage your app subscription.

Main Wix Calculator Builder app dashboard

In order to start creating your own calculator, click on the Customize Calculator button in the main menu to access the calculator editor.

If you want to choose from the existing templates, either click on a Choose a Calculator button in the main menu or click on Templates in the left side menu.

This dashboard can be accessed whenever you need through the Settings button that appears next to the widget once it is clicked on.

Calculator editor can be accessed through the button Customize Calculator that can be found in the Main menu or at the bottom of the Templates section.

Calculator editor

Calculator editor has two main navigation points, one at the top and one on the right.

At the top we have three main buttons:

Wix Calculator Builder app editor

Types of elements

You can add the following input fields and elements to your calculator:

Numeric Input Field - a numeric input field allows site visitor to enter a number. It then provides a formula with a numeric value added by the site visitor.

Text Input field - a text input field allows site visitors to enter a text. It then provides a formula with the amount of symbols or words added to this field.

Select Field - a select field creates a drop down list of predefined options. Site visitor can choose only one of these options. The Select field feature provides a formula with the predefined value of the selected option.

Radio Buttons - radio buttons creates a list of predefined selectable options. Site visitor can choose only one of these options. The radio button provides a formula with the predefined value of the selected option.

Checkbox - a checkbox is a specific type of two-state button that can be checked or unchecked. It provides a formula with one predefined value if the box is checked, and another predefined value if the box is unchecked.

Slider - a slider is a graphical input field that allows site visitors to input a number within a specified range. It provides a formula with a numeric value chosen by the site visitor.

Information - an information box creates a place to add text for site visitors to read. It doesn’t contribute to any of the calculations.

Formula - a formula makes mathematical calculations and shows users the numerical result of these calculations.

Separating Line - a Separating line helps to organize calculator's input fields and elements into groups.

Gauge - a gauge is a nice-looking tool that helps graphically illustrate calculation results.

Text Gauge - a text gauge is a helpful tool that puts the results of a given calculation into words.

Mail Results - the mail results tool lets you send your website visitors their calculated results directly to their inboxes, and sends you a copy of their results, too.

Wix Calculator Builder app elements

Element settings

Wix Calculator Builder app element settings

Menu on the right side of the calculator editor differs depending on which element is selected. Once you click on the element, new settings will appear on the right side.

Most elements have these settings that can help enhance your calculator:

Calculator settings

In the calculator settings, you can add a thousands separator, which allows to enhance readability of big numbers as well as specify what format of decimal point you’d like to use.

Wix Calculator Builder calculator settings

Design possibilities

Wix Calculator Builder app design settings

FAQ

You can cancel your subscription here..


If you have any questions regarding the app, you can contact our customer support team via email wix.support@lumifish.com.

Build calculator for free!