Appearance
Scrolling text with icons ​
This guide describes the Scrolling text with icons section.
For general guidance with modifying sections, refer to Sections overview, and Shopify help: Sections and blocks.
Configure the Scrolling text with icons section ​
To configure your Scrolling text with icons section:
Go to Customize theme.
In Theme editor, at the top of the page, use the dropdown to select a page that contains a Scrolling text with icons section.
Note
The section can be added into any page, except Giftcard and Customer pages. To add the section into the current page, select Add section > Scrolling text with icons. Refer to Shopify help: Add a section.
From the side menu, select Scrolling text with icons.
Select a setting described in the following table.
| Setting name | Description |
|---|---|
| Repeat text | Set the Repeat text checkbox to on or off. With this setting enabled, the section's scrolling text repeats automatically - to create an infinity effect. Note that, if a user's device is set to reduce motion, the scrolling text will display as a static banner as a fallback. |
| Link | In the Link box, enter a URL or select a link to a page. |
| Font | Use the Font options to select Heading or Body. |
| Gap between items | Use the Gap between items options to select Small, Medium or Large. |
| Icon size | Use the Icon size options to select Small, Medium or Large. |
| Speed | Adjust the Speed slider between 10 and 400. |
| Direction | Use the Direction options to select Right to left or Left to right. |
| Icon style > Thickness | Adjust the Thickness slider between 1 and 2. |
| Icon style > Background color | Use the Background color options to select Transparent, Accent 1, Accent 2, Card or Text. |
| Icon style > Show border | Set the Show border checkbox to on or off. |
| Color > Color scheme | Use the Color scheme selector to select a color scheme. |
| 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. |
| Color > Use gradient for background | Set the Use gradient for background checkbox to on or off. |
| Theme settings | If available, select Theme settings to access additional settings for the section. Refer to Section theme settings menu. |
| Custom CSS | 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. |
| Remove section | Select Remove section to delete the section from the current page. |
Configure a block within a Scrolling text with icons section ​
To configure a block for your Scrolling text with icons section:
Go to Customize theme.
In Theme editor, at the top of the page, use the dropdown to select a page that contains a Scrolling text with icons section.
From the side menu, expand the Scrolling text with icons section menu.
To configure an existing block, select the block from the side menu.
To add a new block, select Add
block-name, and then select the block you added.Note
Inside the section, you can add, remove, show, hide, and move blocks. Refer to Configure blocks inside a section, and Shopify help: Sections and blocks.
Apply a block setting described in the following table.
| Block name | Block description | Block setting(s) |
|---|---|---|
| Text | Displays text, side-by-side, with an icon inside the section. |
|