⬇️Dropdown

Available on: Product page, Collection page

✨Demo product: Dropdown (password: 1)

Function

Displays an option's values inside a collapsed dropdown, letting customers choose one value from a list — the most space-saving selector.

How it works

• Values are hidden inside a collapsed dropdown until opened.

• Customers select one value at a time; the chosen value shows as the active choice.

• This is a text-only selector — no image or color, so there's no swatch editor to set up.

Use when

• An option has many values and buttons/swatches would take too much room.

• You want to save space on the product or collection page.

• Options are text-based and don't need visual comparison.

---

How to use Dropdown

1

Change the display type to Dropdown → Click Save

In Variants display, set the option's Product page display (and/or Collection page display) to Dropdown. There's nothing to configure per value.

2

(Optional) Adjust the look in Styling

Padding, font, text and background colors are configured in Styling.

---

How it looks on your store

• Product page:

• Collection page:

Related

• Button — text buttons when there are only a few values

• 🎨 Custom swatch — when values need a color or image

• Styling settings reference — font, padding, colors