Layout
General
The layout settings allow you to control the overall appearance and spacing of your theme. With these settings, you can define different spacing values for desktop and mobile devices, ensuring your store looks great on any screen size.
Page Width
Set the maximum width of your content area in pixels. The value determines how wide your main content can stretch.
Section Padding
Control how much padding is added to the top and bottom of all sections. Choose from sizes XS to XL.
Layout Settings for Desktop and Mobile
Page Margin
Defines the space around the main content throughout the theme.
Grid gap
Determines the spacing between repeating elements inside sections or templates.
Custom spacing
You can use the Custom Spacing block at the section level to set unique padding values for any section.
Steps
- Open the theme editor and select the section you want to edit.
- Click the section name to open its settings, then find and click "Add block."
- Select "Custom Spacing" and define the padding values for the section.
- The values you set here will override the general padding settings in the theme.
Summary and Tips
- Use smaller padding for mobile to improve usability.
- Experiment with spacing settings to see what best suits your store’s design.
- Custom Spacing blocks offer flexibility to tailor specific sections to your needs.