How to Add Custom Payment Icons?
STEP 1
Go to your Shopify Admin, go to Online Store, and then Themes.
STEP 2
Click the … button to open the actions menu, and then click Edit code.
STEP 3
In the Snippets directory, click payment-icons.liquid. If your theme doesn't include this file, then click theme.liquid in the Layout directory.
STEP 4
Find the following code in this file:
{% for type in shop.enabled_payment_types %} Copy
Replace that code with the following:
{% assign enabled_payment_types = 'visa,master,american_express,paypal' | remove: ' ' | split: ',' %}{% for type in enabled_payment_types %}Copy
In the code that you just pasted, there is a list of payment providers separated by commas: visa,master,american_express,paypal.
On your online store, the payment icons will depend on the providers you include in this list. Edit the payment providers list as needed. Review that list and copy each icon's name, without the .svg extension.
Common values are listed below: - afterpay - american_express - apple_pay - bitcoin - dankort - diners_club - discover - dogecoin - dwolla - facebook_pay - forbrugsforeningen - google_pay - ideal - jcb - klarna - klarna-pay-later - litecoin - maestro - master - paypal - shopify_pay - sofort - unionpay - visa
STEP 5
Click Save to apply the changes.