Visibility Rules

Visibility Rules

Overview

Visibility rules let you dynamically control whether an option is shown, hidden, required, or restricted based on what the customer has selected or entered elsewhere in the calculator. They make your calculator interactive and context-aware — customers only see the fields relevant to their choices. Open any option in the calculator editor and switch to the Visibility Rules tab to configure them.

Steps

  1. Click Add rule inside the Visibility Rules tab.
  2. Set the logic mode — choose how multiple conditions are evaluated: All (every condition must be true), Any (at least one must be true), or None (no condition may be true).
  3. Choose an action — select what happens when the conditions are met: Show if, Hide, Unhide when, Require, Limit, Hide values, or Show value(s) if (see Details below).
  4. Add conditions — each condition references another option or variable, an operator, and a comparison value. For Dimensions options, also pick which Dimension row to test (see Rule Conditions). See that page for the full operator list by source type.

Details

Show if

The option is shown only when this rule’s conditions match. When they do not match, the option is hidden. Use this when a field should appear only in specific situations (for example, an engraving line only when “Add engraving?” is on).

If you add more than one Show if rule on the same option, all of them must pass for the option to stay visible (logical AND across those rules). To express “show if A or B,” use one rule with logic Any and two conditions.

Hide

Hides the entire option when the rule’s conditions match. A hidden option is removed from the calculator layout and its value is excluded from pricing and cart data.

Unhide when

When the rule’s conditions match, the option is removed from the hidden state if something else had hidden it (for example another Hide rule, or calculator-level conditional logic). When the conditions do not match, this rule does nothing by itself.

Precedence: If Show if would hide the option but Unhide when matches on another rule, Unhide when wins — the option stays visible. Treat Unhide when as an explicit escape hatch for advanced setups.

Evaluation order (same option)

For each option, the calculator first applies Hide, Unhide when, Require, Limit, and Hide values / Show value(s) if in the order the rules appear in the list. Show if is evaluated after those actions for that option, regardless of where Show if rules appear in the list. That keeps Show if behavior predictable when you mix rule types.

Require

Makes the option required only when the rule’s conditions match. Useful for fields that are optional in most cases but mandatory in specific configurations. Not available for display types.

Limit

Restricts the option’s allowed inputs when conditions match. What you can limit depends on the option type:

Option Type Limit Settings
Number / Slider / Quantity Min value, Max value, Step increment
Text / Text Area / Email Min length, Max length, Regex pattern
Choice types (Dropdown, Radio, Checkbox, Button, Color Swatch, Image Swatch) Allowed values, Max selections
Date Picker Min date, Max date

Hide Values / Show value(s) if

Available only for choice types (Dropdown, Radio, Checkbox, Button, Color Swatch, Image Swatch). Hide values removes specific choices from the list when the rule’s conditions match. Show value(s) if shows only the listed choices when the rule’s conditions match; when they do not match, that rule does not filter choices (so you see the full list unless another rule applies). Stored in data as show_value. (This is not the same as the Show if option-level action — it only filters which choice values appear.)

Calculator-level conditional logic (advanced)

The saved calculator JSON can include a top-level array conditionalLogic: if/then rules that reference option keys and apply Hide or Unhide when (and other supported then actions) at runtime. There is no separate editor for this in the app today; it exists for schema compatibility and advanced or imported setups. Per-option Visibility Rules are what you use in the editor for almost all cases.

This is not the same as Hide from storefront and preview (draft only) on an option — that is an admin-only draft flag (editorHidden), not a customer-facing visibility rule.

Examples

  • Conditional engraving — A Switch option "Add engraving?" controls visibility of a Text Box "Engraving text." On the Text Box, add a Show if rule: when "Add engraving?" equals True, the text field is shown; otherwise it is hidden.
  • Material-dependent sizes — A Dropdown "Material" has values Wood, Metal, and Acrylic. A Limit rule on the "Width" number input sets Max to 48 when Material equals Acrylic (because acrylic sheets only come up to 48 inches).
    • Related Articles

    • Value Rules

      Overview Value rules let you automatically set an option's value when certain conditions are met. Instead of the customer filling in a field manually, the calculator can pre-fill it, override it, or lock it to a specific value. This is useful for ...
    • Quantity Discount Rules

      Overview Quantity discount rules let you offer volume-based pricing — the more a customer buys, the bigger the discount. Appify OPC supports two modes: 1D (Simple), where discounts depend only on quantity, and 2D (Advanced), where discounts depend on ...
    • Custom SKU Rules

      Overview Custom SKU rules let you automatically generate a unique SKU (Stock Keeping Unit) for every product configuration a customer creates. The SKU is built from fragments — short codes assigned to each option value — combined according to a ...
    • Rule Conditions

      Overview Conditions are the "if" part of every visibility rule and value rule. Each condition checks the current value of an option or variable and compares it using an operator. When the conditions on a rule are satisfied (based on the All/Any/None ...
    • Working with Options

      Overview Options are the building blocks of your calculator. Each option represents a field, choice, or display element that appears in the calculator on your storefront. This article covers how to manage options — adding, reordering, duplicating, ...