Dropdown

A styled dropdown with search, image swatches, stock display, selection limits, and live preview support.

The app's own dropdown. It matches the rest of your widget, and it supports what the native Select does not: search, images, inventory display, selection limits, and the live preview.

Use this type unless you specifically need the native picker.

Watch it done — 1:33. Turning a long list of values into a searchable dropdown, including the Search suggestion setting that lets customers type instead of scroll.

What customers see

A field that opens a styled list. Depending on your settings, the list can include a search box, a picture beside each entry, and out-of-stock entries marked as unavailable.

The app draws this dropdown, so it can carry search, images, and stock state.

Basic

Setting	What it does
Label / Name	Customer-facing text, and the name on the order.
Required field	Blocks add to cart until something is chosen.
Hidden label	Hides the label.
Swatch style	Default or Image. Choosing Image adds a picture per entry.
Option values	The list of choices, with prices, help text, and images. See Working with option values.
Allow multiple	Lets the customer choose several. Reveals the two limits below.
Min selections / Max selections	How many they must and may choose.
Placeholder	The unselected prompt. Starts as -- Please select --.
Help text	Guidance that stays visible.
Default value	Preselects one or more values.
Conditional logic	Show or hide based on other choices.

Advanced

Setting	What it does
Add-on quantity / Quantity	How the add-on scales with quantity.
Search suggestion	Adds a search box to the top of the list.
Not allow deselect	Stops the customer clearing their choice. Single-select only.
Out of stock options	Show, Hide, Blur, or Strike-through for sold-out values.
Help text position	Where the help text sits.
Prefix / Prefix icon / Prefix text	An icon or text at the start of the field.
HTML class / Column width	Styling hook and field width.

Dropdown does not support collapsible or slider layouts. Those layouts are available for the grid-based option types, and a dropdown is already a compact way to display a long list.

Personalizer

Dropdown supports the live preview as an image layer. Each value can have an image that is displayed on the product photo when the value is selected.

Settings are Image shape, Background mode, width, height, position, opacity, rotation, crop area, and customer controls. See Image layers.

This makes Dropdown a compact way to offer many visual designs. The list stays small, and the product photo updates with each choice.

Add-on pricing

Prices are set on each option value, and each value supports all three modes. The option-level Add-on quantity controls how the charge scales, including Mixed quantity when Allow multiple is on, which gives every value its own quantity box.

See Add-on pricing and Advanced add-on modes.

Examples

A long list with search

Setting	Value
Label / Name	Thread color
Option values	Forty color names
Search suggestion	On
Out of stock options	Hide
Required field	On
Not allow deselect	On

Several paid extras, capped

Allow multiple on, Max selections 3, each value priced, and Add-on quantity set to Mixed quantity so the customer can order two of one value.

A design chooser with live preview

Swatch style set to Image, an image on each value, and Personalizer on so the selected design is displayed on the product photo.

A mandatory size

Single-select, with Required field on, Not allow deselect on, and values linked to add-on products so sold-out sizes are hidden.

Notes

• Available on all plans.

• Works in Shopify POS.

• Values follow the order of the values table.

• Not allow deselect is hidden when Allow multiple is on, because it applies only to single-select.

• Min selections and Max selections appear only when Allow multiple is on.

• For a grid of large swatches rather than a list, use Color swatch or Image swatch, which support slider layouts.