Spacing and Scroll to top

Two small sections that solve one job each: Spacing inserts an empty vertical gap between two sections, and Scroll to top adds a floating button that returns the shopper to the top of the page.

Spacing

Add it from Add section under Layout, then drag it between the two sections you want to separate.

• Height: the gap's height in pixels, from 10 to 200.
• Color scheme: the gap's background, so it can blend with the section above or below.

Reach for it when two specific sections need extra distance on one page. When every section needs more breathing room, adjust the sections' own Margin instead (Common section settings); a page full of Spacing sections is harder to maintain than a few margin values.

Scroll to top

The button lives in the Overlays group, which sits at the bottom of the section list on every page.

1. In the theme editor, expand Overlays at the bottom of the sidebar.
2. Click Add section inside the group and choose Scroll to top.

A store can have one Scroll to top section. The button appears once the shopper has scrolled down and floats in the chosen corner.

• Color scheme: the colors for the button.
• Button style: Primary or Secondary, matching your theme's button styles.
• Alignment: which corner holds the button, Left or Right.
• Show on home page, Show on pages, Show on product pages, Show on blog posts, Show on other pages: pick the page types that get the button.

The section also uses the standard Visibility control. See Common section settings.

Tips

• On long pages (a collection with infinite scroll, a long blog post) the Scroll to top button saves the most work; that is where to turn it on first.
• Keep the button on the side opposite any chat widget so the two do not overlap.