Articles on: Header - Footer

Footer

The Footer provides essential information and quick access to important resources. It typically includes useful links, contact details, terms of service, and social media channels.

This guide will walk you through the different blocks of the footer, explaining their purpose and how to use them effectively, so you can navigate the website with ease and make the most of the available features.



1. How to access the Footer section?


Step 01: From Shopify Admin, click on Online Store > Select Themes > In the Current theme section, click the Customize button.



Step 02: In the theme editor (Customize), click the Sections button > scroll through the list Footer group > select the Footer section.



2. How to customize the Footer section?


The Footer section lets you add and customize three main options: general footer settings, Utilities, and Section padding.



  • Make section full width: A toggle to make the footer section extend to the full width of the browser window.
  • Color scheme: A dropdown menu to select a predefined color scheme for the footer.
  • Show separator line: A toggle to display a thin line above the footer to visually separate it from the main content.
  • Heading uppercase: A toggle that, when enabled, automatically capitalizes all headings within the footer.
  • Footer brand logo: An option to upload or select an image to be used as the brand logo in the footer.
  • Enable sticky footer: A toggle that, when enabled, makes the footer stay visible at the bottom of the screen even when the user scrolls. The description notes this feature is "Only available on desktop and tablet".



2.2. Utilities


  • Follow on Shop: A toggle to enable a "Follow on Shop" button, which allows customers to follow your store on the Shop app.
The note "Shop Pay must be enabled" indicates a prerequisite for this feature.


  • Social links: A toggle to display social media icons. The "Manage social links" link allows for configuring which social networks to include.
  • Country/region selector: A toggle to enable a dropdown menu for users to select their country or region. The "Manage countries/regions" link allows for customizing the list of available countries.
  • Show country name: A toggle to display the name of the selected country next to its flag in the country/region selector.
  • Show country flag: A toggle to display the flag of the selected country in the country/region selector.
  • Language selector: A toggle to enable a language selection dropdown. The "Manage languages" link is for configuring the available languages.
  • Payment method icons: A toggle to show or hide icons representing the accepted payment methods (e.g., Visa, Mastercard, PayPal).
  • Policy links: A toggle to display links to various store policies (e.g., Refund Policy, Privacy Policy). The "Manage policies" link directs to the settings where these policies can be edited.



2.3. Section padding


  • Top: A slider and input field to adjust the amount of padding (empty space) at the top of a section. The unit is in pixels (px).
  • Bottom: A slider and input field to adjust the amount of padding (empty space) at the bottom of a section. The unit is in pixels (px).
  • Mobile top: A slider and input field to adjust the amount of top padding specifically for mobile devices. The unit is in pixels (px).
  • Mobile bottom: A slider and input field to adjust the amount of bottom padding specifically for mobile devices. The unit is in pixels (px).



3. How to customize the blocks in Footer section?


Footer can contain various inner blocks such as Brand infomation, Menu, Text,Image, Newsletter,... allowing you to organize your footer content flexibly and effectively.


To add a block to the Footer section, click the Add block button (plus icon ➕) under the Footer section > Select block.


Follow the instructions below to configure them accordingly.



3.1. Brand information


  • Heading: An input field to set the title or heading for the brand information section. In the example, the heading is "Contact".
  • Description: A text editor to add detailed information about the brand, such as an address, phone number, and email address. The editor includes formatting options like bolding, italics, and lists.
  • Image: An option to upload an image to be displayed in the brand information section.
  • Image width: A slider and input field to adjust the size (in pixels) of the uploaded image.
  • Social links: A toggle to enable or disable the display of social media icons. A "Manage social links" link is provided to configure the specific social media accounts.



3.2. Menu


  • Heading: An input field to set the title for the menu section. In the example, the heading is "SHOP".
  • Menu: A dropdown menu to select a specific menu to be displayed.
Displays only top-level menu items



3.3. Newsletter signup


  • Heading: An input field to set the title or heading for the newsletter signup section. In the example, the heading is "Get on the list".
Subscribers will be added to your “accepts marketing” customer list.


  • Description: A text editor to add a brief message encouraging visitors to subscribe to the newsletter. The example text is "Subscribe for exclusive offers, early access, and special discounts".
  • Social links: A toggle to enable or disable the display of social media icons within this section. A "Manage social links" link is provided to configure the specific social media accounts.



3.4. Text


  • Heading: A text input field to add a title or heading for the text block.
  • Description: A rich text editor to add the main body of text.



3.5. Image


  • Image: This option allows you to select or upload a specific image file to display.
  • Width: This is a slider and an input field that allows you to adjust the width of the displayed image in pixels.




Updated on: 16/08/2025

Was this article helpful?

Share your feedback

Cancel

Thank you!