Getting Started With ES Calculator Builder

With the ES Form Builder, you have two flexible options to create custom calculators for your website. Whether you have existing data in a spreadsheet or prefer to build from scratch, ES Form Builder makes the process intuitive and efficient.

1. Link an Existing Excel or Google Sheet #

If you already have an Excel or Google Sheet with your calculations:

  1. Step 1: Connect the spreadsheet to the ES Form Builder.
  2. Step 2: Use the drag-and-drop interface to add form elements such as input fields, checkboxes, dropdown menus, charts, images, and more.
  3. Step 3: Map the form elements to the corresponding input and output cells of your spreadsheet.

This approach allows you to harness the power of your existing formulas and calculations while creating a visually appealing and interactive interface for users.

2. Create Calculators Using Formula Fields #

If you don’t have an existing spreadsheet, you can still build powerful calculators directly within the ES Form Builder:

  1. Step 1: Define your calculator’s logic using built-in formula fields.
  2. Step 2: Add your input fields and configure calculations without needing any external sheet or data.

This method is ideal for creating quick, standalone calculators where all the necessary formulas are defined within the form builder itself, giving you flexibility and full control.


Whether you choose to link a Google Sheet or build using formula fields, ES Form Builder offers a simple, versatile solution to create interactive calculators tailored to your specific needs.

3. Creating an Input-Free Calculator (Without Any Input) #

An input-free calculator is perfect when you want to display static results or data directly from your Google Sheet without requiring user input. This method ensures that the displayed information is always up-to-date, as it fetches fresh data from your Google Sheet each time the page is loaded.

  1. Step 1: Connect your Google Sheet to the calculator builder and select the sheet containing the data you wish to display.
  2. Step 2: Configure your result elements:
    • Use Readonly Text Field to display specific values or messages from your sheet.
    • Use Table to present data in a tabular format, showing multiple rows and columns.
    • Use Pie Chart or Line Chart to visualize data, offering a clear view of trends or proportions. For more details, see the documentation.
  3. Step 3: Customize with universal elements like headings, paragraphs, and images to enhance the presentation of your data.
  4. Step 4: Save and publish your calculator, then embed it on your website using the provided code.

This method is ideal for dashboards or reports where data from your Google Sheet changes regularly, ensuring users always see the most current data without needing to input anything.


Whether you’re building an interactive calculator or a simple display of data, ES Form Builder gives you the flexibility to choose the method that best fits your needs.

Was it helpful ?