Featured links
Last updated
Was this helpful?
Last updated
Was this helpful?
Use the Featured links section to show large links with an image showcase that changes when links are hovered over.
Editing templates will change all pages that use the same template. for different page layouts, or in the same template.
In the editor side panel, click (+) Add section and select Featured links. Click and hold the drag handles ⋮⋮ to re-order sections.
Click the section to edit general section styles for colors and spacing, available in all sections:
Click a Link block to add a URL and text for the featured links. Click and hold the drag handles ⋮⋮ to re-order link blocks.
Click Link block to find settings
Link URL
Select a page or URL for the link.
Link label
Enter text for the link.
Image
Underline
When enabled, the link text will be underlined.
In the section settings, change the layout and text styles of the featured links.
Choose the display style for desktop and mobile
Change the text font and size
Adjust the line height between links
Choose the separator style between links
Click Featured links section to find settings
Link text font
Choose the font for the link text, as selected in your theme settings.
Heading Default Body
Text link size
Change the font size for all link text from small to large.
1 - 8 Default: 3
Link line height
Adjust the amount of vertical space between links.
1 - 2 Default: 1.3
Desktop display style
For desktop screens, change the layout of links.
Inline Default Stacked
Mobile display style
For mobile screens, change the layout of links.
Inline Default Stacked
Inline link style separator
For "Inline" style, choose the character that separates each link.
Comma spaced Default Dash Forward slash
If a featured link points to one of your collections, you can display the number of products in that collection.
Click Featured links section to find settings
Show product counts
When enabled, featured links to collections will display the number of products in the collection.
Display an image next to the featured links. When hovering over a featured link, display an image.
Click Featured links section to find settings
Enable image showcase
Display an image that changes when links are hovered over.
Default showcase image
Select or upload an image to display first, before links are hovered over. If no image is uploaded, the default will be the first link's image.
Image width
For mobile screens, adjust the space between content blocks.
40 - 60 %
Image position
Display the image showcase on the left or right of the featured links.
Left Right
Aspect ratio
Crop the image to a uniform shape, or select Natural to maintain its original shape.
"Aspect ratio" refers to the proportion between the image's width and height (W:H).
Natural Default Portrait (2:3) Portrait (4:5) Square (1:1) Landscape (5:4) Landscape (3:2)
Show thumbnails on mobile
On mobile, display images next to the featured links. Only applies to "Stacked" mobile display style.
Add a Heading above the featured links and a Button below.
Click Featured links section to find settings
Heading
Enter heading text to show above the featured links.
Heading size
Change the size of the heading text from small to large.
1-8 Default: 8
Heading tag
H1 - H6
Button link
Select a page or URL for the button.
Button label
Enter text for the button.
Button style
Choose the visual style of the button.
Solid Default Outline Text
Select or upload an image that displays when the link is hovered over. The must be enabled.
Change the heading tag to modify the page structure. Use H2 to indicate important topics, and use H3-H6 for related topics. Learn how to . This option doesn't change the heading's appearance.
Section colors
Section width
Section padding
