Conditional Logic
Conditional Logic#
Conditional logic lets you dynamically show or hide calculator fields, add surcharges, and switch formulas based on customer input. This is useful for products where the pricing or fields change depending on what the customer enters.
Overview#
A condition consists of:
- When: Which input field to watch (e.g., width, height, a custom variable)
- Operator: How to compare (e.g., greater than, equals)
- Value: The threshold value
- Then: What action to take
- Target: What the action applies to
Conditions are evaluated in real time as the customer enters measurements. They also run server-side when the product is added to the cart.
Setting up conditions#
- Go to the Measurement tab on any product.
- Scroll down to the Conditional Logic section.
- Click Add Condition.
Condition fields#
| Field | Description |
|---|---|
| When | The input field to evaluate. Populated from the calculator type’s input fields and any custom variables |
| Operator | Comparison operator |
| Value | The threshold value to compare against |
| Then | The action to take when the condition is true |
| Target | The field or value the action applies to |
Available operators#
| Operator | Description | Example |
|---|---|---|
> | Greater than | Width > 10 |
>= | Greater than or equal | Area >= 100 |
< | Less than | Height < 3 |
<= | Less than or equal | Weight <= 50 |
== | Equals | Length == 8 |
!= | Not equals | Width != 0 |
Available actions#
| Action | Description | Target |
|---|---|---|
| Show field | Reveals a hidden input field | Field name to show |
| Hide field | Hides a visible input field | Field name to hide |
| Add surcharge (%) | Adds a percentage surcharge to the total price | Percentage value |
| Add surcharge (fixed) | Adds a fixed amount to the total price | Dollar amount |
| Use formula | Switches to a different formula | Formula expression |
Action types explained#
Show field#
Reveals a calculator input field that starts hidden. The field animates into view when the condition is met and hides again when it’s not.
Example: Show a “Depth” field only when the width is greater than 10 feet.
| When | Operator | Value | Then | Target |
|---|---|---|---|---|
| width | > | 10 | Show field | depth |
Setup: The target field must exist as a variable or input. Fields with show conditions start hidden by default.
Hide field#
Hides a visible input field when the condition is met.
Example: Hide the “Height” field when the customer selects a specific option.
| When | Operator | Value | Then | Target |
|---|---|---|---|---|
| product_type | == | flat | Hide field | height |
Add surcharge (percentage)#
Adds a percentage surcharge on top of the calculated price.
Example: Add a 15% surcharge for oversized items (area over 500 sq ft).
| When | Operator | Value | Then | Target |
|---|---|---|---|---|
| width | > | 20 | Add surcharge (%) | 15 |
The surcharge is displayed as a separate line in the calculator results:
- “Oversize surcharge: +15% ($45.00)“
Add surcharge (fixed)#
Adds a flat dollar amount to the total price.
Example: Add a $25 setup fee for orders where the length exceeds 50 feet.
| When | Operator | Value | Then | Target |
|---|---|---|---|---|
| length | > | 50 | Add surcharge (fixed) | 25 |
The surcharge is displayed as a separate line:
- “Setup fee: +$25.00”
Use formula#
Switches the calculation to a completely different formula when the condition is met.
Example: Use a different formula for round vs rectangular cuts.
| When | Operator | Value | Then | Target |
|---|---|---|---|---|
| shape | == | round | Use formula | 3.14159 * radius * radius |
Important: The alternative formula can reference any variables defined in the custom variables table. Make sure all variables used in the formula exist.
Multiple conditions#
You can add multiple conditions to a product. They are all evaluated independently on every input change.
Stacking surcharges#
Multiple surcharge conditions can stack. If two surcharges are both true, both are applied.
Example:
| When | Operator | Value | Then | Target |
|---|---|---|---|---|
| width | > | 20 | Add surcharge (%) | 10 |
| length | > | 30 | Add surcharge (%) | 5 |
If width is 25 and length is 35, both surcharges apply: 10% + 5% = 15% total surcharge.
Multiple show/hide conditions#
If multiple conditions target the same field, the last matching condition wins.
Frontend display#
Surcharges#
When surcharge conditions are active, a surcharges section appears below the calculator results showing each active surcharge with its label and amount.
Hidden fields#
Fields with show conditions start hidden. When the condition becomes true, the field slides into view with a smooth animation. When the condition becomes false again, it slides back out.
Formula switching#
When a “Use formula” condition activates, the calculation switches instantly. The customer sees the updated price without any page reload.
Server-side validation#
All conditions are also evaluated on the server when the product is added to the cart. This ensures:
- Surcharges can’t be bypassed by manipulating client-side JavaScript.
- The cart price always matches what the customer saw on the product page.
- Formula switching produces the same result server-side.
Example: custom window blinds#
A window blinds product where oversized windows cost more:
Calculator type: Area (L×W)
Variables: Width (in), Height (in)
Conditions:
| When | Operator | Value | Then | Target |
|---|---|---|---|---|
| width | > | 72 | Add surcharge (%) | 20 |
| height | > | 84 | Add surcharge (%) | 15 |
| width | > | 96 | Add surcharge (fixed) | 50 |
Result: A 100” × 90” window:
- Base area price calculated normally
- +20% surcharge (width > 72)
- +15% surcharge (height > 84)
- +$50 flat fee (width > 96)
Example: material-dependent formula#
A product where the calculation changes based on material type:
Calculator type: Custom Formula
Variables: length, width, material (dropdown: “standard”, “premium”, “heavy-duty”)
Default formula: length * width
Conditions:
| When | Operator | Value | Then | Target |
|---|---|---|---|---|
| material | == | premium | Add surcharge (%) | 25 |
| material | == | heavy-duty | Use formula | length * width * 1.5 |
Best practices#
- Keep conditions simple. One or two conditions per product is usually enough.
- Test all branches. Enter values that trigger each condition and verify the result.
- Use clear surcharge descriptions. Customers should understand why they’re paying more.
- Don’t overuse formula switching. If you need many different formulas, consider separate products.
- Set appropriate min/max constraints on fields to limit the range of conditions that can trigger.
Troubleshooting#
Condition not triggering#
- Check the “When” field matches the exact variable name (case-sensitive).
- Verify the operator and value are correct.
- Make sure the customer’s input actually satisfies the condition.
Surcharge not applied in cart#
- Server-side condition evaluation uses the same logic. Check that the cart’s stored measurement values match.
- Verify the condition is saved on the product (reload the product editor).
Show/hide field not working#
- The target field name must exactly match a variable name in the custom variables table or a built-in input field name.
- Check for JavaScript errors in the browser console.