> For the complete documentation index, see [llms.txt](https://modutheme.gitbook.io/helix/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://modutheme.gitbook.io/helix/footer-group/available-blocks.md). # Available Blocks The footer is built from nested containers: a **Row** holds one or more **Columns**, and each Column holds your content blocks. A few blocks sit directly in the footer, outside any Row. ![Footer block hierarchy — Row and Column containers holding content blocks](https://3215967854-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FlyCMfKbEVTf3hu8uxjSZ%2Fuploads%2Fgit-blob-fd098bff13040f34854cef104df3d78917d5a723%2Ffooter-group-block-hierarchy.png?alt=media) **Directly in the footer:** Row, Logo, Divider, Carousel, Group, Marquee *** ## Logo Shows your shop logo in the footer. This block controls the display size and which logo variant to use. The logo image is uploaded in [Logo and Favicon](/helix/theme-settings/logo-and-favicon.md). The Logo block can be placed **directly in the footer** (outside any Row) or **inside a Column**. The default footer places it directly in the footer, centered between two Dividers. | Setting | Description | | ------------- | ------------------------------------------------------------------------- | | Style | Switch between the main logo and the transparent logo variant. | | Width | Stretch the logo to the column width, or set exact widths per breakpoint. | | Desktop width | The logo width on desktop, shown when Width is custom. | | Mobile width | The logo width on mobile, shown when Width is custom. | | Padding | Vertical spacing around the logo. | *** ## Divider A horizontal line placed **directly in the footer**, outside of any Row. Use it to separate a top content area from a bottom bar. | Setting | Description | | ------------- | ----------------------------------------------------------- | | Thickness | The thickness of the line. | | Corner radius | Rounds the line ends. Appears when thickness is increased. | | Full width | Extends the line across the full footer width. | | Type | Use the color scheme's border color, or set a custom color. | | Padding | Vertical spacing around the divider. | {% hint style="info" %} This block is different from the **Divider (inline)** global block, which is placed inside a Column to separate content within it. {% endhint %} *** ## Carousel A horizontal slider placed **directly in the footer**, outside of any Row, showing its Slide blocks a few at a time with navigation, pagination, and autoplay. See [Carousel](/helix/theme-blocks/layout/carousel.md) for its full settings. *** ## Group A container placed **directly in the footer** (or inside a Column) that arranges nested blocks in a row or column, shares a background, or wraps them in a single link. See [Group](/helix/theme-blocks/layout/group.md) for its full settings. *** ## Marquee A continuously scrolling strip of content placed **directly in the footer**, outside of any Row. See [Marquee](/helix/theme-blocks/layout/marquee.md) for its full settings and the blocks it accepts. *** ## Row The main layout container. Columns inside a Row sit side by side on desktop and stack on mobile. {% hint style="info" %} Add a second Row for a bottom bar. A common pattern: the top Row holds a logo and menus, the bottom Row holds copyright and policy links. {% endhint %} | Setting | Description | | --------------------- | ------------------------------------------------- | | Alignment | Vertical alignment of the columns within the row. | | Gap — Desktop | Space between columns on desktop. | | Gap — Mobile | Space between columns on mobile. | | Padding Top / Bottom | Vertical spacing inside the row. | | Custom mobile padding | Set separate padding values for mobile. | On tablet (between the `md` and `lg` breakpoints), every row reflows into a 2-column grid so columns don't become too narrow. ### Column Columns are the direct children of a Row. By default each column stretches to fill an equal share of the row. A Column can hold **Menu**, **Logo**, **Copyright**, **Policy Links**, and **Follow on Shop**, plus every global block — Text, Heading, Subheading, Image, Icon, Divider (inline), Email Signup, Social Media Links, Payment Icons, Localization, Quick Links, and Group. ![Blocks nested inside a footer Column](https://3215967854-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FlyCMfKbEVTf3hu8uxjSZ%2Fuploads%2Fgit-blob-af79922fd518f6646832cefa76a070ef05872777%2Ffooter-group-block-column.png?alt=media) | Setting | Description | | ---------------------------- | ----------------------------------------------------------------------- | | Width | Give the column an equal share of the row, or set a fixed percentage. | | Custom width | The percentage width, shown when Width is set to custom. | | Desktop alignment | Horizontal alignment of the blocks inside the column on desktop. | | Show right border on desktop | Adds a vertical line on the column's right edge on desktop. | | Gap — Desktop / Mobile | Space between blocks inside the column. | | Padding | Spacing inside the column; a right value appears when the border is on. | | Custom mobile padding | Set separate padding values for mobile. | {% hint style="info" %} To create a 40 / 20 / 40 three-column layout: set the middle column to **Custom** at 20% and leave the two outer columns on **Fill**. They share the remaining space equally. {% endhint %} #### Menu Renders a navigation menu from your Shopify admin. On mobile it can collapse into an accordion to save space. **Menu** — Select any menu from [**Online Store → Navigation**](https://help.shopify.com/en/manual/online-store/menus-and-links). Enter a value in **Heading** to label it. {% hint style="info" %} When **Collapse menu on mobile** is on and **Heading** is left empty, the heading falls back to the menu's name — the accordion always needs a label to tap. With the accordion off and **Heading** empty, no heading renders at all. {% endhint %} The menu can **collapse into a tap-to-open accordion on mobile** (with a chevron or plus icon). You can also set the **gap** below the heading and between items, plus **typography** — font, HTML tag, size, letter spacing, and color — separately for the heading and the menu items. {% hint style="info" %} Set the **HTML tag** to a real heading level for accessibility and SEO. Choosing **Paragraph** renders the heading as plain text with no semantic value. {% endhint %} #### Copyright A rich-text block for your copyright line. | Setting | Description | | ------- | -------------------------- | | Text | Your copyright text. | | Size | The text size of the line. | | Color | The text color to use. | {% hint style="info" %} The text is static — the year does not update on its own. Edit the field to change the year or wording. {% endhint %} #### Policy Links Shows links to your store's legal policy pages — Refund, Privacy, Terms of Service, and Shipping — automatically. No manual setup is needed, and the list updates when you add or rename a policy. | Setting | Description | | ------- | --------------------------------- | | Gap | Horizontal spacing between links. | | Size | The text size of the links. | | Color | The text color to use. | {% hint style="info" %} Legal pages are managed in **Shopify Admin → Settings → Policies**. A policy with no content will not appear as a link. {% endhint %} #### Follow on Shop Shows a **Follow on Shop** button so customers can follow your store in the Shop app. Only padding settings are available — Shopify controls the button's appearance. The button is hidden if your store is not eligible. {% hint style="info" %} For the button to show, the **Shop channel must be installed** and **Shop Pay activated**. The block renders nothing if your store does not meet these requirements.\ [→ Shopify: Add Shop buttons to your theme](https://help.shopify.com/en/manual/online-store/themes/customizing-themes/add-shop-buttons) {% endhint %} #### Global blocks These blocks are available in all sections across the theme. Place them inside a Column for standard footer use. | Block | Description | | ------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------- | | [**Text**](/helix/theme-blocks/basic/text.md) | Rich-text area for an address, tagline, or short disclaimer. | | [**Heading**](/helix/theme-blocks/basic/heading.md) | A single heading line with a configurable semantic level. | | [**Subheading**](/helix/theme-blocks/basic/subheading.md) | A small label line. | | [**Image**](/helix/theme-blocks/basic/image.md) | An inline image. | | [**Icon**](/helix/theme-blocks/basic/icon.md) | An inline icon from the theme's icon set. | | [**Divider (inline)**](/helix/theme-blocks/layout/divider.md) | A thin line separating content within a Column. | | [**Email Signup**](/helix/theme-blocks/forms/email-signup.md) | A subscription form that adds subscribers to your customer list. | | [**Social Media Links**](/helix/theme-blocks/links/social-media-links.md) | Icons linking to the profiles set in [**Theme Settings → Social Media**](/helix/theme-settings/social-media.md). | | [**Payment Icons**](/helix/theme-blocks/footer/payment-icons.md) | Icons for your accepted payment methods, pulled from Shopify Payments. | | [**Localization**](/helix/theme-blocks/utilities/localization.md) | Currency and language selectors. | | [**Quick Links**](/helix/theme-blocks/utilities/quick-links.md) | A compact inline row of links from a flat menu. | | [**Group**](/helix/theme-blocks/layout/group.md) | A container that arranges blocks in a row or column. |