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 Tab
  • Settings Tab
  • Add a measuring Unit
  • Fractional (Decimal) Value Input
  • Enabling Fractional Input
  • Example of Using Quantity Element

Was this helpful?

  1. Calculator Elements

Quantity

PreviousTextNextValidated form

Last updated 26 days ago

Was this helpful?

Using the Quantity element allows you to create any type of numbers as input.

Element Tab

The Quantity element has the following fields in the Element Tab:

  • Name - Title of the field.

  • Placeholder - You can either fill the placeholder or not (It is not required).

  • Description - Description of the field.

  • Step - Defines the up and down (increase/decrease) buttons' step value.

  • Default Value - The default value will be shown to the user when he opens a cost calculator.

  • Name of Value - You can put unit measures, such as kg(kilograms), gr(grams), m (meters), etc. You can also decide whether you want unit measures, for example, kg, to show on the right or left.

  • Multiply (cost per value) - Enable this if you want to multiply the value by a certain number.

  • Hide Min/Max Values - Enable to hide the minimum and maximum values set to the field in the calculator.

Settings Tab

The Quantity element has the following fields in the Settings Tab:

  • Currency Sign - Enable if you want to show the currency sign in the total summary.

  • Currency Settings - Applies global currency settings such as thousand and decimal. separators, the number of decimals to the entered value.

  • Round Value - Enable if you want to round the value to the whole number in the total summary.

  • Required - Defines whether the element will be required to be filled or not.

  • Show in Grand Total - Disable if you want to hide the element in Grand Total.

  • Additional Classes - Add extra classes to the HTML elements to further style changes

Add a measuring Unit

This setting allows you to add a measuring unit (Ω, cm, kg, inch, etc.) to the field.

  • Unit Symbol - enter the unit symbol

  • Position - select the position where the symbol should be displayed relative to the number

  • Thousands separator - select the the symbol to

  • Number of decimals - indicate the number of decimals in the fractional part

  • Decimal separator - select the symbol to separate fractional part

Here is how it will look:

Fractional (Decimal) Value Input

When using the Quantity field with its default settings, it is not possible to input fractional numbers. Any fractional number entered will automatically be rounded to the nearest whole number:

Enabling Fractional Input

To allow the input of fractional numbers in the Quantity field, the Currency Settings must be enabled. This setting ensures that the Quantity field can handle and correctly display fractional values.

Here is the result:

If both Currency Settings and Round Value options are enabled, you can enter fractional values in the Quantity field. However, these values will be automatically rounded to the nearest whole number in the summary.

Example of Using Quantity Element

Let’s create a BMI Calculator with a quantity element.

The default height value will be 170 with a unit value in cm. The default weight value will be 60 with a unit value in kg. There will be a formula element to calculate the BMI.

That’s how it will look on the user’s page:

You can set up Multiply (cost per value) when you want the value a user inputs to multiply for the cost. For example, if the cargo service delivers packages from the USA to Europe at 25 USD/ kg. The values will multiply by 25 to calculate the fees for the delivery.

That's how it will look on the user's page

Hidden by Default - The element will be hidden by default. You can make it visible using .

Calculate hidden by default - If any case hides the element: via the Hidden by Default setting or hidden by some , the element's default value (if it is set) will be counted in the formula.

conditional system
condition
Add a measuring unit
Sample of Measuring Unit
Quantity Field (Currncy Settings, Round Value are OFF)
Currency Settings in the Quanttiy Field Settings
Quantity Field (Currency Settings is ON, Round Value is OFF)