Adding Payment Icons to Cart & Checkout Pages in Shopify: Best Methods for 2026

Adding payment icons to cart and checkout pages in Shopify is one of those small tweaks that can make a store feel far more trustworthy. When customers see Visa, Mastercard, PayPal, Apple Pay, Google Pay, Klarna or other familiar logos in the right place, they instantly understand how they can pay and whether your store feels legitimate.

In my experience building Shopify apps and working with merchants on conversion issues, this is rarely the single thing that transforms sales overnight. But it is often part of the wider trust layer that helps hesitant shoppers move forward, especially on mobile and especially for first-time visitors.

This guide covers the best current ways to show payment icons on the cart page, cart drawer, product page, and what is actually possible on the checkout page in Shopify today.

Why should you add payment icons to Shopify cart and checkout pages?

Payment icons improve clarity and trust. They help customers quickly confirm that you accept familiar payment methods before they commit to checkout.

That matters more than many merchants realise. If someone reaches your cart and still wonders whether you support their preferred method, you have introduced friction at the worst possible moment. Even a tiny bit of uncertainty can push people back to browsing, comparison shopping, or abandoning the session entirely.

Recognisable payment marks also support the overall perception of security. They are not a substitute for good UX, fast pages, or a credible brand, but they do reinforce those signals. When I test stores, I often see payment icons working best alongside other trust elements such as review content, shipping clarity, and cart messaging.

• They reduce uncertainty by showing accepted payment methods upfront.
• They improve perceived trust because shoppers recognise established brands.
• They can support conversion rate optimisation when placed near checkout actions.
• They help international shoppers understand whether local or digital wallet options are available.
• They make the store feel more polished, especially on product and cart templates.

If you are also improving the cart experience, you might want to pair this with clearer cart messaging. I covered that in How to Add Text to the Shopify Cart Page: 2 Methods That Actually Work in 2026.

What is the best way to add payment icons in Shopify?

The best method is to use Shopify's built-in theme settings first. If your theme supports a payment icons toggle in the cart, footer, or a custom block area, that is usually the fastest and safest option.

If your theme does not support it, the next best method is a Custom Liquid block using shop.enabled_payment_types. That gives you a clean, update-friendly way to output icons automatically based on your active payment gateways.

Direct checkout customisation is more limited than it used to be. Since Shopify has moved merchants towards Checkout Extensibility, you generally cannot edit checkout.liquid on standard plans, and even on Plus the recommended route is now app blocks and approved checkout customisation methods rather than old-school code edits.

Can you add payment icons to the Shopify checkout page?

Yes, but only in limited ways. On modern Shopify, payment icon customisation inside checkout is restricted, and most merchants cannot directly edit checkout code.

This is the key point many older articles miss. If you are searching for a way to inject custom payment logos directly into Shopify checkout with Liquid, that advice is often outdated. For most stores, the realistic options are theme-level placement before checkout, built-in payment displays, or Checkout Blocks and approved checkout customisation tools where available.

Shopify's own documentation for Shipping & Payment icons blocks confirms that merchants can place supported payment icons within checkout using the Checkout Blocks setup, subject to plan and feature availability. That is the current, platform-approved direction.

How do I add payment icons to the cart page in Shopify without code?

The easiest no-code method is through the theme customiser. Many modern Shopify themes, including newer setups based on Dawn patterns, let you enable payment icons in the cart, footer, or a nearby section.

Before touching code, I always recommend checking the theme editor. It takes two minutes and avoids unnecessary maintenance later.

1. Go to Online Store > Themes.
2. Click Customise on your live theme or duplicate theme.
3. Open the Cart template or Cart drawer section.
4. Look for settings such as Show payment icons, Payment methods, or a footer-style payment toggle.
5. Enable the setting if available and save.

Some themes place this option in the footer only. Others let you add a Custom Liquid block beneath the checkout button. Dawn-style themes vary depending on version and any customisations already added by the merchant or developer.

If your cart uses a slide-out drawer rather than a full cart page, check the drawer section separately. I have seen plenty of stores assume the setting is missing when it is simply attached to the cart drawer template instead.

How do I add payment icons to the cart page in Shopify with Liquid code?

The most reliable code method is to loop through Shopify's enabled payment types. This automatically outputs icons for the gateways active in your store.

For most stores, this is the snippet I would use first because it stays aligned with your actual payment setup:

{% for type in shop.enabled_payment_types %}
  {{ type | payment_type_svg_tag: class: 'icon icon--full-color' }}
{% endfor %}

You can place that inside a Custom Liquid block in the theme editor, or directly in the relevant theme file if needed. Common locations include main-cart-footer.liquid, cart-drawer.liquid, main-cart-items.liquid, or a reusable snippet.

How do I place the icons under the checkout button?

Add the snippet directly below the cart checkout button markup or in a Custom Liquid block positioned underneath it. This is usually the best placement for visibility.

Here is a more complete example with wrapping HTML for styling:

<div class="cart-payment-icons">
  {% for type in shop.enabled_payment_types %}
    {{ type | payment_type_svg_tag: class: 'icon icon--full-color' }}
  {% endfor %}
</div>

Then add a little CSS if you want cleaner spacing:

.cart-payment-icons {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-top: 12px;
}

.cart-payment-icons .icon {
  height: 24px;
  width: auto;
}

In my experience, below the checkout button works better than burying icons at the bottom of a long cart page. The shopper sees them exactly when deciding whether to continue.

How do I only show selected payment icons?

Use a manually assigned list if you want complete control. This is useful when you want to show only a specific subset such as Visa, Mastercard, Amex and PayPal.

The original approach still works well for that use case:

<ul class="payment-icons list--inline site-footer__icon-list">
  {% assign enabled_payment_types = 'visa,master,american_express,paypal' | remove: ' ' | split: ',' %}
  {% for type in enabled_payment_types %}
    <li class="payment-icon">
      {{ type | payment_type_svg_tag: class: 'icon icon--full-color' }}
    </li>
  {% endfor %}
</ul>

This is handy if your store technically supports more methods than you want to emphasise visually. That said, I usually prefer the automatic loop unless there is a clear branding or regional reason to curate the list.

How do I add payment icons to the cart drawer in Shopify?

Add the same Liquid snippet to your cart drawer section file or a Custom Liquid block if your theme supports it. The most common file is cart-drawer.liquid.

This has become more important because a lot of Shopify stores no longer use a dedicated cart page. If your theme opens a side drawer after add to cart, that is where the trust element needs to appear.

1. Go to Online Store > Themes > Edit code.
2. Search for cart-drawer.liquid or your theme's equivalent cart drawer section.
3. Find the checkout button markup.
4. Paste the payment icon wrapper directly beneath it.
5. Save and test on desktop and mobile.

Be careful with drawer layouts because space is tighter. On mobile, oversized icons can wrap awkwardly or push the CTA too far down. I normally keep them small, evenly spaced, and no more prominent than the checkout button itself.

If you are improving your cart drawer more broadly, you may also find this useful: How to Add a Free Gift to Shopify Cart When Checkout Total Is Over $25.

How do I add payment icons under the Add to Cart button on product pages?

Use a Custom Liquid block in the product template or edit the buy buttons section. This is a strong placement because it reassures shoppers before they even reach the cart.

For no-code placement:

1. Go to Online Store > Themes > Customise.
2. Open your Default product template.
3. Add a Custom Liquid block under Buy buttons.
4. Paste the same shop.enabled_payment_types snippet.
5. Save and preview.

For code-based placement, add the snippet inside your product form or buy-buttons.liquid file. This is often the cleanest route if you want the icons to appear consistently across all product templates.

I like this placement for stores with impulse purchases, mobile-heavy traffic, or strong digital wallet usage. If customers are likely to use Shop Pay, Apple Pay or PayPal, surfacing those logos early can reduce hesitation.

And if you are testing product page conversion elements, this pairs well with simple CTA enhancements like making the Add to Cart button shake on Shopify for free.

What is the difference between cart, product, footer and checkout payment icons?

Each placement serves a different purpose. Product-page icons build early trust, cart icons support checkout intent, footer icons provide passive reassurance, and checkout icons are constrained by Shopify's checkout rules.

If I had to choose just one location for most stores, I would pick cart or cart drawer near the checkout button. If I could choose two, I would add product page buy box as well.

How do I add payment icons to Shopify checkout using Checkout Blocks?

The approved method is to use Shopify's checkout customisation tools such as Checkout Blocks where available. This is the modern route for displaying supported shipping and payment icons inside checkout.

According to Shopify's help documentation, the Shipping & Payment icons block supports a wide range of payment brands including Afterpay, Affirm, Amazon Pay, Amex, Apple Pay, Bancontact, Discover, Google Pay, Klarna, Maestro, Mastercard, PayPal, Shop Pay, UnionPay and Visa.

You can add up to 10 icons in each block. That is useful if you want a curated set rather than showing everything. It is also much safer than trying to force unsupported checkout edits that may break or stop working after platform updates.

If your store is focused on checkout improvements more broadly, I would also read 6 Best Checkout Apps to Extend the Shopify Checkout and How to Optimize Shopify Checkout & Increase Conversions.

How do I remove PayPal or other accelerated payment buttons from Shopify?

Removing a payment icon is not always the same as removing an accelerated checkout button. PayPal, Shop Pay and similar options can appear in different places depending on your theme and payment setup.

The older code many merchants refer to is this:

{% if additional_checkout_buttons %}
  <div class="additional-checkout-buttons">
    {{ content_for_additional_checkout_buttons }}
  </div>
{% endif %}

Removing or relocating that block can remove accelerated checkout buttons from some theme areas, including PayPal display in certain contexts. But it does not change your actual payment configuration in Shopify Payments or external gateways.

In practice, I recommend distinguishing between these two goals:

• Hide a visual icon or express button in the theme by editing the relevant template.
• Disable the payment method itself in Settings > Payments if you do not want to offer it.

If PayPal is not available in your country or you do not want to promote it, make sure both the gateway setup and the theme output match your intention.

Which payment icon method is best for different Shopify store types?

The right method depends on your theme, plan, and how your customers shop. There is no single best setup for every store.

When I audit stores, the biggest mistake is usually not technical. It is putting payment icons in the footer only and assuming the job is done. Footer icons are fine, but they are often too far away from the conversion moment to have much impact.

What mistakes should you avoid when adding payment icons in Shopify?

The biggest mistakes are showing the wrong icons, placing them too low, and overcomplicating the design. Payment icons should support the buying journey, not distract from it.

• Do not show payment methods you do not actually offer. That creates confusion and support tickets.
• Do not rely only on footer placement if your goal is conversion support.
• Do not make icons too large or more visually dominant than your checkout CTA.
• Do not edit checkout in unsupported ways if Shopify restricts it on your plan.
• Do not skip mobile testing. A layout that looks fine on desktop can wrap badly on smaller screens.

I would also avoid using random image files downloaded from the web when Shopify already provides payment SVG rendering through Liquid. The built-in method is cleaner, more consistent, and easier to maintain.

How should you test payment icons after adding them?

Test on mobile, desktop, and across your actual payment setup. You want to confirm the icons display correctly, match active gateways, and do not interfere with the cart or product layout.

1. Preview the cart page and cart drawer on desktop.
2. Check mobile spacing and line wrapping.
3. Confirm only valid payment methods appear.
4. Test theme updates or duplicate themes before publishing.
5. Click through to checkout and verify the journey still feels coherent.

If you use A/B testing or even simple before-and-after analytics, track metrics like cart-to-checkout rate and checkout completion rate. Payment icons alone will not usually create a huge uplift, but they can contribute to incremental gains when paired with better trust and checkout UX.

If your goal is to reduce steps altogether, you may also want to read How to Skip the Cart and Redirect to Checkout on Shopify.

What is my recommended setup for adding payment icons to cart and checkout pages in Shopify?

My recommendation is simple: use a no-code theme setting if it exists, otherwise use the shop.enabled_payment_types Liquid snippet in the cart, cart drawer, or product buy box. For checkout itself, use Shopify-approved checkout customisation methods only.

That approach is the best balance of speed, accuracy, and future-proofing. It also matches current Shopify architecture much better than older tutorials that imply you can freely edit checkout templates.

In my experience building Shopify apps and troubleshooting merchant themes, the stores that get this right are the ones that keep it simple. Show the right icons, put them near the decision point, test on mobile, and support them with stronger trust messaging where needed.

Conclusion

Adding payment icons to cart and checkout pages in Shopify is still worth doing, but the best method in 2026 depends on where you want them to appear. For most merchants, the smartest route is to enable built-in theme settings first, then use Custom Liquid or theme code for cart, cart drawer, or product page placement.

For the checkout page itself, Shopify's rules are tighter than many older guides suggest. If you need payment icons inside checkout, use Checkout Blocks or another Shopify-approved customisation path rather than trying to force unsupported edits.

If you want a quick win, start by placing accurate payment icons under the checkout button or under the Add to Cart button. It is a small change, but one that can make your store look more credible and more ready to convert.