Skip to main content
Six option types show the shopper a list you wrote. They all collect the same thing, one of your choices, and differ only in how they look on the product page.
Use Radio buttons for three or fewer choices and a Dropdown above that. Shoppers decide faster when they can see everything at once, but a list of twenty items pushes the Add to cart button off the screen.

Allow deselect

Every type here except Checkbox and Radio buttons has an Allow deselect setting. Turn it on and the shopper can clear their pick and go back to nothing chosen. Leave it off and, once they have chosen, they can only change to another choice. Combine it with Required carefully: an option that is required but deselectable simply blocks the cart until they pick again.

The choices themselves

Under the settings you get the values table, one row per choice.
The option set editor with the Swatch values card outlined, showing Choose default, Bulk edit and Quick add buttons above four rows, each with a drag handle, a swatch thumbnail, a value box, an add-on price box and a bin icon.

The values table for a swatch option. Each row is one tile the shopper can tap.

Above the table:
  • Choose default marks the choice the shopper starts on.
  • Bulk edit lets you paste or rewrite the whole list at once. See bulk add and edit values.
  • Quick add fills the list from a picture or colour library you have linked, so you don’t retype anything. It is greyed out until a library is linked.
Drag the handle at the left of a row to reorder, and use the bin icon to remove one. Add value adds a row at the bottom. There is more on all of this in managing values and charging extra for a choice.

Giving a choice its own tile

On the three swatch types, each row has a small square next to it. Click it to decide what that tile looks like.
The swatch picker popover with Colour and Image tabs, the Image tab showing the picture used for this choice, and Cancel and Done buttons.

Each choice can be a flat colour or a picture.

  • Colour gives the tile a flat colour. Right for paint, thread, vinyl, mug colours.
  • Image puts a picture on the tile, either from your library or uploaded here. Right for patterns, materials, and artwork styles a colour can’t describe.
A tile is only how the choice looks in the list. It does not change the artwork on its own. That is what a template connection does. It is worth making the two match, so a tile showing a red heart really does put the red heart on the product.
If your choices came from a linked library, their rows are locked and the tiles come from the library items. Change the picture in the library rather than here. See keep options up to date.

Where to next

Style your own swatches

Ready-made layouts, or your own HTML and CSS.

Charge extra for a choice

Add a surcharge to the choices that cost you more.