How to set up the inline link list section

The inline link list section displays a flexible list of links arranged in multiple rows, providing easy navigation to important pages or categories.

Section settings

Heading: Set a title for this section. This is optional.

Subheading: Set a subtitle for this section. This is optional.

Heading alignment: Select the alignment for the heading and subheading. Options: Left, Center, Right.

Links

Open links in new window: Select whether links should open in a new tab or the same tab.

Layout

Section width: Adjust whether this section should span the full width of the page (100%) or be contained within a limited layout. Applies on desktop. On mobile, the section spans the entire width of the screen.

Section inner max width (px): Set the maximum width of the content inside this section in pixels.

Section left/right gutter: Adjust the left and right spacing of the section relative to the viewport edge on narrow screens.

Vertical inner spacing: Adjust the spacing between the content and the top/bottom edges of this section in pixels.

Vertical outer spacing: Adjust the space between this section and the sections above and below it in pixels.

Styles

Link style: Select the style for the links. Options: Default, Pill, Underline, Tag.

Link alignment: Select the alignment for the links. Options: Left, Center, Right.

Font scale: Adjust the overall scaling of text for the inline links, affecting the link heading text proportionally.

Section heading color: Choose the color of the section heading.

Section subheading color: Choose the color of the section subheading.

Section background color: Choose the background color for the inline link list section.

Link primary color: Set the primary color for the link. If you select the “Default” or “Underline” style, it affects the link color and the border color. If you choose “Pill” or “Tag” style, it affects the background color of the button.

Link secondary color: Set the secondary color for the link. If you select the “Pill” or “Tag” style, it affects the heading color of the link.

Link

Heading: Set a title for the link heading.

Link: Set the destination for the link (e.g., page, collection, product, external link, etc.).