Footer
The footer is a grid of blocks. Each block chooses how many columns it spans, so you can lay out a brand column, a few menus and a newsletter form in any order. Below it, an optional big wordmark and the bottom bar with copyright, selectors, payment icons and policy links.
How to set it up
Step 1: Set the grid
- Under Footer, click Footer.
- Set the number of Columns (1) on desktop and Mobile columns (2).
- Pick a Wordmark (3): none, your store name as text, or an image.
Step 2: Add blocks
- Brand: logo and social icons. Menu: any menu, in one or two link columns. Newsletter: an email sign-up. Text, Social icons and Image for the rest.
- Group lays out its own blocks in columns, for example two menus side by side on phones.
- In each block, Placement sets the columns it spans on desktop and whether it is full width on mobile.
Step 3: Set up the bottom bar
- Choose the layout, copyright text, selectors, Follow on Shop, payment icons, policy links and Powered by Shopify.
Settings reference
Footer
| Columns | |
|---|---|
| Columns | Blocks can span several columns (Placement in each block). |
| Mobile columns | Options: 1, 2. |
| Spacing | Slider. |
| Spacing on mobile | Slider. |
| Wordmark | |
| Wordmark | Options: None, Text, Image. |
| Wordmark text | Defaults to the store name. |
| Wordmark image | An image from your files. |
| Width | Slider. |
| Bottom bar | |
| Layout | Options: Spread out, Center. |
| Copyright text | Shown after © and the year. Empty: the store name. |
| Country/currency selector | Turns this on or off. |
| Language selector | Turns this on or off. |
| Show Follow on Shop | Lets customers follow your store in the Shop app. Requires Shop Pay. |
| Payment icons | Turns this on or off. |
| Policy links | Turns this on or off. |
| Powered by Shopify | Turns this on or off. |
Brand
| Show logo | The logo comes from Theme settings > Logo. |
|---|---|
| Logo width | Slider. |
| Text | |
| Typography | Options: Body, Caption, Large body, Subheading. |
| Font scale | 100% is the size of this style in Theme settings > Typography. |
| Show social icons | Turns this on or off. |
| Social icon style | Options: Plain, Circle, Outline. |
| Placement | |
| Columns to span on desktop | Slider. |
| Full width on mobile | Turns this on or off. |
Menu
| Heading | |
|---|---|
| Menu | A menu from Content > Menus. |
| Link columns | Options: 1, 2. |
| Typography | Options: Body, Caption, Subheading. |
| Font scale | 100% is the size of this style in Theme settings > Typography. |
| Placement | |
| Columns to span on desktop | Slider. |
| Full width on mobile | Turns this on or off. |
Newsletter
| Label | |
|---|---|
| Heading | |
| Text | |
| Form layout | Options: Field and button side by side, Button under the field. |
| Placement | |
| Columns to span on desktop | Slider. |
| Full width on mobile | Turns this on or off. |
Group
| Columns | Slider. |
|---|---|
| Mobile columns | Slider. |
| Spacing | Slider. |
| Placement | |
| Columns to span on desktop | Slider. |
| Full width on mobile | Turns this on or off. |
Social icons
| Heading | |
|---|---|
| Style | Options: Plain, Circle, Outline. |
| Size | Slider. |
| Space between icons | Slider. |
| Placement | |
| Columns to span on desktop | Slider. |
| Full width on mobile | Turns this on or off. |
Image
| Image | An image from your files. |
|---|---|
| Width | Slider. |
| Link | Where the link goes. |
| Heading | |
| Placement | |
| Columns to span on desktop | Slider. |
| Full width on mobile | Turns this on or off. |
Text
| Heading | |
|---|---|
| Text | |
| Typography | Options: Body, Caption, Large body, Subheading. |
| Font scale | 100% is the size of this style in Theme settings > Typography. |
| Placement | |
| Columns to span on desktop | Slider. |
| Full width on mobile | Turns this on or off. |
Section width, corners, padding, color scheme, divider and visibility work the same in every section: see Section layout and spacing. Headings, subheadings and descriptions: see Section headings and text.
How it works
- Newsletter sign-ups are added to your customer list with the tag newsletter.
- Theme settings > Animations > Reveal footer on scroll slides the footer out from behind the page.
- Social icons come from Theme settings > Social media.