Layout settings

Featured links

1. Shopify documentation on sections and blocks
2. Shopify documentation on customizing sections

Helpful videos

Shopify Academy video: Customizing your store

Shopify Academy video: Customizing your store

Use these settings to control how repeated content is displayed across desktop, tablet, and mobile. You can choose a grid or slideshow for each device size, then adjust how many items appear at once to suit your content and screen space. For a broader overview of how theme components are organized, see Shopify documentation on sections and blocks

Layout style

Layout style controls whether items appear in a fixed grid or a swipeable slideshow. This gives you flexibility to show more items at once on larger screens while keeping smaller screens easier to browse.

1. Choose Grid when customers should compare several items side by side.
2. Choose Slideshow when each item needs more focus or when space is limited.
3. Mix styles by device if needed. A grid on desktop and a slideshow on mobile is often a practical combination.

Pick layout style and column count together. Dense grids work best with simple content, while slideshows usually need fewer visible items and more room per card.

Column counts

Column counts control how many items appear in each row for each device size. Higher counts increase browsing density, but they also reduce the space available for images, titles, prices, and supporting details.

1. On desktop, higher column counts can work well for compact cards and broad item browsing.
2. On tablet, a separate count helps you avoid layouts that feel too tight on mid-sized screens.
3. On mobile, lower counts are usually easier to read and tap.

If the tablet column count is set to 0, tablet screens use the desktop column setting instead. This is useful when you want a consistent larger-screen layout, but it is worth checking that tablet cards still have enough space.

Tip

If item cards feel crowded, reduce the column count before changing text size or hiding details. Extra horizontal space usually improves clarity fastest.

Choosing the right density

The best layout depends on how much information each item needs to show. Simple image-led cards can handle denser layouts, while text-heavy or detail-rich cards usually need more space.

1. Use fewer columns for longer titles, multiple labels, prices, or extra metadata.
2. Use more columns for quick-scanning layouts with minimal text.
3. Use slideshow layouts when you want customers to focus on one item at a time instead of scanning a full row.

Usage notes

1. Start with content size. Choose your column counts based on how much text and imagery each item needs to show comfortably.
2. Check tablet separately. Inheriting the desktop column count can save time, but tablet layouts often need their own tuning.
3. Keep mobile tappable. Avoid mobile layouts that make cards too narrow or touch targets too small.
4. Use slideshow intentionally. Pick slideshow when focus matters more than showing the maximum number of items at once.
5. Preserve the default look when you want fallback styling. Blank, transparent, or default-style values usually keep the inherited appearance, while explicit colors, gradients, or media overrides make that area feel more independent. For setup details in the theme editor, see Shopify documentation on customizing sections