Horizontal scroll
How to use the Horizontal scroll block in the Meditative Folks Theme.
Horizontal scroll
At a glance
Lets child blocks scroll horizontally — useful for chip rows and compact galleries.
Used in
- Configure where this block is available in the parent section.
Settings
Scroll
| Setting | What it does | Default | Shows when |
|---|---|---|---|
| Show swipe hint | Displays helper text below the scroller on mobile. | Yes | Always |
| Show scroll buttons | Turns “Show scroll buttons” on or off on the storefront. | No | Always |
| Gap between items | Controls “Gap between items” on the storefront. Open the theme editor to preview live. | 16 | Always |
| Visible items (mobile) | Use decimals like 1.2 to show a peek of the next item. Whole numbers show full items only. | 1.2 | Always |
| Visible items (tablet) | Use decimals like 1.2 to show a peek of the next item. Whole numbers show full items only. | 2.2 | Always |
| Visible items (desktop) | Use decimals like 1.2 to show a peek of the next item. Whole numbers show full items only. | 3.2 | Always |
| Accessible label | Describes the scrollable region for screen readers. Leave blank to use the default. | — | Always |
Padding
| Setting | What it does | Default | Shows when |
|---|---|---|---|
| Padding top | Adds empty space (padding top) around the section content. | 0 | Always |
| Padding bottom | Adds empty space (padding bottom) around the section content. | 0 | Always |
| Padding left | Adds empty space (padding left) around the section content. | 0 | Always |
| Padding right | Adds empty space (padding right) around the section content. | 0 | Always |
Setting details
Each control from the tables above, explained simply:
Show swipe hint
Displays helper text below the scroller on mobile. Default: Yes.
Show scroll buttons
Turns “Show scroll buttons” on or off on the storefront. Default: No.
Gap between items
Controls “Gap between items” on the storefront. Open the theme editor to preview live. Default: 16.
Visible items (mobile)
Use decimals like 1.2 to show a peek of the next item. Whole numbers show full items only. Default: 1.2.
Visible items (tablet)
Use decimals like 1.2 to show a peek of the next item. Whole numbers show full items only. Default: 2.2.
Visible items (desktop)
Use decimals like 1.2 to show a peek of the next item. Whole numbers show full items only. Default: 3.2.
Accessible label
Describes the scrollable region for screen readers. Leave blank to use the default. Default: —.
Padding top
Adds empty space (padding top) around the section content. Default: 0.
Padding bottom
Adds empty space (padding bottom) around the section content. Default: 0.
Padding left
Adds empty space (padding left) around the section content. Default: 0.
Padding right
Adds empty space (padding right) around the section content. Default: 0.
Tips
- Place this block inside a wrapper if it should only show on certain screen sizes.
- Preview in the theme editor on mobile and desktop.