How to Add a Payment Icon to Your Shop Footer in Shopify

Adding payment icons to your Shopify footer is usually a no-code job. In most modern Shopify 2.0 themes, you can enable them in the theme customiser in under a minute. If your theme does not support that setting, you can still add them with Custom Liquid or by editing footer.liquid.

I've worked on Shopify stores for years and, as a Shopify app developer, I see this request come up constantly. Merchants want their footer to look more trustworthy, more complete, and more in line with bigger brands. Payment icons help with perceived trust, but they only work well when they match your actual checkout options and are added cleanly.

In this guide, I’ll show you the fastest no-code method, the best fallback if your theme does not support it, and the manual code approach for stores that need more control. I’ll also cover common problems, how to handle third-party payment badges, and when adding more icons can actually hurt trust rather than help it.

If you're also working on broader conversion improvements, I’d pair this with our guides on maximising revenue from Shopify product pages and Shopify speed optimisation. Footer trust signals matter, but they work best as part of the full customer journey.

How do I add payment icons to my Shopify footer?

The easiest way to add payment icons to your Shopify footer is through the theme customiser. Go to Online Store > Themes > Customize, open the Footer section, and enable Show payment icons if your theme includes that option.

This is the method I recommend for most merchants because it is fast, safe, and theme-friendly. In themes like Dawn and other Shopify 2.0 themes, the setting is often already built in. Once enabled, the footer usually pulls from your store’s active payment methods automatically.

1. In Shopify admin, go to Online Store > Themes
2. Click Customize on your live theme
3. Open the Footer section in the left sidebar
4. Look for Show payment icons, Payment icons, or a similar setting
5. Enable it and click Save
6. Preview your storefront and check the footer on desktop and mobile

That is enough for many stores. If the option is there, use it first before touching any code.

Why are payment icons worth adding in the first place?

Payment icons improve trust and clarity. They show shoppers which payment methods you accept before they reach checkout, which can reduce hesitation for first-time visitors.

In my experience building Shopify apps and reviewing store UX, these icons do not transform conversion rates on their own, but they can support the buying decision. They are especially useful for stores selling to cold traffic from ads, where customers are still deciding whether the shop looks legitimate. Visa, Mastercard, PayPal, Apple Pay, and Google Pay are familiar trust markers.

That said, there is a catch. Showing payment icons you do not actually offer is a bad idea. It creates friction at checkout and can make the store feel misleading. I have seen merchants add every badge under the sun, only to confuse customers when those options are not available later.

If you're serious about conversion optimisation, this is the same principle I talk about in how to upsell on Shopify in 2026 and how to create Shopify cart drawer upsells. Clarity converts better than clutter.

What is the best method for your theme?

The best method depends on whether your theme supports payment icons natively. Most modern Shopify 2.0 themes do. Older themes and heavily customised themes often need Custom Liquid or code edits.

Here is the quick comparison I use when helping merchants choose the right approach.

If your store uses a standard Shopify theme, start with the customiser. If you are on an older theme or a premium theme with unusual structure, use one of the fallback methods below.

How do I enable payment icons with no code?

No-code setup is the easiest and cleanest method. If your theme includes a footer setting for payment icons, you should use that before trying anything more technical.

This is the exact process I’d follow on a client store today:

1. Open Shopify Admin
2. Go to Online Store > Themes
3. Click Customize
4. Scroll to and select Footer
5. Enable Show payment icons or Payment icons
6. Click Save
7. Open the storefront preview and confirm the icons appear correctly

Some themes do not show a list of icons inside the editor. Instead, they automatically display the icons based on what is enabled in Settings > Payments. That is normal.

If the icons do not show after enabling the setting, check whether your payment methods are active first. Shopify cannot display enabled payment types properly if the relevant gateways are not configured.

How do I make sure Shopify shows the right payment icons?

Shopify usually pulls footer icons from your enabled payment methods. To control what appears, start in Settings > Payments rather than the theme editor.

Go to Settings > Payments in your Shopify admin and review what is actually enabled. If you use Shopify Payments, cards like Visa and Mastercard are typically available automatically, while wallets such as Apple Pay and Google Pay may depend on your setup and region. If you use a third-party provider, the available icons can vary.

In practice, I recommend checking three things:

• Your active gateway matches what you want to display
• Express payment methods like PayPal or Apple Pay are actually enabled
• Your market and checkout settings support those methods for your customers

For official setup details, Shopify’s payments documentation is the best starting point: Shopify Payments help docs.

What if my theme does not have a payment icons setting?

If your theme does not include a built-in footer toggle, the next best option is a Custom Liquid block. This works well on many Online Store 2.0 themes and avoids editing core theme files directly.

When I test stores with missing footer controls, this is usually my preferred fallback because it is easier to reverse. You can often add a Custom Liquid block or section inside the footer and render the payment icons there.

1. Go to Online Store > Themes > Customize
2. Open the Footer section
3. Click Add block or Add section
4. Choose Custom Liquid
5. Paste this code:

{% render 'payment-icons' %}

6. Click Save

This assumes your theme includes a snippet called payment-icons. Some themes do, some do not. If nothing appears, you may need to add the full icon loop manually in code.

How do I add payment icons by editing Shopify theme code?

Manual code editing gives you the most control. It is the right option if your theme lacks the setting, the Custom Liquid method does not work, or you want to customise which icons appear.

Before you edit anything, duplicate your theme first. I always do this, even for tiny changes. It takes seconds and gives you a clean rollback if the footer breaks.

1. Go to Online Store > Themes
2. Click the ... menu on your live theme and choose Duplicate
3. Open the duplicated theme
4. Click ... then Edit code
5. Open sections/footer.liquid
6. If that file does not exist, check layout/theme.liquid or your footer-related section files

In many themes, the standard Shopify loop looks like this:

{% for type in shop.enabled_payment_types %}

And the full output usually uses Shopify’s icon helper, like this:

{% for type in shop.enabled_payment_types %}
{% assign icon_name = type | replace: '_', ' ' | downcase %}
{{ type | payment_type_svg_tag: class: 'payment-icon' }}
{% endfor %}

This is the most future-proof way to show the store’s enabled payment types. It keeps the footer aligned with your actual payment setup and uses Shopify’s built-in SVG icons.

If you want to place the icons in a list for styling, a cleaner version is:

{% if shop.enabled_payment_types != empty %}
<ul class="list list-payment" role="list">
{% for type in shop.enabled_payment_types %}
<li class="list-payment__item">{{ type | payment_type_svg_tag: class: 'icon icon--full-color' }}</li>
{% endfor %}
</ul>
{% endif %}

That structure is common in Shopify themes and easier to style with CSS later.

How do I show only specific payment icons?

You can hard-code a list of payment types if you only want selected icons to appear. This is useful when your store setup returns more icons than you want in the footer.

Your original article used this approach, and it is still valid when done carefully. Replace the default loop with a custom list like this:

{% assign enabled_payment_types = 'visa,master,american_express,paypal' | remove: ' ' | split: ',' %}
{% for type in enabled_payment_types %}
{{ type | payment_type_svg_tag: class: 'payment-icon' }}
{% endfor %}

You can add or remove providers in the comma-separated list. Common supported values include:

• american_express
• apple_pay
• amazon_pay
• bitcoin
• dankort
• diners_club
• discover
• dogecoin
• dwolla
• forbrugsforeningen
• google_pay
• ideal
• jcb
• klarna
• maestro
• master
• paypal
• shopify_pay
• visa

Only show icons you genuinely support. That is the rule I would stick to on every store.

How do I add third-party payment badges like Afterpay or PhonePe?

Third-party payment badges often need custom handling. If Shopify does not provide a built-in icon for the method you want, you may need to upload your own image, use custom SVG, or install a badge app.

This comes up a lot with regional payment methods and local gateways. The built-in payment_type_svg_tag filter is great, but it is limited to Shopify’s supported icon set. If your gateway is unusual, you may need a custom image or a trust badge tool.

If you go down the app route, be selective. Many badge apps add unnecessary scripts, duplicate icons, or inject clutter all over the page. As someone who builds Shopify apps myself, I’m very cautious about recommending extra apps for something a theme can often handle natively.

If you do need an app, browse the Shopify App Store and check recent reviews carefully. For general app discovery, start here: Shopify App Store.

Also make sure any custom badge setup does not undermine your site speed. If you have not read it yet, our piece on Shopify speed optimisation scams explains why seemingly small front-end additions can create bigger performance problems.

Why are my payment icons not showing in Shopify?

Payment icons usually fail to appear because of theme limitations, missing payment setup, or misplaced code. The fix is normally straightforward once you isolate which of those is causing it.

These are the most common issues I see when troubleshooting merchant stores:

If you are editing theme files, always preview your duplicate theme first. A footer issue is rarely catastrophic, but it is still better to test before publishing.

Should I add payment icons to the footer or somewhere else too?

The footer is the standard place, but product pages and cart areas can matter more for conversion. If trust is your goal, place payment reassurance where purchase intent is strongest.

I like payment icons in the footer because they are tidy and expected. But if I am optimising a store for conversion, I care more about what happens near the Add to Cart button, in the cart drawer, and around checkout messaging. That is where reassurance has the biggest impact.

For example, if you are improving product-page conversion, read our product page revenue guide. If you are working on the cart experience, see our cart drawer upsell guide. Footer icons are useful, but they are not a substitute for strong on-page trust signals.

What is the cleanest code snippet for Shopify payment icons in 2026?

The cleanest current approach is to loop through shop.enabled_payment_types and output each icon using payment_type_svg_tag. This keeps your footer aligned with Shopify’s native payment data and reduces maintenance.

Here is the snippet I would use on most stores today:

{% if shop.enabled_payment_types != empty %}
<ul class="list list-payment" role="list">
{% for type in shop.enabled_payment_types %}
<li class="list-payment__item">
{{ type | payment_type_svg_tag: class: 'icon icon--full-color' }}
</li>
{% endfor %}
</ul>
{% endif %}

Best for most stores, because it is dynamic, lightweight, and theme-compatible. If your theme already has a payment icon snippet, use that instead of duplicating logic.

For reference, Shopify theme architecture and Liquid docs are available here: Shopify theme architecture and Shopify Liquid documentation.

What are the best practices for payment icons on Shopify?

The best payment icon setup is accurate, minimal, and visually consistent with your theme. More icons are not always better.

• Only display real payment methods available to your customers
• Keep icon styling consistent with your footer design
• Check mobile layout so icons do not wrap awkwardly
• Use Shopify’s native SVG icons where possible for better sharpness and performance
• Duplicate your theme before editing code
• Avoid overloading the footer with trust badges, guarantees, and payment rows all at once

From a UX standpoint, I’d rather see 4 to 6 relevant icons than a cluttered wall of logos. The goal is reassurance, not noise.

This same principle applies to other trust and merchandising elements too. If you are layering in reviews, upsells, and custom order notes, keep the experience intentional. On that note, if you need structured order messaging, our guide on tracking customised orders in Shopify is worth reading.

Can I use an app to add payment icons in Shopify?

Yes, but I would only use an app if your theme cannot handle it or you need advanced badge customisation. For most stores, an app is unnecessary.

Because I build Shopify apps myself, I try to be honest about when an app is overkill. This is one of those cases where native theme functionality is usually enough. If all you want is a standard row of payment icons in the footer, the customiser or a small code edit is almost always the better solution.

An app makes more sense if you need:

• Custom regional payment badges
• Promotional financing icons
• Trust badges combined with shipping, returns, or guarantee messaging
• Drag-and-drop placement without touching theme code

If you do install one, review app impact carefully and remove it if it adds scripts you do not need. I’ve seen plenty of stores slow down because they installed a badge app for a job that took 2 minutes in the theme editor.

Final checklist: what should I do before publishing the change?

Before you publish payment icons, verify the setup on both the storefront and in admin. A quick check now saves awkward checkout confusion later.

1. Confirm the icons match your active payment methods in Settings > Payments
2. Test on desktop and mobile
3. Make sure the footer spacing still looks clean
4. Check that no icon is blurry, cropped, or duplicated
5. If you edited code, compare the duplicate theme against live before publishing
6. View a product page, cart page, and homepage to make sure the footer behaves consistently

If you are already refining your store for AI discovery and conversion, you may also find these guides useful: optimising your Shopify store for AI shopping agents and getting your Shopify store into ChatGPT. Trust, clarity, and structured storefront content all work together.

If your theme supports payment icons natively, use the built-in footer setting first. If not, use Custom Liquid or the shop.enabled_payment_types loop in footer.liquid. That is the cleanest, most up-to-date answer to how to add a payment icon to your shop footer in Shopify.