[P] Selector types

When adding product variants, selectors will be displayed on your product page to allow buyers to select the correct variant. Prestige offers a wide range of selector types so that you can choose the most appropriate ones for your business.

Selector types are separated into two types:

  • Color selectors: those apply to options that are named "Color." To take advantage of them, you need to set up color swatches. Learn more about color swatches.
  • Standard selectors: those apply to all other options (for instance, size, material, or length options).

You can choose a different selector type for each. For instance, you can show color options as swatches but other options as dropdowns.

Changing selector type

To change the selector type, open the theme editor and navigate to the product page. Then, click on the "Variant selector" block type for the product section, and change the selector type settings. The screencast below outlines each step:

Selector types

Block mode

This type is applicable to both standard and color options. It displays options as blocks:

This selector type is ideal if you have between 1 and 5 option values with short text. It helps your customers to visualize all the options and select them more easily immediately. However, it can become overwhelming if you have many options.

Dropdown mode

This type is applicable to both standard and color options. It displays options as a dropdown:

It only shows the selected option by default, while other choices are displayed on click. It is the best choice if you have a long list of options but still want to preserve a clean, minimalistic look.

Color swatches

This type is only applicable to color options. It allows you to show color options using small swatches. This makes it an ideal choice to create a more appealing appearance while making it easier for buyers to visualize the options.

Block with color choices

This type is only applicable to color options. It mixes the block and color swatch approaches. This is a good choice when the color name is as important as the color itself (for instance, for marketing reasons).

Variant images

This type is only applicable to color options. Instead of displaying color swatches, it shows the image associated with the variant itself. Learn more about this feature.