Media gallery

Product page

Customize the layout of your product page with options to change the size, position, and shape of your images.

STEPS

In your theme editor (Customize):

  1. Click on the Product overview section to open the settings.

  2. Select a Gallery style to change the layout of your product media for desktop and mobile screens.

    Grid displays product images in two columns.

    List displays product images in one column.

    Thumbnails displays all product images as small clickable images next to the main product image.

  3. (If mobile carousel selected) Choose whether to Enable looping, Show images full width, and Hide pagination dots.

  4. (For List and Grid styles) Choose to Hide gallery media after 1, 2, or 3 rows or never.

    A More media button will appear to reveal additional rows.

  5. Select the Gallery size of your product media. Either Small, Medium, Large, Extra Large.

    The width of the product details will increase or decrease according the gallery size.

  6. To make all product media a uniform shape, set the Image aspect ratio to crop your images to Square, Landscape, or Portrait.

    The default Natural setting displays the original orientation of your product media.

  7. Uncheck the Enable video looping checkbox to make product videos play a single time after customers click play.

    See Shopify's Product media ↗ guide to learn more.

  8. Uncheck the Enable image zoom option if you don't want your product images to appear in a full-size "lightbox" when clicked.

  9. Click Save.

Settings reference

Click the Product overview section to find the following settings.

Media

The following settings apply when Gallery style mobile is set to Carousel.

\


Related links

Breadcrumbs Navigation buttons Sticky product details

Last updated