Trustpilot Help Center

Let's find the answers together Trustpilot star

Trustpilot widget alignment

Avatar
Annalyn Ayop 

Hi how to make left alignment in Trustpilot widget

Was this post helpful?

5 comments

Sort by
  • Avatar

    Kenneth Van Velthoven

    Hello,  did anyone managed to get an answer to this?  We have the same issue.   Impossible to align  the widget left or right.


    Tried all different DIV styles/constructions around it.  Nothing helps.    A bit disappointed that such basic feature isn't even documented.   For a company asking at least 250 EUR for a basic plan we expect more.  Thanks.

    3
  • Avatar

    Ace Webmaster

    Would love to know how to do this too!

    1
  • Avatar

    james hardy

    Any one find out how to do this? you can send data-style- attributes but tried ones for alignment and they didnt work. eg data-style-width works but not data-style-align...etc

    0
  • Avatar

    Sarah Trustpilot

    There is a solution for this via CSS iframe or div alignment. Here's an example of the code:

    !DOCTYPE html>
<html>
  <head>
    <!-- TrustBox script -->
    <script type="text/javascript" src="//widget.trustpilot.com/bootstrap/v5/tp.widget.bootstrap.min.js" async></script>
    <!-- End TrustBox script -->

    <style>
      .trustpilot-widget iframe {
        left: -70px !important;
        position: absolute;
      }
      div.a {
        position: relative;
        width: 400px;
        height: 200px;
        border: 3px solid red;
      }
      div.b {
        position: absolute;
        left: -50px;
        width: 100px;
        height: 52px;  
      } 
      div.c {
        position: absolute;
        left: 0px;
        width: 212px;
        height: 52px;
        border: 3px solid green;
      }
    </style>
  </head>
  <body>
    <div class="a">
      <div class="b"></div>
      <div class="c">
        <!-- TrustBox widget - Review Collector -->
        <div class="trustpilot-widget" data-locale="en-GB" data-template-id="56278e9abfbbba0bdcd568bc" data-businessunit-id="xxxxxxxxxxxxxxxxxxxxxxxx" data-style-height="52px" data-style-width="350">
          <a href="https://uk.trustpilot.com/review/hrh.tp-testing.com" target="_blank" rel="noopener">Trustpilot</a>
        </div>
        <!-- End TrustBox widget -->
      </div>
    </div>
  </body>
</html>
    -2
  • Avatar

    Ben Siman Tov

    I managed to resolve it using the following CSS rule I've set on the widget container

    width: max-content;

     

    0
Please sign in to leave a comment.