Configuring Options

Configuring Options

Overview

Once you create a layer, configure how it behaves by clicking it in the Layers list and adjusting settings in the Layer Settings panel (right side). Here you set positioning, sizing, default values, what customers can do, and how the layer responds to option changes.

Details

Position and size

X, Y — Where the layer appears, measured in pixels from the top-left corner of the image.

Width, Height — Layer size in pixels.

Rotation — Angle in degrees (0–360) for image and text layers.

Arc curvature — For text layers only; curves the text along a circular arc (useful for badges or circular designs).

Use Edit on canvas to adjust these visually by dragging in the preview instead of typing numbers.

Default values

For text layers:

  • Default text — What shows in the preview before the customer enters text
  • Placeholder — Hint text shown in the input field on the storefront

For image layers:

  • Default image — If none is selected, a dashed box shows the layer's position on the preview

Customer controls

Toggle what customers can do on the storefront:

  • Change position — Customers can drag the layer
  • Change size — Customers can resize the layer (drag corners)
  • Rotate — Customers can rotate the layer

If all are disabled, the layer is static.

Image layer settings

Image behavior

  • Single image — All option values show the same image
  • Per-value image — Each value has its own image for this layer (different from the option's swatch if one exists)

Image shape

  • Square — No masking
  • Circle — Circular mask (e.g., badges)
  • Oval — Oval mask
  • Custom — Upload a mask image; transparency defines the shape (black = visible, transparent = hidden)

Linked options (text layers only)

Link a text layer's appearance to other options:

Font family — Select a Font picker option. Text uses the customer's font choice.

Font color — Select a Color picker or Color swatch option. Text color updates with the customer's selection.

Font size — Select a Number input or Slider option. Text size changes based on the customer's number.

When you link an option, the text uses that option's initial value on page load. If no option is linked, the text appearance is fixed as you configure it.

Multi-select configuration

For options that allow multiple selections, choose:

  • Slots — Fixed number of slots (1–50), filled in order. Use this when order doesn't matter (e.g., photo galleries).
  • Per value — Each possible value gets a fixed position. Use this when specific items need specific spots (e.g., toppings always in the same place).

See Multi-Select Options for detailed configuration.

Layer label

Give your layer a descriptive name for easy tracking (e.g., "Mug Color", "Customer Text"). The default is the option name.

Examples

Text on mug — Text layer with default text "Your Name Here". Link font family to a Font picker, font color to a Color swatch, and size to a Number input. Text defaults appear on load, then update as the customer chooses font, color, and size.

Logo with transparency — Image layer with Image shape set to Circle. Upload a circular logo as the image. Set Image behavior to Per-value if you want different logos for different option selections.

Draggable photo — File upload layer with Slots mode, 4 slots. Toggle Change position and Change size on. Customers can move and resize each uploaded photo independently.

    • Related Articles

    • Configuring Personalization Options

      Overview For each personalization layer, you define how it looks and behaves. Click a layer in the Layers panel (left side of Step 5: Personalization) to open the Layer Settings panel on the right. This is where you control positioning, sizing, ...

    • AI Bulk Generate Options

      This is different from the Build with AI wizard that appears when creating a new calculator — AI Bulk Generate adds options to an existing calculator. Overview AI Bulk Generate lets you describe the options you need in plain English, and Appify OPC ...

    • Multi-Select Options

      Overview Options that allow multiple selections—checkboxes, multi-file uploads, or multi-select swatches—can display multiple layers on the product image. You choose between Slots (filled in order) or Per value (each value has a fixed spot). Each ...

    • Personalization Multi-Select Options

      Overview Some options allow customers to select multiple items: checkboxes, multi-file uploads, or multi-select swatches. When you add a personalization layer for a multi-select option, you can configure how those multiple selections appear as ...

    • 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, ...