Skip to main content
Layout settings control the fundamental structure and spacing of your store pages. These settings determine how content spreads across the screen, how much whitespace appears between sections, and the overall visual rhythm of your site.

​
What these settings control

  • Maximum page width
  • Section vertical spacing
  • Content distribution across screen sizes
  • Overall site proportions
  • Whitespace and breathing room

​
How to access

1

Open the Theme Customizer

From your Shopify admin, go to Online Store → Themes → Customize.
2

Navigate to layout settings

In the theme editor sidebar, select Theme settings → Layout.
3

Adjust width and spacing

Configure page width and section spacing using the controls.
4

Save changes

Click Save to apply layout changes to your entire store.

​
Settings

Page width: Sets the maximum width for your site’s content container.1200px - 1400px: Standard width (recommended for most stores)
1400px - 1600px: Wide layout (requires high-quality images)
1000px - 1200px: Narrow layout (better for text-heavy content)
Match your page width to your image quality. Wider layouts require higher resolution images.

​
Best practices

  • Match page width to your image quality and content type
  • Use Medium spacing as default, adjust based on brand positioning
  • Test layout on actual devices at different screen sizes
  • Match section spacing to your section count (more sections need tighter spacing)
  • Consider mobile experience when choosing wide layouts
Changing page width after launch requires reviewing all sections, banners, and images to ensure they still look good at the new width.
  • Colors - Configure color schemes for sections
  • Typography - Set font sizes that work with your layout
  • Performance - Optimize large layouts for loading speed