Trust badges are one of the simplest conversion optimisations you can make to a Shopify store. Showing familiar payment icons — Visa, Mastercard, PayPal, Afterpay — directly below the Add to Cart button reassures customers that your store is legitimate and their payment is secure.

Most apps charge $5-10/month for this. You can do it in 5 minutes with a single Liquid snippet that uses lightweight inline SVGs — no external scripts, no image files, no page speed impact.

What You'll Build

The Code

Here's the complete snippet. Copy it, paste it into a new file in your Shopify theme, and you're done.

snippets/plynthr-trust-badges.liquid 
{% comment %}
  Plynthr — Trust Badge Row
  https://plynthr.com/snippets/trust-badge-row/

  INSTALL:
  1. Create snippets/plynthr-trust-badges.liquid
  2. Paste this code
  3. Add {%- render 'plynthr-trust-badges' -%} in your product form,
     after the Add to Cart button

  CUSTOMIZE:
  - --ptb-gap for spacing between icons
  - --ptb-size for icon size
  - Add or remove SVG icons below
{% endcomment %}

<style>
  :root {
    --ptb-gap: 8px;
    --ptb-size: 38px;
    --ptb-opacity: 0.65;
    --ptb-opacity-hover: 1;
    --ptb-label-color: #999;
  }

  .plynthr-trust-badges {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--ptb-gap);
    margin: 12px 0;
  }

  .plynthr-trust-badges__label {
    width: 100%;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--ptb-label-color);
    margin-bottom: 2px;
  }

  .plynthr-trust-badges svg {
    width: var(--ptb-size);
    height: calc(var(--ptb-size) * 0.63);
    opacity: var(--ptb-opacity);
    transition: opacity 0.2s;
    border: 1px solid #e5e5e5;
    border-radius: 4px;
    padding: 4px 6px;
    background: #fff;
  }

  .plynthr-trust-badges svg:hover {
    opacity: var(--ptb-opacity-hover);
  }
</style>

<div class="plynthr-trust-badges">
  <span class="plynthr-trust-badges__label">Secure payment</span>

  <!-- Visa -->
  <svg viewBox="0 0 48 32" fill="none">
    <rect width="48" height="32" rx="4" fill="#fff"/>
    <path d="M19.5 21h-3l1.9-11.5h3L19.5 21zm11.8-11.2c-.6-.2-1.5-.5-2.7-.5-3 0-5.1 1.5-5.1 3.7 0 1.6 1.5 2.5 2.6 3.1 1.2.6 1.6.9 1.6 1.4 0 .8-.9 1.1-1.8 1.1-1.2 0-1.8-.2-2.8-.6l-.4-.2-.4 2.4c.7.3 2 .6 3.3.6 3.2 0 5.2-1.5 5.2-3.8 0-1.3-.8-2.2-2.5-3-1-.5-1.7-.9-1.7-1.4 0-.5.5-1 1.7-1 1 0 1.7.2 2.2.4l.3.1.5-2.3z" fill="#1A1F71"/>
  </svg>

  <!-- Mastercard -->
  <svg viewBox="0 0 48 32" fill="none">
    <rect width="48" height="32" rx="4" fill="#fff"/>
    <circle cx="19" cy="16" r="8" fill="#EB001B"/>
    <circle cx="29" cy="16" r="8" fill="#F79E1B"/>
    <path d="M24 10.3a8 8 0 010 11.4 8 8 0 000-11.4z" fill="#FF5F00"/>
  </svg>

  <!-- PayPal -->
  <svg viewBox="0 0 48 32" fill="none">
    <rect width="48" height="32" rx="4" fill="#fff"/>
    <path d="M18.5 24.5h-2.8l.2-1.2 2.1-13.3h3.5c2.4 0 4 1.2 3.6 3.5-.5 3-2.8 4.2-5.2 4.2h-1.6l-.8 6.8z" fill="#003087"/>
    <path d="M22.5 22.5h-2.8l.2-1.2 2.1-11.3h3.5c2.4 0 4 1.2 3.6 3.5-.5 3-2.8 4.2-5.2 4.2h-1.6l-.8 4.8z" fill="#0070E0"/>
  </svg>

  <!-- Afterpay -->
  <svg viewBox="0 0 48 32" fill="none">
    <rect width="48" height="32" rx="4" fill="#fff"/>
    <path d="M10 20.5l6-9h4l-6 9H10zm18 0l6-9h4l-6 9H28z" fill="#B2FCE4"/>
    <circle cx="21" cy="16" r="3.5" fill="#B2FCE4"/>
  </svg>

  <!-- Shop Pay -->
  <svg viewBox="0 0 48 32" fill="none">
    <rect width="48" height="32" rx="4" fill="#5A31F4"/>
    <path d="M14 14.5c.5-2 2.2-3 4.2-3h1.3c.3 0 .5.2.5.5l-.3 2c0 .2-.2.3-.4.3h-1.5c-.8 0-1.3.5-1.4 1.1l-.5 3c0 .2-.2.3-.4.3h-2c-.3 0-.5-.3-.4-.5l.9-3.7z" fill="#fff"/>
    <path d="M28 13h2.5l-2 8h-2l-.5-3.5L24 21h-2l2.5-8h2l.5 3.5L28 13z" fill="#fff"/>
  </svg>
</div>

You can also grab this from the snippet page on Plynthr.

Installation

  1. In your Shopify admin, go to Online Store → Themes → Edit Code
  2. Under Snippets, click "Add a new snippet" and name it plynthr-trust-badges
  3. Paste the code above and hit Save
  4. Open your product template — usually sections/main-product.liquid
  5. Find the Add to Cart button (search for button or add to cart)
  6. Add {%- render 'plynthr-trust-badges' -%} directly after the button's closing tag
  7. Save and preview a product page

Customisation

All the visual properties are controlled by CSS custom properties (variables) in the :root block. Here's what you can change:

Troubleshooting

Icons not showing on product page: Make sure you're editing the correct file. On Dawn-based themes, the product form is in sections/main-product.liquid. On older or custom themes, it might be in templates/product.liquid or a product section file.

Icons look too big or too small: Adjust the --ptb-size variable. The height is automatically calculated at 63% of the width to maintain the correct card aspect ratio.

Want to remove the "Secure payment" label: Delete the <span class="plynthr-trust-badges__label"> line from the HTML.

Need to add Apple Pay or Google Pay: Copy one of the existing SVG blocks and replace the path data with the appropriate icon. You can find free payment SVGs on simpleicons.org.

Want this done for you?

I'll install this on your Shopify store, test it across devices, and make sure it's working perfectly. Done within 24 hours.

Install for Me — $29