Section Spacing and Padding

Most Array sections include padding controls. Padding creates space inside the top and bottom of a section.

Padding Settings

Many sections include:

• Top padding: Space above the section content on desktop.
• Bottom padding: Space below the section content on desktop.
• Mobile top padding: Space above the section content on mobile.
• Mobile bottom padding: Space below the section content on mobile.

Some sections use slightly different labels, such as Desktop top padding or Padding top, but the behavior is the same.

How to Adjust Section Spacing

1. Open the section in the theme editor.
2. Scroll to the Padding or Spacing settings.
3. Increase top padding to create more space above the section content.
4. Increase bottom padding to create more space below the section content.
5. Use the mobile padding settings to fine-tune mobile spacing.
6. Preview desktop and mobile before saving.

Recommended Approach

• Use section padding for normal spacing between sections.
• Use the Spacer section when you need a larger intentional gap.
• Avoid using empty Rich text, Image, or Custom Liquid sections just to create space.
• Keep mobile padding smaller than desktop padding when the page feels too long on mobile.
• If two neighboring sections both feel too far apart, reduce the bottom padding of the first section or the top padding of the next section. You usually do not need to reduce both.