Hyper Theme
Hyper Theme
Pages Global Sections

Footer

4 min read
image

Footer is the content section at the bottom of a web page. The footer menu typically contains quick links to your homepage, about us page, blogs page, contact page, policy page, etc.

A great website footer will help your visitors navigate your site and will lead to a better user experience.

You can freely customize the footer section to suit your business needs, such as adding a footer menu, a newsletter, store contact, and other blocks.

Steps

  1. In the theme editor (Customize), click Footer.
  2. Locate and add suitable blocks.
  3. Save the changes.

Section settings

image

Follow on Shop

Follow on Shop allows customers to follow your store on the Shop app. When a customer follows your store, they can receive personalized recommendations and notifications about your products. This helps you to create a more personalized shopping experience for your customers.
To enable the Follow on Shop button, you need to have the Shop channel installed, and Shop Pay activated on your store.

Social media icons

  • Toggle Show social media icons to display icons for platforms like Facebook, Instagram, and TikTok.
  • Add the respective social media links under Theme Settings > Social Media.

Country/Region selector

Allow customers to select their location.

Use Country/ Region selector

Language selector

To add a language selector to your footer.

Use Language selector

Payment methods

Toggle Show payment icons to display accepted payment methods. Icons will appear in the footer to inform customers of available payment options.

image
The payment methods here reflect the settings configured in Payments.

Only payment options accepted through Shopify Payments will automatically display their icons when enabled.

Add a menu to the bottom bar of the footer if needed.

image

Block settings

image

There are 4 block types supported in the Footer section:

Display contact details such as address, phone number, and email.

  • Width (%): Adjust the block's width taken up in the Footer.
  • Heading: Add a title such as "About" or "Contact Information."
  • Heading size: Choose "Heading md" for medium-sized text.
  • Content:
    • Address: Add a physical location (e.g., "Street Address, City, Country").
    • Working Hours: Specify operating hours (e.g., "9:00 AM - 6:00 PM, Mon to Sun").
    • Email: Add a support email (e.g., "hi@yourdomain.com").
    • Phone: Include a customer support number (e.g., "+1-202-555-0195").
  • Mobile Settings:
    • Open Default: Enable for better visibility on mobile.
    • Show Divider: Add a separator line if needed.
image

Showcase promotions, branding, or store details.

  • Width (%): Adjust the block's width taken up in the Footer.
  • Heading: Add a title like "About" or "Promotion."
  • Heading Size: Use "Heading md" for medium-sized text.
  • Image:
    • Upload a visually appealing image (e.g., product or branding).
    • Adjust the Image Width (e.g., 200px).
  • Text: Add a short description or promotion text.
  • Button Label: Add a call-to-action like "Learn More" or "Shop Now."
  • Button Link: Link to a relevant page or collection.
image

Provide navigation to key pages or collections.

  • Width (%): Adjust the block's width taken up in the Footer.
  • Heading: Add a title such as "Company" or "Shop."
  • Heading Size: Choose a size like "Heading xs" for smaller text.
  • Menu: Link to a menu in Online Store > Navigation (e.g., Footer - Company or Footer - Collection).
  • Mobile Settings:
    • Open Default: Enable to expand the menu on mobile devices by default.
    • Show Divider: Add a line to separate this block visually.
image
To add and edit menus, see Shopify official documentation.

Collect email sign-ups for newsletters and promotions.

  • Width (%): Adjust the block's width taken up in the Footer.
  • Heading: Add a title like "Join Our Newsletter."
  • Heading Size: Set the size (e.g., "Heading lg" for large text).
  • Description: Add a description such as "Sign up to our newsletter & receive 10% off your first order."
  • Term & Policy Text: Include a short disclaimer with links to your Terms of Service and Privacy Policy.
  • Text Alignment: Align text to Left or Center as needed.
  • Form Width (px): Adjust the email input field width (e.g., 465px).
  • Mobile Settings:
    • Order First: Enable this to show the newsletter block first on mobile devices.
image
Newsletter submissions are saved on the Customers page of your Shopify admin.
Last updated