This guide describes setting up the Scrolling collection links section.
Use the section on a page to display links to a selection of collections using a scrolling text animation.
The previous video shows a Scrolling collection links section on a store's home page. In the upper left, part of Theme editor's section menu is displayed. The menu's Collection media display option is set to Hover. The setting specifies how media (collection images) are displayed inside the section. The Hover option displays media when the cursor is placed over an item ("mouse over") inside the section.
In Theme editor, at the top of the page, use the dropdown to select a page that contains a Scrolling collection links section.
The section can be added into any page, except Checkout and Giftcard pages. To add the section into the current page, select Add section > Scrolling collection links. Refer to Shopify help: Add a section.
From the side menu, select Scrolling collections (links).
Select a setting described in the following table.
Use the Collections selector options to choose your store's collections to display inside the section.
Mobile font size scale
Adjust the Mobile font size scale slider to set a font size for the section's (collection links list) item text on mobile display devices. The minimum value is -2 and the maximum is 4.
Desktop font size scale
Adjust the Desktop font size scale slider to set a font size for the section's (collection links list) item text on desktop display devices. The minimum value is -2 and the maximum is 9.
Use the Font setting to specify a font for the section's text. Set the section's text to use the same font as Heading or Body text.
Collection media display
Use the Collection media display setting to specify how media are displayed inside the section. To hide media, select None. The Hover option displays media when the cursor is placed over an item ("mouse over") inside the section. The Inline option displays media beside each item's title inside the section.
Adjust the Speed slider to specify a scroll speed between 20 and 400 (seconds) for the section's scrolling text.
Use the Direction setting to set the section's scrolling text to move from Right to left or Left to right.
Use the Separator setting to select a symbol to use between lines of repeatedly scrolling text.
Adjust the Repeat separator slider to set how many scrolling text separator symbols are displayed between lines of repeatedly scrolling text. The slider ranges from 1 to 6.
Spacing between repeated separators
Use the Spacing between repeated separators setting to specify a style for the spacing that's applied between each scrolling text separator symbol.
Color > Color scheme
Use the Color scheme options to select a color scheme for the section. Refer to Colors.
Color > Theme settings (link)
Follow the Theme settings link to open Theme editor's Color theme settings. Use the settings to edit the theme colors for your entire store.
Select Custom CSS. In the box, enter custom CSS styles to apply only to the current section. Refer to Shopify help: Add custom CSS. To apply custom styles to your entire online store, refer to Theme settings > Custom CSS.
Select Remove section to delete the section from the current page.