One of the most frequently asked questions we get from our Shopify customers is how they can add a Trustpilot widget to their site. This process isn’t quite as straightforward as you might think, particularly if you want to customize the appearance and placement of the widget. Fortunately we’ve broken down the process into a few basic steps that most Shopify merchants should be able to manage.
Before we get into the details around how to add the widget to your site yourself, we do want to mention that we offer free Trustpilot widget installation services to all Trustcrafter users. So if you’re not someone who feels comfortable playing around with your site’s code, we recommend simply installing Trustcrafter from the Shopify App Store (also free), then opening a support ticket with us so we can get the widget added.
For those of you comfortable adding the code yourself, let’s get started.
Adding The Trustpilot Script
The first thing you need to do to get the Trustpilot widget working on your site is to add a link to a script in your site’s head section. You can do this from the Shopify Dashboard by clicking Online Store > Themes then clicking on Actions and Edit code from the dropdown list. Once in the theme editor, you’ll want to find your theme’s theme.liquid file. Once you’ve open the theme file you need to copy and paste the code below into anywhere within your <head></head> tags.
<!-- TrustBox script -->
<script type="text/javascript" src="https://widget.trustpilot.com/bootstrap/v5/tp.widget.bootstrap.min.js" async></script>
<!-- End TrustBox script -->Creating Your Widget Code
The next step will depend upon whether or not you have a Trustpilot account. If you have an account please read the section below, otherwise please skip ahead to the next section.
Trustpilot Account Method
If you have a Trustpilot account then you can simply visit the Trustpilot Business Dashboard and click on Showcase > Website widgets then select Micro Review Count from the grid. This will open a modal window with options that let you configure the style of your widget. Press Get Code to generate the code for your box. Once generated, you only need to copy the lower box of code since we already took care of adding the script in the previous step.
No Trustpilot Account
Those of you without a Trustpilot account will need to do a little bit of digging to locate your Trustpilot Business Unit ID. You can find this by visiting your public Trustpilot profile page (www.trustpilot.com/review/YOUR-SITE-URL) and then using your browser’s inspect or view page source functions. Once you’ve opened the page source you can then find your ID by searching (ctrl+f on Windows, command+f on mac) the code for businessunitid. Once you’ve located an instance of your ID, copy the entire number following businessUnitId=. Drop your ID into the corresponding location in the code below, insert your site URL into the link at the corresponding location, then copy the entire code.
<!-- TrustBox widget - Micro Review Count -->
<div class="trustpilot-widget" data-locale="en-US" data-template-id="5419b6a8b0d04a076446a9ad" data-businessunit-id="INSERT-BUSINESS-UNIT-ID-HERE" data-style-height="24px" data-style-width="100%" data-theme="light" data-min-review-count="10">
<a href="https://www.trustpilot.com/review/INSERT-SITE-URL-HERE " target="_blank" rel="noopener">Trustpilot</a>
</div>
<!-- End TrustBox widget -->Placing Your Widget
The final step involves actually placing your widget on your site. This step can vary quite a bit depending on your Shopify theme and your desired placement, but we’ll go through a sample to give you an idea of how to place the widget under typical circumstances.
Once again you’ll need to visit your site’s theme editor by clicking on Online Store > Themes from the dashboard, then selecting Edit code from the Actions dropdown. Once you’re in the theme editor, you’ll need to decide where you want to place your widget. The most common placements are in your site’s header.liquid or announcement-bar.liquid. Select either of these (make sure you have announcements active if you are using the announcement bar), then past the code near the top of the file. You can play around with the exact location of your widget by moving your code around the file and previewing your site to see how it looks. Your final results should look something like the example below (this uses the announcement bar location).
Additional Customization
You should now have a working basic implementation of the widget working on your site, but you can make further customizations if you’d like to adjust the styling of your widget. Using some basic CSS, you can edit your code to change your widget’s colors, background, size, and more.
If you need assistance customizing your widget (or with any part of the installation process) remember Trustcrafter customers can always open a support ticket with us and we can handle it for you free of charge. Even if you’re comfortable handling installation and customization by yourself, we still highly recommend using a service like Trustcrafter to automatically build your Trustpilot review totals and improve your overall score. After all, your widget is only effective if it can display and link to substantial positive feedback from past customers.