Customize Your Product Details Page

Control how shoppers interact with product images and variant options on your store's product details page.

Choose how variants are displayed

You can present product options — size, color, quantity, and so on — in one of two styles:

• Dropdown — a compact menu-style selector. This is the default for existing stores.
• Pills — clickable button-style choices displayed directly on the page, which tends to make options more visible at a glance.

To set this:

1. Open the Store Builder and go to the Product Details Page.
2. Select the Product Element.
3. In the general settings panel, find Variants Styling.
4. Choose Dropdown or Pills.
5. Preview the change, then save and publish.

Note that Pills support only a single selection per variant group, and color customization for the quantity selector requires the Pills style. Switching a variant automatically updates the product image when a matching image exists.

Choose how product images zoom

You can also control how shoppers get a closer look at product photos:

• No Zoom — images display normally with no interaction.
• Click & Hover Zoom — customers magnify a specific area by clicking or hovering, best suited to desktop shoppers.
• Open Lightbox Zoom — clicking an image opens a full-screen popup with zoom and navigation between all of a product's photos.

To set this:

1. In the Store Builder, open the Product Details Page and select the Product Details element.
2. Find Image Zoom under Layout Settings.
3. Choose your preferred behavior.
4. Save and publish.

Image zoom works with the Stack Gallery, Stack Carousel, and Two-Column media layouts, and applies to images only — product videos are excluded from zoom behavior.