Media and layout

General

With the Big Image Media and Layout Settings, you can customize the product page to highlight the best aspects of your products.

Settings to customize

In the main level of the product section you can: 

  • Enable breadcrumbs.
  • Select suitable color scheme that complements your store design.
  • Select the product image aspect ratio:
    • Natural 
    • Portrait 2:3 
    • Portrait 3:4
    • Square 1:1
    • Landscape 4:3
  • Choose media fit: Fill or Original.

Desktop layout settings

  • Featured image size: Select a size to fit your store's design.
  • Featured image start column: Adjust the horizontal position of the image.
  • Block content top margin: Adjust the space above the content columns.
  • Select left and right column width.

Tablet layout settings

On tablet and mobile devices the content columns are displayed below the product featured image.

  • Enable single column layout.
  • Extend tabled breakpoint:
    • When enabled the tablet layout will be used up to 1200px viewports. This will give more room for content columns.

Mobile layout

On mobile devices the content columns will be displayed in a single column below the product featured image.

Hotspots

  • Select hotspot color and hotspot label color.
  • Hide hotspot titles on mobile if needed.

Collapsible rows

  • Enable collapsible rows to open as drawers.

Sticky buy bar

  • Show or hide a sticky buy bar.
  • Choose its color scheme.

After the section level settings, continue customizing with Product section Blocks.


    Recommendations section

    Product recommendations section is a static section which is displayed below currently viewed product and it shows a list of product recommendations.

    Its logic is based on different factors. Please refer to this guide to learn more about Shopify product recommendations logic and to this guide to learn how to further customize these recommendations.