Quick links
Theme section
Display a row of Quick links with custom button shapes and styles.
Set up section
Add this section to any template (except Checkout) and use the drag-and-drop handles to re-order its position. You can add this section multiple times with different content and settings.
Editing a template changes all pages that use that template. To edit specific pages, you can you can create new templates or insert dynamic content with metafields.
Settings reference
Block settings
Click a Links block to find the following settings.
| Setting | Description |
|---|---|
Link | Paste or select a link for the quick link button. |
Link text | Enter text for the quick link label. |
Section settings
Click the Quick links section to find the following settings.
Header
| Setting | Description |
|---|---|
Center header content | Choose to display headings as center-aligned within section. Uncheck this option to align headings to the left. |
Accent | Add text to show a small heading above the main section heading. |
Heading | Add text to show a main heading above the section. |
Subheading | Add text to show a subheading below the main heading. |
Maximum text width | Set the maximum width of heading text between 400 and 1000 pixels. |
Links
| Setting | Description |
|---|---|
Select links to show | Choose to use a Custom list of links or a Menu from your Shopify admin. |
Menu (Shopify Admin) | Select a menu from your Shopify admin for the quick links. |
Link styling
| Setting | Description |
|---|---|
Font | Choose to use a Custom list of links or a Menu from your Shopify admin. |
Text size | Select a menu from your Shopify admin for the quick links. |
Shape | Change the shape of the Quick links: either Pill, Slightly rounded, or Rectangle. |
Color | Change the color of the links. Select Current text to use default colors or use variant colors based on your theme colors: either Primary, Secondary, or Tertiary. |
Show outline | Choose to display a border around the quick links. |
Layout
| Setting | Description |
|---|---|
Desktop layout | Choose to display links as a Slider or select Wrap to display the links in multiple rows. |
Mobile layout | Choose to display links as a Slider or select Wrap to display the links in multiple rows. |
Alignment | Display headings either to the Left, Center, or Right within the section. |
Section colors
| Setting | Description |
|---|---|
Color scheme | Change the color scheme applied to the section text and background. Select the Default color scheme from your theme settings or select a variant scheme based on the default colors: either Inverse, Soft, Accent, or Sale. You may also select one of the two custom color schemas. Learn more about Color schemes. |
Override with custom colors | Check this option to apply custom colors to the section. These colors will override the color scheme. |
Text color | Select a custom color for all text in the section header. This setting applies only if the Override with custom colors option is enabled. |
Background color | Select a custom color for the section background. This setting applies only if the Override with custom colors option is enabled. |
Section style
| Setting | Description |
|---|---|
Top spacing | Increase or decrease the amount of space above the section. |
Bottom spacing | Increase or decrease the amount of space below the section. |
Enable animation | Choose whether to display visual effects when scrolling, hovering, or interacting with the section. See the Animation guide to learn more. |
Related links
Last updated