FreeBlockTrust

Trust Badges

Compact horizontal trust strip, pastes into Custom Liquid.

#trust#badges#shipping#checkout#custom-liquid

Live preview

See it in action.

Fully interactive, drag, click, scroll inside the frame, toggle to mobile.

About this block

A minimal trust strip with inline SVG icons. Add as many badges as you like, each one is a single block of HTML you can duplicate. Place above footer or under cart for instant credibility.

Install in 90 seconds

  1. 01

    Open your Shopify admin and go to Online Store โ†’ Themes โ†’ Customize.

  2. 02

    On any template, click "Add section" where you want the block to appear.

  3. 03

    Choose "Custom Liquid" from the section list.

  4. 04

    Paste the code from this page into the Custom Liquid setting and click Save.

  5. 05

    Edit text and colors directly in the code (look for the comments marking edit points).

The code

Paste the snippet below into the Custom Liquid setting on a Custom Liquid section in your Theme Editor. Edit text, colors, and links directly in the code, every editable spot is marked with an EDIT comment.

modblo-trust-badges.liquid
{%- comment -%}
  modblo. Trust Badges Block
  Paste into a Shopify "Custom Liquid" section via Theme Editor.
  Each badge is one .modblo-tb__cell, duplicate to add more, delete to remove.
{%- endcomment -%}

<style>
  .modblo-tb {
    background:#fafafa; color:#0b0b0c; padding:18px 0;                  /* EDIT colors */
    border-top:1px solid rgba(0,0,0,.08);
    border-bottom:1px solid rgba(0,0,0,.08);
  }
  .modblo-tb__inner { max-width:1200px; margin:0 auto; padding:0 24px; display:flex; flex-wrap:wrap; gap:28px; justify-content:center; align-items:center; }
  .modblo-tb__cell { display:inline-flex; align-items:center; gap:8px; font-size:13px; font-weight:500; opacity:.85; }
  .modblo-tb__icon { color:#6366f1; display:flex; align-items:center; justify-content:center; }   /* EDIT icon color */
  @media (max-width:600px) {
    .modblo-tb__inner { gap:18px; padding:0 16px; }
    .modblo-tb__cell { font-size:12px; }
  }
</style>

<section class="modblo-tb">
  <div class="modblo-tb__inner">
    {%- comment -%} EDIT each badge: change SVG icon + label text {%- endcomment -%}
    <div class="modblo-tb__cell">
      <span class="modblo-tb__icon">
        <svg viewBox="0 0 24 24" width="18" height="18" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="11" width="18" height="11" rx="2"/><path d="M7 11V7a5 5 0 0 1 10 0v4"/></svg>
      </span>
      <span>Secure checkout</span>
    </div>
    <div class="modblo-tb__cell">
      <span class="modblo-tb__icon">
        <svg viewBox="0 0 24 24" width="18" height="18" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"><path d="M1 3h13v13H1zM14 8h5l3 3v5h-8V8z"/><circle cx="6" cy="19" r="2"/><circle cx="17" cy="19" r="2"/></svg>
      </span>
      <span>Free shipping over $75</span>
    </div>
    <div class="modblo-tb__cell">
      <span class="modblo-tb__icon">
        <svg viewBox="0 0 24 24" width="18" height="18" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"><path d="M3 12a9 9 0 1 0 3-6.7"/><path d="M3 4v5h5"/></svg>
      </span>
      <span>60-day returns</span>
    </div>
    <div class="modblo-tb__cell">
      <span class="modblo-tb__icon">
        <svg viewBox="0 0 24 24" width="18" height="18" fill="currentColor"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"/></svg>
      </span>
      <span>4.9 / 5 from 2,400+ reviews</span>
    </div>
  </div>
</section>

What you can customize

Custom Liquid sections don't expose theme-editor settings, so customization happens in the code. Here's what to edit:

WhatHow to edit
Badge labelsChange the text in each <span> after the icon.
IconsEach icon is an inline SVG, swap with your own or pick from feathericons.com.
Icon colorLook for /* EDIT icon color */.

SEO & accessibility notes

  • Inline SVG icons, no font dependencies, no extra requests.
  • Wraps to multiple lines on narrow viewports automatically.