1. Docs
  2. Sections
  3. Products & collections

Products & collections

Scrolling product row

A horizontal row of products that visitors scroll with a swipe or a drag. It can show collection tabs, and a custom cursor label follows the mouse.

17 section settings1 block type · 2 settingsAvailable on every template

Add the section#

Available on every template.

  1. From your Shopify admin, go to Online Store > Themes, then click Customize next to Opaline.
  2. Use the page selector at the top of the editor to open the template you want to change.
  3. In the sidebar, click Add section where you want it to appear.
  4. Select Scrolling product row. Click the section in the sidebar to open its settings.
  5. Click Save in the top right corner when you are done.

Settings#

General

Overline
Text

The text shown in this place.

Heading
Rich text

Formatted text: bold, italic and links are kept.

Heading size
Slider
Default: 100%From 60 to 180%, in steps of 5
Products per tab
Slider
Default: 8From 4 to 16, in steps of 1
Card width
Slider
Default: 34remFrom 22 to 52rem, in steps of 2
Image ratio
Dropdown
Default: PortraitSquareLandscape
Product name alignment
Dropdown
Default: CenteredLeft
Cursor label
Text

The text shown in this place.

Header link label
Text

The text shown in this place.

Header link
Link

Where the link leads: a product, a collection, a page, or any web address.

End-of-rail card label
Text

The text shown in this place.

End-of-rail card link
Link

Where the link leads: a product, a collection, a page, or any web address.

Background
Gradient

A CSS background, for example a gradient.

Color scheme
Color scheme

The color scheme of the section. Schemes are set under Theme settings > Colors.

Default: Scheme 1
Top padding
Slider
Default: 120pxFrom 0 to 240px, in steps of 4
Bottom padding
Slider
Default: 120pxFrom 0 to 240px, in steps of 4
Heading typeface
Dropdown

Theme default follows the section heading font chosen in Theme settings > Typography.

Default: Theme defaultHeading fontBody fontSans-serif heading font

Blocks#

Click Add block under the section in the sidebar to add one, then drag blocks to reorder them.

Tab#

Up to 5 per section

General

Collection
Collection

Choose one of your collections.

Tab label
Text

Leave empty to use the collection name.

Good to know#

Tip

The Cursor label appears inside a glass bubble that follows the mouse over the row. Near the quick view and quick add buttons of a card, the bubble steps aside so visitors can click.