There are tons of strategies that can help you improve your checkout page, but including trust badges or seals within the checkout process is an easy change to A/B test, and that typically yields conversion increases for most sites. It’s one of the methods we usually recommend for building trust in your site.

You should keep in mind that these badges are here to build trust and confidence in your checkout, so if you’ve never modified your site, you may want to enlist the help of a developer to add these to your site. If your trust badges look cheesy or like they don’t belong in the checkout, their inclusion may have an adverse effect on conversions.

Why Use Trust Seals or Badges

Trust badges increase buyer confidence, just like seeing the green lock from SSL certificates does: customers are more likely to trust your checkout process and purchase from your site. For example, here’s an ad hoc study from Actual Insights that shows customers look first for the https / “green lock” indicator, then for trust badges.

As a result, including trust badges can improve your conversion rate. For example, this DistroKid case study shows that trust badges were one of the modifications made to checkout that yielded a 60% increase in conversions.

What is a Trust Seal

You’ll typically get trust seals or badges from your SSL certificate provider, payment processor, or hosting company. You can also include Better Business Bureau seals or any other credentials that you have permission to use.

Typically these services will give you either an image file (unlikely) or javascript snippet (more likely) you can use to include the trust seal on your site, which may look something like this:

<span id="siteseal"><script type="text/javascript" src="https://seal.godaddy.com/getSeal?sealID=your_really_long_seal_id"></script></span>

If you’re not sure where to add this, it can be challenging to leverage this seal to your advantage, so let’s take a look at how to add trust badges and seals to your checkout process.

How to Add Trust Badges to Any Site

If you want the quick and easy way to add trust seals to your site, you can use a footer widget to display the trust badges in your site’s footer. Copy the snippet that inserts your site seal, and then paste this into a new text widget in your footer:

Add Trust Seal

You’ll now see this displayed on every page on your site.

Add Site Seal to Footer

If you want a solution that’s more integrated with your checkout page, you’ll need to modify your checkout template, or use a hook to add your trust seals. This will depend on which platform you use, so let’s take a look at a few popular eCommerce plugins.

How to Add Trust Badges to WooCommerce Checkout

You could override your checkout templates to add trust seals, but adding them via an action will give you a more upgrade-safe integration. The WooCommerce checkout templates have actions that you can use to add these site seals.

For example, here’s how we’d add a site seal right above the payment form in the WooCommerce checkout:

function sww_add_seals_to_checkout() {
    echo '<div class="aligncenter" style="text-align: center;">
    // Replace this line with your snippet
    <span id="siteseal"><script type="text/javascript" src="https://seal.godaddy.com/getSeal?sealID=your_really_long_seal_id"></script></span>
    </div>';
}
add_action( 'woocommerce_checkout_order_review', 'sww_add_seals_to_checkout' );

Replace the site seal snippet here with your own (here’s how you can add custom code to your site). This will give us seals located right above the payment form:

WooCommerce Checkout Trust Seals

Checkout seals

Since you already have this snippet added to your site, you can also add these seals to the cart page as a bonus. You’d have to add one more line of code below the previous snippet:

add_action( 'woocommerce_proceed_to_checkout', 'sww_add_seals_to_checkout', 30 );

This gives you seals below the “Proceed to Checkout” button as well:

WooCommerce cart page site seals

Cart page trust seals

Add Trust Badges to Easy Digital Downloads Checkout

There are some useful actions we can use in the Easy Digital Downloads checkout template to add our trust badges to the EDD. I’m going to add them right above the payment form using the edd_checkout_form_top action.

We can do so pretty easily by adding our trust badge’s code into this snippet:

function sww_add_seals_to_checkout() {
    echo '<div>
       // Replace with your seal's snippet
    <span id="siteseal"><script type="text/javascript" src="https://seal.godaddy.com/getSeal?sealID=site_id"></script></span>
    </div>';
}
add_action( 'edd_checkout_form_top', 'sww_add_seals_to_checkout', 1 );

This gives you any trust badges you want to display right above the checkout form:

Easy Digital Downloads Trust Badges 2

Trust Badges added

However, we can improve this a bit to blend in with our checkout. Let’s update our snippet to add a “secured” notice and a background that blends in with the rest of the checkout components.

We’ll replace the other snippet with this one:

function sww_add_seals_to_checkout() {
    echo '<div class="trust-seals">
    <span class="dashicons dashicons-lock"></span><strong>Secured & 256-bit encrypted</strong>
    <span id="siteseal"><script type="text/javascript" src="https://seal.godaddy.com/getSeal?sealID=seal_id"></script></span>
    </div>';
}
add_action( 'edd_checkout_form_top', 'sww_add_seals_to_checkout', 1 );

and then add a tiny bit of CSS to our theme’s stylesheet (I’m using the free Vendd theme):

.trust-seals {
    background: #fafafa;
    color: #333;
    border: 1px solid #f2f2f2;
    padding: 10px;
    width: 50%;
    margin-bottom: 20px;
}

This gives us a more noticeable trust badge section on the checkout page:

Easy Digital Downloads Trust Badges 2

Updated badge section

Add Trust Badges to WP eCommerce Checkout

Unfortunately there’s only one spot to add trust badges to the WP eCommerce checkout page: right after the purchase form. This is near the payment form though, so it’s not a bad place to add them.

We can add your site seals here using this snippet:

function sww_add_seals_to_checkout() {
    echo '<div>
       // Replace with your seal's snippet
    <span id="siteseal"><script type="text/javascript" src="https://seal.godaddy.com/getSeal?sealID=site_id"></script></span>
    </div>';
}
add_action( 'wpsc_bottom_of_shopping_cart', 'sww_add_seals_to_checkout', 1 );
WP ecommerce trust badges

WP eCommerce checkout

Add Trust Badges to Checkout

This tutorial can help you get started with adding site seals and trust badges to your eCommerce store, and you can improve how these are displayed on your site with the help of a frontend developer.

As always, don’t forget to test your checkout conversions with the addition of trust badges. I’d love to hear about your results in the comments if you do!


Note: This post may contain affiliate links, which means we get a commission from the plugin, theme, or service provider if you choose to purchase. Regardless of this, we are committed to providing high quality, unbiased resources. Have more questions? See our affiliate policy. You can use the plain links below if you prefer that we not receive a referral commission:
Articles you may also like:

Posted by Beka Rice

Beka Rice manages the direction of Sell with WP content and writes or edits most of our articles to share her interests in eCommerce. Or she just writes as an excuse to spend more time jamming out to anything from The Clash to Lady Gaga. Who knows.

10 Comments

  1. I wonder if there’s any practical difference between using an SSL vendor seal and just using a custom graphic that says “this site is secured with SSL for your protection” with a lock on it? We had a client ask us to do this for them, and the SSL vendor seal was the ugliest thing I had ever seen. And since it was loading from a third party it was actually slowing down the checkout page. So instead we just designed a nice custom graphic–it seems to have done the trick because the client reports fewer support queries about security on the site.

    Reply

    1. Hey Dalton, typically the vendor seal generated by javascript links to a verification page so that customers can get the security information directly from the certificate issuer / hosting company / etc that confirms the website is indeed secured. I’m pretty sure those verification pages aren’t static so you can’t link to it directly without the js script, but it could be worth checking.

      Reply

    2. I have not compared a custom graphic to a vendor seal, but I have compared a custom graphic to no graphic at all and it did make a positive difference.

      Reply

  2. Hi Beka! Thanks for great post! Using your code and Code Snippets Plugin I successfully added badge of trust to my Woocommerce checkout and cart . However, on cart page the badge is above “Proceed to Checkout” button, not below it as in your screenshot. How do I fix it? Thanks!

    Reply

    1. Hey Greg, try changing the priority to something higher — instead of “30”, try “50” or “99”. WooCommerce, by default, hooks that button in a priority of “20”, so if making the priority even higher doesn’t work, it means you’d need to dig into your theme further to figure out how it’s outputting that button as the template may be overridden.

      Reply

  3. Hello Beka,
    I am very much a beginner at building websites. I am using your advice above to add the security logo via comodo to my website. However, once I used the code provided above with the snippet given by comodo, I only saw a hyperlink with Essential SSL in the locations. The code snippets that comodo generated for me have two options, one for and one for . Any guidance would be greatly appreciated.

    Reply

  4. Hi there,

    Excellent post, just what I needed!

    I’ve added Trust Seal snippet to a WooCommerce Cart page and the seal sits right up against the ‘Add To Cart’ button. Do you know how to add a line space above the seal?

    I’ve added:
    echo nl2br (” \n “);
    …below the ‘; line to insert a lie break after the seal which works well on the Checkout page, otherwise the seal sits right up against the payment processor box.

    any information would be appreciated :o)

    Reply

    1. I’d probably recommend adding a CSS class instead, that way you can target it a bit more specifically with a top margin in your stylesheet.

      Reply

  5. Hmmm, don’t know how to do that. Back to Google I guess :o)

    Thanks for the response though

    Reply

  6. I used the Trustbadge reviews widget on my online shop https://www.litespot.co.uk/ to collect and show customer reviews. It’s fairly easy to use and very easy to integrate. They have many integrations in different shop systems. And it comes with 7 languages and is mobile-optimized. There’s a freemium version available at at http://www.trustbadge.com.

    Reply

Leave a reply

Your email address will not be published. Required fields are marked *