Text swatch is a personalization option on a text layer that lets the merchant pre-fill a set of ready-made text values, for example Mom, Dad, or Custom, so the customer can pick one with a single click instead of typing it themselves.

Enabling text swatch

Add a Text layer to the template, then open the Personalization section in the layer's right-hand panel and tick Personalize with text swatch. A set of configuration fields appears below the checkbox:

• Label: the field name shown to the customer above the swatches on the storefront.
• Required: tick this if the customer must pick a value before adding the product to cart.
• Texts: the list of ready-made values the customer can choose from. The first value is the default, the one that is pre-selected when the page loads. Add text adds a new value, the pencil edits a value inline, and each value's menu offers Duplicate and Delete. Remove default value clears the pre-selected default.
• Display style: how the swatches are shown to the customer. Inline button (the default) shows each value as a text button, Thumbnail image shows each value as an image tile, and Dropdown shows the values in a single dropdown menu.

Text swatch sits alongside the other text personalization options and can be combined with them on the same layer.

Editing the values

The Edit link above the Texts list opens the Edit values dialog, a single place to manage every value at once. For each value you can drag the handle to reorder it, tick the checkbox to make it the default, assign a thumbnail image (used when the display style is Thumbnail image), edit the text, set an Index to control its order, and delete it.

Customer experience

On the storefront the customer sees the Label with the swatches below it. Picking a swatch instantly updates the text on the product preview to that value, so they get a correct, on-brand result in one click with no typing.

Combining with conditional logic

Text swatch pairs well with conditional logic to build a "preset or custom" flow, where a free-text field appears only when the customer picks Custom. This is done on a single text layer, no extra layer needed:

• Set up the swatch with the ready-made values (for example Mom and Dad) plus one value named Custom.
• On the same layer, also tick Personalize text so the customer can type their own text. The layer now produces two options in the option set: the swatch and a text input.
• Open the Option Sets tab, find the text input option, then choose More actions and Add condition.

• In the Add Conditions dialog, set the rule to Show this option when, pick the swatch option, and tick Custom as the matching value.

Now the text input stays hidden while the customer is on Mom or Dad, and only appears once they select Custom, so they can enter their own text.

Updated on: 18/08/2026