Customizing your Website Footer

Callum Updated by Callum

Here you can learn how to:

  • Add additional resources into group links on the footer
  • Add your company information on the footer
  • Add your social media profiles on the footer
  • Add your contact information on the footer
Head to 'Links' (Left Menu)

Many apps and websites now use infinite scroll technology to constantly serve new content, so we don’t often consider just how important a traditional website footer can be. Website footers appear on every page of your website and usually contain some of the most important information for your users.

You can access information about the footer by clicking Links from the left menu in the Dashboard.

Your SupaPass website footer includes many of these important links by default, such as the link for Tech Support (we provide tech support for your users) and the General Terms and Privacy (how users' data is handled). As you add to your website we will automatically add new links to your footer, such as links to your mobile apps. The first group of links contains these default links and will include the following depending on what you have set up:

  • Tech support
  • FAQ
  • Terms & Privacy
  • General Terms and Privacy
  • iOS app link
  • Android app link

You can view a preview of the current footer structure at any time on the Links tab.

Now that you're familiar with the default footer links you can begin to think about what else you might like to include in your footer such as custom links, additional text and social icons to your footer.

Footer Link Groups are used to group together related links in your footer. The default links will always appear in the first group that you create, you can choose to add more links to this group or create a new group for your other links. To create a group:

  1. Click 'Create Footer Link Group'
  2. Enter an optional title for the group and click Create Footer Link Group (you can rename this later)
  3. Click the Add Link button to create a new footer link. You need to give a title for your link, plus a valid url. This can either be a full URL e.g. https://www.supapass.com/, or a partial link to somewhere on your web site e.g. /collections/123.

  1. Organise your links and groups:
    1. You can reorder links within a group by clicking the up and down arrows
    2. You can delete links by clicking the X
    3. You can move groups by dragging the box up and down the page
    4. You can delete the group by clicking the trashcan

The Footer Text allows you to add important notices to your footer that you want to be displayed on every page. You could put anything in the footer text, but here are some examples of what you could include:

  • Copyright notice
  • Company address
  • Professional or charity registration details
  • A brief company mission statement
  • Anything you want! 🙂

You can also include icons in your footer that connect to social media pages. We support dozens of the main social platforms to automatically include their icon in your footer.

There is also a world icon for any website icon not listed. Let us know about any others you want us to include in future releases - Email us a request!

To add a Social Media Link:

  1. Click Create Social Media Link
  2. Select the social media network from the drop down menu
  3. Copy and paste the URL of your social media page
  4. Add some hover over text, this is what will show on the website when the mouse hovers over the icon.
  5. To save click Create Social Media Link

Example Footers

Here are some example footers to help inspire you!

This footer uses the Social Media Links as well as the Footer text to convey important information and links for the user. The Footer text gives a phone number and an email address for users to contact if they have any inquiries.

This footer uses a Footer Link group to advertise various links around their website, useful for any users who have scrolled to the bottom of the page looking for where to go. This footer also uses different font styles to emphasise their information.

How did we do?

Customizing your Website Menu

Contact