Variant Selector Display Options on Product Page

We’ve introduced flexible display options for product selectors on the Product Details Page (PDP), providing merchants with enhanced control over how customers select product variants and pricing options. The selector UI is now more visual, consistent, and optimised for various devices.

Key Enhancements Include:

1. Variant Picker Style Options

• Merchants can now decide how variants are displayed on the PDP.
• Two display formats are available:

  Dropdown

  or

  Pills

  .

• The Pills layout clearly showcases all options, enhancing discoverability and making selection more intuitive for customers.

2. Unified Selector Experience

• Variant selectors, quantity pickers, upsell options, and multi-price selectors now follow a consistent UI pattern across both desktop and mobile.
• The same selector behaviour is reflected in both

  Page Builder

  and

  Builder Preview

  .

3. Price Selector Styling Alignment

4. Improved Rendering & Mobile Fixes

5. Quantity Selector Updates

1. Open your

   Store Builder

   and edit the Product Details Page.

2. Select the

   Product Element

   .

3. In the settings panel, locate

   Variants styling

   .

4. Choose either

   Dropdown

   or

   Pills

   display.

5. If using Pills, customise the colour styles for selected and unselected states.
6. Save and publish your changes.

• Dropdown remains the

  default variant display format

  for existing stores.

• The Pills style visually presents all variant options and supports

  single selection per variant group

  .

• The selector UI now behaves consistently across

  variants, pricing options, quantity selectors, and upsells

  .

• Improvements apply to both

  desktop and mobile storefront experiences

  .