Trust badges in the Shopify cart drawer without code

The cart drawer is the panel that slides in when a shopper adds a product. It shows the cart, the total and the checkout button. That makes it a natural spot for a short reassurance: free shipping, easy returns, secure payment, the payment methods you accept.

Adding a trust badge there is harder than on the product page. This guide explains why, compares the two ways to do it and lists what to test before you rely on the result.

Drawer, page or popup

Shopify themes offer more than one cart type, so first check which one your store uses. In Dawn, the setting sits under Theme settings and Cart, with the types Drawer, Page and Popup notification. Dawn starts with the popup notification: a small panel with the message "Item added to your cart" and a link to the cart page.

In the demo stores of the free Shopify themes, Refresh, Origin, Publisher and the themes of the Horizon family open a cart drawer. Dawn and the other themes of its family show the popup notification. To check your own store, add a product to the cart and look at what opens. Everything below applies to the drawer, and most of it to the popup as well.

Why an app block does not reach the drawer

On a product page you can add an app block in the theme editor: you open the product section, click Add block and pick the app. That works because app blocks go into sections, and a section has to accept blocks of the type @app. Shopify's developer documentation lists this as a requirement for app blocks.

The cart drawer is not such a section. In Dawn and in Horizon it is a snippet, snippets/cart-drawer.liquid, which the theme layout includes in its pages. It has no block settings of its own, so the theme editor has no place to add an app block to it. On Shopify's developer forum, a developer asked in December 2024 how to get an app block into the cart drawer. A Shopify team member answered that this does not look possible natively with deep linking, and that Shopify provides no alternative out of the box.

That leaves two ways: change the theme code, or use an app that places the badge in the drawer for you.

Way 1: edit the theme code

You or a developer can add the badge markup to the drawer snippet in the code editor of your theme. This works, and for a single line of text it is a short edit. Count the costs before you start:

• The edit belongs to this theme. When you move to a new version of your theme or to another theme, you carry the edit over by hand.
• The drawer changes while the shopper uses it. Themes render the drawer again when the cart changes, for example after a quantity change. Markup in the snippet survives that; content added later by a script needs extra care.
• You maintain the badge by hand. Icons, colors, translations and payment logos all live in code.
• It stays when you change your mind. Code you added remains until someone removes it.

If you have a developer and expect few changes, this is a reasonable path. Keep a note of what you changed and where.

Way 2: an app that places badges in the drawer

A badge app can reach the drawer through its app embed, the switch for the whole theme. The embed loads a small script that finds the drawer on the page and puts the badge in the place you chose. Your theme code stays unchanged, and switching the embed off removes the badge.

The work then moves to the app, so test it with your theme before you rely on it:

• The badge comes back after changes. Change the quantity, remove an item and add another product. The badge should still be there each time.
• One badge, not two. Open and close the drawer several times. A badge that appears twice looks broken.
• The checkout button stays in view. On a phone, the badge must not push the checkout button below the screen.
• It works with the keyboard. The drawer is a dialog. If the badge has links or popups, they should work with the Tab key inside the drawer.
• Your theme is covered. Ask whether the app names your theme as tested, or test it in your store before you pay.

What belongs in the drawer

The drawer is small and the shopper is close to checkout. A few rules help:

• Keep it short. One row with a few short promises, or one row of payment icons, is enough. A crowded drawer competes with the checkout button.
• Say only what is true for this order. If free shipping starts at an order value, name the condition. Show only payment methods your checkout accepts.
• Choose top or bottom on purpose. At the top, the badge is seen as soon as the drawer opens. At the bottom, it sits near the checkout button.
• Match the cart page. A shopper who opens the cart page should see the same promises there.

A test before you go live

1. Add a product on a desktop browser and on a phone, and look at the drawer.
2. Change the quantity, then remove the item until the cart is empty.
3. Add two different products and open the drawer again.
4. Move through the drawer with the Tab key.
5. Open the cart page and compare.

How YeahBadges handles it

A cart badge in YeahBadges has a setting Place in the cart with Top of cart or Bottom of cart, and a setting Cart area with Cart page and cart drawer, Cart page only or Cart drawer only. The app embed "YeahBadges: automatic" places the badge, without theme code. In the themes of the Dawn family that show the popup notification instead of a drawer, the badge appears in that notification.

Both places in the drawer are part of the automated tests on the 23 free Shopify themes, described in our guide to tested placements on Dawn and Horizon. If a badge goes missing, the store check in the app names the cause, as explained in Trust badge not showing on Shopify.