Home > Shopify Tutorials > Remove Shopify Payment Icons from Store Footer

How to remove Shopify Payment Icons from Store Footer

Last updated: September 01, 2024
Written and researched by experts at AvadaLearn more about our methodology

By Sam Nguyen

CEO Avada Commerce

This writing about how to remove Shopify payment icons from store footer, which will match your preference and make you satisfy if you find the icons inappropriate and want to remove it from the footer of your store page. If you want to know how to hide footer on your password page, we have an article about that as well.

Many people including store owners and their customers feel uncomfortable with payment icons. This may be because they consume a lot of web page space or the display of them is excessive or because they negatively impact the customer experience. Therefore, let follow this simple instruction to remove Shopify payment icons.

1. What are Shopify payment icons?

What are Shopify payment icons

If you are using a free Shopify theme, you will have the option to display the payment icons in your footer. In other words, payment icons will be able to appear like that on all Shopify’s free themes if you enable that option in the theme editor. These icons are displayed quite simple and compact. They have a small rectangular frame with a separate payment provider logo. They show the payment methods your store has integrated. This will give customers information about the online payment methods they can use to buy https://avada.io/resources/best-shopify-themes-templates.htmlour product.

When you want to edit or remove these payment icons, you can go to sections 3 and 4 of this article to follow some easy steps to have it done. This will be extremely convenient and helpful for you as it can ensure you don’t have to change your payment settings.

2. Why does Shopify add these icons to their themes?

Why does Shopify add these icons to their themes?

Thanks to Shopify’s optimization, the shop owner can take advantage of many things. Among them are beautiful free themes with payment icons. Are you wondering why Shopify added these icons to your theme? I will talk briefly about why Shopify is doing so. This can also help you in deciding whether you want to remove them from the footer as well.

Payment icons play an important role in UI designs. In simple terms, it makes the interface simple, easy-to-see, and informative that only takes up a small space on your website. Your customers will need to learn about the payment methods accepted by your store. Therefore, when you present them on a section of the website, the clients are aware of all payments and compare them to the methods they can choose. This will help a lot because it not only provides information to customers but also shows the professionalism of the site. This is the reason that these payment icons are so popular in many e-commerce websites and Shopify is no exception.

I’ve prepared two different ways for you to edit Shopify payment icons from the footer. Each is worth a try and can help you edit the icons successfully. Therefore, let take a view and choose one way which is most suitable for you to carry out.

Option 1: Edit the code for the payment icons

Step 1: Go to Themes

In the first step, you will need to log in to your Shopify account and click on the Online Store button in the menu on the left of the admin page. Afterward, make sure to select the Themes button to go to the Themes page.

How to edit Shopify payment icons from the footer

Step 2: Select Edit code

You must have known which theme has the payment icons you expect to be edited. Find that theme and click on the Actions button next to the theme’s name. A drop-down will appear. Then, choose the Edit code to start to edit the code for these icons.

How to edit Shopify payment icons from the footer

Step 3: Choose the footer.liquid file

There will be lots of files displaying on the left. You can enter the Sections word on the Search files text box. Or else, scroll down to look for that file and tap on it. In the Sections field, select the footer.liquid. In case this file doesn’t exist in your theme, you can click on the theme.liquid in the Layout field.

How to edit Shopify payment icons from the footer

Step 4: Replace the code

In this step, what you need to do is find the following code in the file you’ve opened. There is a small tip for you to look for it faster. You can press on Ctrl + F to open the search text box. Then, copy the text in this code and paste it on the text box.


 
{% for type in shop.enabled_payment_types %}
 

How to edit Shopify payment icons from the footer

After you’ve found the code, let replace it with the code below:


 
{% assign enabled_payment_types = 'visa,master,american_express,paypal' | remove: ' ' | split: ',' %}
{% for type in enabled_payment_types %}
 

How to edit Shopify payment icons from the footer

Step 5: Edit the payment providers code

Take a view of the code you’ve pasted. You will see a list of payment providers that are separated by commas. It just an example and you need to make some changes. These payment providers will be presented on the footer of your store to let customers know about which payments are accepted by your online shop. Hence, edit them into the payment providers your store is using to make it right.

How to edit Shopify payment icons from the footer

You can use the values listed below:

  • american_express
  • apple_pay
  • bitcoin
  • dankort
  • diners_club
  • discover
  • dogecoin
  • dwolla
  • forbrugsforeningen
  • google_pay
  • ideal
  • jcb
  • klarna
  • klarna-pay-later
  • litecoin
  • maestro
  • master
  • paypal
  • shopify_pay
  • sofort
  • visa

Step 6: Tap on Save

Finally, tap on the Save button to complete. You now have appropriate payment icons for your online store and make your clients satisfied.

How to edit Shopify payment icons from the footer

Option 2: Add custom payment icons

Step 1: Go to Edit code

You now are on the admin page. Let click on the Online Store button and go to the Themes section. You must have known which theme has the payment icons you expect to be edited. Find that theme and click on the Actions button next to the theme’s name. A drop-down will appear. Then, choose the Edit code to start to edit the code for these icons.

How to edit Shopify payment icons from the footer

There will be lots of files displaying on the left. You can enter the Assets word on the Search files text box. Or else, scroll down to look for that directory and tap on it. In the Assets field, select the Add new asset link to upload a new custom icon.

How to edit Shopify payment icons from the footer

Step 3: Upload the file

A dialog will come out to let you choose the file you want to upload. After you’ve chosen, click Open to upload it from your computer to your online store. I will upload the file called paypal-icon.png as an example for you.

How to edit Shopify payment icons from the footer

Step 4: Open the widget-payment-methods.liquid file

In this step, you will have to open the widget-payment-methods.liquid file in the Snippets directory. Go to the next step to start to edit the payment icons.

Step 5: Change the image name

In the file you’ve opened, you will see a list of image names. They are the images of payment icons that are shown in the footer of your online shop. Hence, to edit them into the payment providers your store accepts, you just need to change the image name into the file name you’ve uploaded in the third step. For example, I will change the name Paypal logo with the file name paypal.jpg.

Step 6: Save

Make sure to tap on Save to save all changes. Refresh the page to view the changed payment icons.

In the previous section, you learned how to edit payment icons correctly. However, if you find these icons are not suitable for your site or you have more interesting things to display in that position, follow these simple steps below to remove the payment icons from the footer.

Step 1: Go to the Themes section

In the admin page, make sure to click on the Online Store button in the menu on the left of the admin page. Afterward, select the Themes button to go to the Themes page.

How to edit Shopify payment icons from the footer

Step 2: Choose Customize theme

You can choose to remove the theme you expect by tapping on the Customize button next to the theme’s name.

How to edit Shopify payment icons from the footer

You will access a page that allows you to customize the theme. There are many sections on the left. Let scroll down and select the Footer section.

How to edit Shopify payment icons from the footer

Step 4: Uncheck the checkbox

Take a look at the Show payment icons checkbox. You only need to uncheck the checkbox to hide them all.

How to edit Shopify payment icons from the footer

Step 5: Save

After you’ve done, click the Save button on the upper right of the page to complete removing Shopify payment icons from the footer.

How to edit Shopify payment icons from the footer

Summary:

In a nutshell, this article shows you how to remove Shopify payment icons from store footer. Besides, you can better understand the payment icons and the reason Shopify adds them to the theme. In particular, in case you want to edit the icons instead of removing them, I’m very pleased to provide you with two effective ways to do this.

I hope that you can perform quickly and successfully with the steps and illustrations that I provide. Are you interested in finding out a simple and effective way to change the current theme to a theme that you favored and find it match perfectly with your store? Click to our post about How To Change Theme In Shopify to check it out.

Related Posts:


Sam Nguyen is the CEO and founder of Avada Commerce, an e-commerce solution provider headquartered in Singapore. He is an expert on the Shopify e-commerce platform for online stores and retail point-of-sale systems. Sam loves talking about e-commerce and he aims to help over a million online businesses grow and thrive.