How to add trust badges to the footer of the Dawn theme?

Ayeshali1 · ‎01-10-2023

Is there any code to add trust badges on the footer of the Shopify dawn theme?

shorterlucey · ‎01-10-2023

Hey! The app store has a bunch of great options to do this. A couple highly rated options are below, or you can check out the full list here (link).

https://apps.shopify.com/ultimate-trust-badge

https://apps.shopify.com/trust-badge-by-giraffly

https://apps.shopify.com/avada-boost-sales

BSS-Commerce · ‎01-11-2023

Hi @Ayeshali1

We would like to suggest you a solution below:

- Go to Admin => Online Store => Theme => Edit Code => search footer.liquid:

- Click on footer.liquid, scroll to the bottom of the page, and add the following code before the <div class="footer__copyright caption"> tag (a tip is: Ctrl + F then enter <div class="footer__copyright caption"> to search)

<div class="bss-trust-badges-wrapper">
        <ul class="bss-trust-badges-list">
            <li class="bss-trust-badges-list-item">
                <span class="bss-trust-badges-list-item-icon">
                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><!--! Font Awesome Pro 6.2.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M112 0C85.5 0 64 21.5 64 48V96H16c-8.8 0-16 7.2-16 16s7.2 16 16 16H64 272c8.8 0 16 7.2 16 16s-7.2 16-16 16H64 48c-8.8 0-16 7.2-16 16s7.2 16 16 16H64 240c8.8 0 16 7.2 16 16s-7.2 16-16 16H64 16c-8.8 0-16 7.2-16 16s7.2 16 16 16H64 208c8.8 0 16 7.2 16 16s-7.2 16-16 16H64V416c0 53 43 96 96 96s96-43 96-96H384c0 53 43 96 96 96s96-43 96-96h32c17.7 0 32-14.3 32-32s-14.3-32-32-32V288 256 237.3c0-17-6.7-33.3-18.7-45.3L512 114.7c-12-12-28.3-18.7-45.3-18.7H416V48c0-26.5-21.5-48-48-48H112zM544 237.3V256H416V160h50.7L544 237.3zM160 464c-26.5 0-48-21.5-48-48s21.5-48 48-48s48 21.5 48 48s-21.5 48-48 48zm368-48c0 26.5-21.5 48-48 48s-48-21.5-48-48s21.5-48 48-48s48 21.5 48 48z"/></svg>
                </span>
                <div class="bss-trust-badges-list-item-discribe">
                    <h3 class="bss-trust-badges-list-item-label">shipping charges</h3>
                    <p class="bss-trust-badges-list-item-text">Flat Charges: PKR 99 on all orders</p>
                </div>
            </li>
            <li class="bss-trust-badges-list-item">
                <span class="bss-trust-badges-list-item-icon">
                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><!--! Font Awesome Pro 6.2.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M112 0C85.5 0 64 21.5 64 48V96H16c-8.8 0-16 7.2-16 16s7.2 16 16 16H64 272c8.8 0 16 7.2 16 16s-7.2 16-16 16H64 48c-8.8 0-16 7.2-16 16s7.2 16 16 16H64 240c8.8 0 16 7.2 16 16s-7.2 16-16 16H64 16c-8.8 0-16 7.2-16 16s7.2 16 16 16H64 208c8.8 0 16 7.2 16 16s-7.2 16-16 16H64V416c0 53 43 96 96 96s96-43 96-96H384c0 53 43 96 96 96s96-43 96-96h32c17.7 0 32-14.3 32-32s-14.3-32-32-32V288 256 237.3c0-17-6.7-33.3-18.7-45.3L512 114.7c-12-12-28.3-18.7-45.3-18.7H416V48c0-26.5-21.5-48-48-48H112zM544 237.3V256H416V160h50.7L544 237.3zM160 464c-26.5 0-48-21.5-48-48s21.5-48 48-48s48 21.5 48 48s-21.5 48-48 48zm368-48c0 26.5-21.5 48-48 48s-48-21.5-48-48s21.5-48 48-48s48 21.5 48 48z"/></svg>
                </span>
                <div class="bss-trust-badges-list-item-discribe">
                    <h3 class="bss-trust-badges-list-item-label">shipping charges</h3>
                    <p class="bss-trust-badges-list-item-text">Flat Charges: PKR 99 on all orders</p>
                </div>
            </li>
            <li class="bss-trust-badges-list-item">
                <span class="bss-trust-badges-list-item-icon">
                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><!--! Font Awesome Pro 6.2.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M112 0C85.5 0 64 21.5 64 48V96H16c-8.8 0-16 7.2-16 16s7.2 16 16 16H64 272c8.8 0 16 7.2 16 16s-7.2 16-16 16H64 48c-8.8 0-16 7.2-16 16s7.2 16 16 16H64 240c8.8 0 16 7.2 16 16s-7.2 16-16 16H64 16c-8.8 0-16 7.2-16 16s7.2 16 16 16H64 208c8.8 0 16 7.2 16 16s-7.2 16-16 16H64V416c0 53 43 96 96 96s96-43 96-96H384c0 53 43 96 96 96s96-43 96-96h32c17.7 0 32-14.3 32-32s-14.3-32-32-32V288 256 237.3c0-17-6.7-33.3-18.7-45.3L512 114.7c-12-12-28.3-18.7-45.3-18.7H416V48c0-26.5-21.5-48-48-48H112zM544 237.3V256H416V160h50.7L544 237.3zM160 464c-26.5 0-48-21.5-48-48s21.5-48 48-48s48 21.5 48 48s-21.5 48-48 48zm368-48c0 26.5-21.5 48-48 48s-48-21.5-48-48s21.5-48 48-48s48 21.5 48 48z"/></svg>
                </span>
                <div class="bss-trust-badges-list-item-discribe">
                    <h3 class="bss-trust-badges-list-item-label">shipping charges</h3>
                    <p class="bss-trust-badges-list-item-text">Flat Charges: PKR 99 on all orders</p>
                </div>
            </li>
            <li class="bss-trust-badges-list-item">
                <span class="bss-trust-badges-list-item-icon">
                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><!--! Font Awesome Pro 6.2.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M112 0C85.5 0 64 21.5 64 48V96H16c-8.8 0-16 7.2-16 16s7.2 16 16 16H64 272c8.8 0 16 7.2 16 16s-7.2 16-16 16H64 48c-8.8 0-16 7.2-16 16s7.2 16 16 16H64 240c8.8 0 16 7.2 16 16s-7.2 16-16 16H64 16c-8.8 0-16 7.2-16 16s7.2 16 16 16H64 208c8.8 0 16 7.2 16 16s-7.2 16-16 16H64V416c0 53 43 96 96 96s96-43 96-96H384c0 53 43 96 96 96s96-43 96-96h32c17.7 0 32-14.3 32-32s-14.3-32-32-32V288 256 237.3c0-17-6.7-33.3-18.7-45.3L512 114.7c-12-12-28.3-18.7-45.3-18.7H416V48c0-26.5-21.5-48-48-48H112zM544 237.3V256H416V160h50.7L544 237.3zM160 464c-26.5 0-48-21.5-48-48s21.5-48 48-48s48 21.5 48 48s-21.5 48-48 48zm368-48c0 26.5-21.5 48-48 48s-48-21.5-48-48s21.5-48 48-48s48 21.5 48 48z"/></svg>
                </span>
                <div class="bss-trust-badges-list-item-discribe">
                    <h3 class="bss-trust-badges-list-item-label">shipping charges</h3>
                    <p class="bss-trust-badges-list-item-text">Flat Charges: PKR 99 on all orders</p>
                </div>
            </li>
        </ul>
    </div>

- Note add SVG tag with the image you want and edit the text content you want in the badges
- Click save in the upper right corner of the screen
- Then search for bass.css

- Select base.scss and add the following code at the bottom of the page and click save:

.bss-trust-badges-wrapper{
            width: 100%;
        }
        .bss-trust-badges-list{
            list-style: none;
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 0;
        }

        .bss-trust-badges-list-item{
            display: flex;
            align-items: center;
            flex: 1 1;
        }

        .bss-trust-badges-list-item:not(.bss-trust-badges-list-item:first-child){
            margin-left: 10px;
        }

        .bss-trust-badges-list-item-icon{
            flex-basis: 40px;
            height: auto;
            display: block;
            margin-right: 10px;
        }

        .bss-trust-badges-list-item-icon svg{
            fill: #555;
            width: 100%;
            height: 100%;
        }

        .bss-trust-badges-list-item-label{
            margin: 0;
            text-transform: uppercase;
            font-size: 14px;
            color: #555;
            font-weight: 700;

        }

        .bss-trust-badges-list-item-text{
            margin: 0;
            margin-top: 5px;
            color: #888;
        }

        @media  only screen and (max-width: 750px) {
            .bss-trust-badges-list{
                flex-direction: column;
            }

            .bss-trust-badges-list-item{
                flex-direction: column;
                text-align: center;
            }

            .bss-trust-badges-list-item-icon{
                width: 3rem;
            }

            .bss-trust-badges-list-item:not(.bss-trust-badges-list-item:first-child){
                margin-top: 15px;
                margin-left: 0;
            }
        }

- Here is the result on the storefront:

I hope that it can help you solve the issue

If our suggestions are useful, please let us know by giving it a like, marking it as a solution, or donating here ☕.

Product Labels by BSS | B2B Solution & Custom Pricing

Need help from our expert? Kindly share your request with us via community@bsscommerce.com

BSS Commerce - Full-service eCommerce Agency

Nemanja_Janjic · ‎06-20-2025

Hi! 😊
The image you posted is from the TrustMark app.
You can install it here https://apps.shopify.com/trusticon-guarantees-features

Here are a few more examples of what’s available in this app.

Nemanja J. CEO @Shopbooster apps - Free and premium Shopify apps | Monimo Review app - Monimo.app
| Schedula | TrustIcon