Choice options
Seven types let a customer pick from a list you define. The picker splits them by how many they may pick.
| Group | Types | Plan |
|---|---|---|
| Single selection | Dropdown, Radio buttons | Free |
| Color swatch, Image swatch | Advance | |
| Multiple selection | Checkbox | Free |
| Color swatch, Image swatch | Advance |
A colour swatch and an image swatch appear in both groups. They are the same field with the same configuration — the group decides whether the customer may pick one or several.
All seven share a pricing model: each choice carries its own price, so “Small +£0, Large +£4” is one option with two priced choices. Available rules are flat fee, percentage of product price, formula and quantity tiers.
Choices
Section titled “Choices”Every type here takes a list of choices. Each choice has:
- A label — what the customer reads.
- A value — what is recorded on the order. Keep it stable; changing it changes what appears on new orders, and leaves old orders reading the old value.
- Optionally, a price.
Two choices in one option cannot share a value. The app refuses the save rather than accepting a list where one of the two can never be priced.
Dropdown and radio buttons
Section titled “Dropdown and radio buttons”The same field in two presentations. Radio buttons show every choice at once, which is what you want for two to four. A dropdown hides them behind a click, which is what you want for five or more — twelve radio buttons push the add-to-cart button off the screen.
Color swatch
Section titled “Color swatch”Each choice also takes a colour, rendered as a tappable swatch.
A choice with no colour set still renders and is still selectable — it just shows without a colour chip. A half-configured swatch degrades into a plain choice rather than disappearing, so a customer never meets a gap where an option should be.
The swatch size is configurable; 72 px is the default and works on both a phone and a desktop grid.
Image swatch
Section titled “Image swatch”Each choice takes an image URL, rendered as a picture. Use it where the difference is a texture, a grain or a print that a flat colour chip cannot convey.
Host the images somewhere stable and fast — they load on the product page. Shopify’s own Files section is a reasonable home. An image URL is limited to 500 characters, which no sane URL exceeds.
Checkbox (multiple selection)
Section titled “Checkbox (multiple selection)”Several tickboxes, each with its own value and price. The customer ticks any combination, and every ticked choice’s price is added.
The answer is recorded as a comma-separated list, because the cart and the order show it to the customer directly: Gift wrap, Rush reads as a list where wrap|rush reads as a bug.
A choice value therefore cannot contain a comma. The app rejects that at save time rather than letting it silently split into two lookups that price neither half.
You can set a minimum and a maximum number of selections:
- A minimum makes the option effectively required — the customer is told to choose at least N, and add-to-cart is blocked until they do.
- A maximum stops further ticks once reached, and the choices already at the cap are dimmed rather than silently ignoring the click.
Multiple-selection swatches
Section titled “Multiple-selection swatches”A colour or image swatch added from the Multiple selection group behaves exactly like Checkbox above — several at once, every selected choice priced, comma-separated on the order — while still rendering as swatches.
Use it for anything genuinely multi-valued and visual: pick any three thread colours, choose the fabrics to sample.
Where Yes/no checkbox fits
Section titled “Where Yes/no checkbox fits”Yes/no checkbox is a different type, and it lives under Input in the picker rather than here. It has no list at all: it is ticked or it is not, and it carries a single price for being ticked.
The rule of thumb:
- One independent yes/no — gift wrapping — is a Yes/no checkbox.
- One list of related extras the customer picks from — Add-ons: gift wrap, rush, insurance — is a Checkbox.
- Two unrelated add-ons are two Yes/no checkboxes, not one Checkbox with two entries. Modelling them as one list implies they are alternatives to each other.
Worked example
Section titled “Worked example”A Finish dropdown with:
| Choice | Price |
|---|---|
| Matte | — |
| Gloss | +£3.00 |
| Brushed metal | +£8.00 |
A customer picking Brushed metal sees the preview rise by £8.00, and is charged £8.00 more at checkout.
Make the same option a Checkbox instead and a customer could tick Gloss and Brushed metal together, paying £11.00 for two finishes you cannot both apply. That is the question the single/multiple choice answers: are these alternatives, or are they extras?