Sampo
documentation

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

  • Image position: Choose whether the image appears on the left, center or right.
  • Image horizontal offset: Adjust the image's horizontal alignment.
  • Allow content to overlap image: Enable to let text and images overlap.
  • Image size: Select a size to fit your store's design, XS, S, M, L or XL.
  • First content column top margin: Adjust the vertical space above the first column.
  • Second content column top margin: Adjust the vertical space above the second column.

When the image is centered, the content columns will automatically split to the left and right.

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.