In this article:

1. Introduction
2. Get ready your image or logo URL
3. Steps to add image or logo in footer

⚠️ Kindly take note :

  • Above all code editing, you will need to re-edit the code again if you switch to a new theme template

  • We do not allow to change or edit the code for the checkout page (which include shipping & payment method) due to security reasons

1. Introduction

By adding footer image or logo such as company logo, awards, certifications or memberships, it helps build visitors trust in your web store. With a clickable image or logo, you can even direct them to the related pages.

2. Get ready your image or logo URL 

Step 1 : Before you start, please make sure that you already have a URL link to your image or logo. If you do not have an existing URL link, you can create and obtain one by uploading the image or logo to your store storage. 

Step 2 : Go to Admin > Products > Add product > in 'Description' box, select 'Images' > Add image > Upload image > copy the 'Image link'.

Step 1 : Go to Admin > Channels > Online Store > Edit Source

Step 2 : Go to layout > layout/theme.liquid

Step 3 : Search for {% include 'social-links' %} ( usually it will be at row 246 )

Step 4 : Below this line, paste code below (choose with or without link). Don't forget to insert your own page and image or logo URL link.

(i) With Link
( when visitors click on the image or logo, they will be directed to another page )

<a href="yourpageurl" target="_blank"><img style=“width: 100px;” src="yourimageurl"></a>

(ii) Without  Link
( unclickable image or logo only )

<img style="width: 100px;" src="yourimageurl"/>

Step 5 : If you would like the image or logo to be located at the right side, you may use the codes below instead.

(i) With Link

<a href="yourpageurl" target="_blank"><img style="width: 100px; margin-left: 100%;" src="yourimageurl"></a>

(ii) Without  Link

<img style="width: 100px; margin-left: 100%;"src="yourimageurl"/>

Step 6 : Save and done.

💡 Tips : 

  • If you want to adjust the size of the logo, you may adjust the number in width: 100px

  • If you want to adjust the position of the logo by redirect them to middle or not too side, then you may adjust the percentage number in margin-left= 100%

GIF 1: Create and obtain your image or logo URL

GIF 2: Add image or logo in footer

Related articles:
Adding Trustmark at footer
Show payment method icons at footer
Remove or edit Terms & Policy in footer
Remove Quick Links and Follow Us sections
Change/Remove social media icons

Did this answer your question?