Cost Calculator Builder
Item PageVideo TutorialsChangelogResources Get Started
  • Cost Calculator Builder Documentation
  • Getting Started
    • Free Version and Pro Version
    • System Requirements
    • Plugin Installation
    • License Activation
      • Upgrading the License
    • Update Billing Details and Access Invoices
    • License Utilization
    • Update The Plugin
    • Templates
    • Feature Request
  • Plugin Features
    • How to Create a Calculator
    • How to Manage Calculators
    • How to Add a Calculator to the Page
    • Calculator Appearance
    • Additional Classes
  • Cost Calculator Settings
    • Calculator Settings
      • Summary Block
      • Currency
      • Warning Texts
      • Confirmation Page
      • Order Form
      • Form Manager
      • Sticky Calculator
      • Woo Products
      • Woo Checkout
      • Payments
      • Webhooks
    • Global Settings
      • Currency (Global)
      • PDF Entries
      • Share Quote Form
      • Order Form (Global)
      • Email Template
      • Backup Settings
      • AI Formula
      • Captcha
      • Payments (Global)
      • Geolocation
  • Calculator Elements
    • General Overview
    • Text
    • Quantity
    • Validated form
    • Dropdown list
    • Image Dropdown (Pro feature)
    • Radio Select
    • Image Radio (Pro feature)
    • Switch Toggle
    • Checkbox
    • Image Checkbox (Pro feature)
    • Date Picker (Pro feature)
    • Time Picker (Pro feature)
    • Basic Slider
    • Multi Range (Pro feature)
    • File Upload (Pro feature)
      • How to Allow Additional File Types in WordPress
      • How to Increase Maximum File Upload Size in WordPress
    • HTML
    • Geolocation (Pro feature)
    • Line
    • Formula
      • AI Assistant (Pro feature)
    • Repeater (Pro feature)
    • Group Field (Pro feature)
    • Page Breaker (Pro feature)
  • Conditional System
    • Introduction
    • How to Create a Condition
    • Condition Options
    • Condition Actions
    • AND/OR Conditions
    • Condition Creating Example
  • Special Plugin Features
    • Orders
    • Discounts
    • Required Fields
    • Contact Form 7 Plugin
  • Payments
    • Settings
    • PayPal
    • Stripe
    • Razorpay
    • Cash Payment
  • Translating Cost Calculator Into a Different Language
    • Translation Basics
    • Translating Static Strings
    • Translating Calculator with WPML
    • FAQ
  • Develeoper's guide
    • Cost Calculator Hooks
      • Order Management
      • Contact Form
      • Confirmation Page
      • Email
  • Troubleshooting
    • Introduction
    • Plugin Conflicts
    • Theme Compatibility
    • Calculator is not loading
    • Cache Settings
    • Email not sending
    • Debug Logs
    • Submit a Support Ticket
  • Changelog
    • Release Notes
    • Changelog (Free Version)
    • Changelog (Pro Version)
  • Pre-built Calculators & Cases
    • Service Booking
    • Graphic Design
    • Loan Interest
    • Delivery Service
    • Renovation Company
    • Dental Services
    • Car Wash Company
    • Medical Services
    • Tuition Fees
    • Printing Services
    • Car Rental
    • Venue Rental Service
  • Advanced Topics
    • License Management
  • Stylemixthemes
    • Cost Calculator Builder WordPress Plugin
    • Themes
    • Plugins
Powered by GitBook
On this page
  • Element Types
  • Input & Selection Fields
  • Date & Time
  • Range & Sliders
  • Other Smart Features
  • Grouping Elements

Was this helpful?

  1. Calculator Elements

General Overview

PreviousGeolocationNextText

Last updated 27 days ago

Was this helpful?

Build smart, flexible, and dynamic pricing forms with our intuitive Cost Calculator. With a variety of customizable elements at your fingertips, you can create everything from simple quotes to complex estimation tools — no coding required.


Element Types

The calculator supports 22 distinct elements, each designed to handle different types of input and interactivity. Here is the overview of the Calculator Elements:

Input & Selection Fields

Date & Time

Range & Sliders

Other Smart Features

Grouping Elements


You can learn how to build a calculator using these elements by following this manual:

📝 Text Field

Basic text input for user entries

🔢 Quantity

Number field ideal for item counts or units

📂 Dropdown List

Choose from a predefined list of options

🖼️📂 Image Dropdown

Dropdown with visual options for easy selection

🔘Radio Buttons

Traditional single-option selector

🖼️🔘Image Radio

Radio buttons with images to guide user choice

🔄Switch Toggle

Sleek on/off toggle for binary choices

☑️ Checkbox

Tick boxes for multiple selections

🖼️☑️Image Checkbox

Visual checkboxes with image previews

📅 Date Picker

Calendar input for selecting a date and date range

⏰ Time Picker

Time selection with dropdown-style interface

🎛️ Basic Slider

Drag-to-set a single value slider

🎚️ Multi Range

Select a range between two values

📤 File Upload

Allow users to upload documents, images etc.

📍 Geolocation

Calculate values based on the entered location from Google Maps

🧮 Formula Field

Calculate values dynamically using math expressions

✅ Validated Form

Enforce input rules for email, phone and URLs

🧩 HTML Element

Embed custom HTML code (for text, images, embeds, etc.)

➖ Divider (line)

Visually separate sections of your form/calculator

🗂️ Section (Group) Field

Combine multiple fields into one cohesive block

🔁 Repeater

Let users duplicate a set of fields as needed

📑 Page Breaker

Split long forms into multiple steps for a cleaner experience

How to Create a Calculator
Calculator Elements on the Left Sidebar