Integrating Google My Business reviews into Thank You Page

  • Updated

You can now collect reviews for your store's My Business listing, by making use of Stamped's thank you page.

The message is coded to only show when the customer submits a 5-star rating for the review.


In This Guide


Setting Up the Thank You Page

  1. Copy the snippet code below, which serves as a template for the page:
    <script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.4/clipboard.min.js"></script>
    <div style="display:none;max-width:800px;margin:auto;" id="stamped-custom-wrapper">
      <p>Hi <span class="customer-name"></span>!</p>
    <p>
    Thanks so much for taking the time to leave a review :)
    </p>
    
    <p>
    Currently we are looking to get our customers words onto other review platforms like Google.
    I know you have already left a review with us but I was hoping you could take an extra 2 minutes of your time to share your review on Google too.
    If you feel like helping, simply do the following:
    </p>
    <ol>
      <li>
        Highlight and copy your review
        <br/>    
        <pre id="your-review" class="your-review"></pre>
        <button class="js-copy-btn" data-clipboard-target="#your-review">Copy review</button>
      </li>
      <li>
        Share your review on Google here:
        <br/>
        <a href="https://www.example.com" target="_blank">https://www.example.com
        </a>
      </li>
    </ol>
    <br/>
      <br/>
    <p>
    Again thank you so much for your support!
    </p>
    </div>
    
    
    <script>
      var yourReview;
      
      function getParameterByName(name, url) {
        if (!url) url = window.location.href;
        name = name.replace(/[\[\]]/g, '\\buffer_0amp;');
        var regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)'),
            results = regex.exec(url);
        if (!results) return null;
        if (!results[2]) return '';
        return decodeURIComponent(results[2].replace(/\+/g, ' '));
    }
      
      var reviewId = getParameterByName('reviewId');
      
      if (reviewId){
        $.getJSON('https://stamped.io/api/widget/reviews?type=google&apiKey=##apiKey##&storeUrl=##storeUrl##&reviewId='+reviewId, function(data){
        console.log(data);
        
        var review = data.data[0];
          
          if (review.reviewRating  == 5){
        $('#stamped-custom-wrapper').show();
        
           $('.customer-name').html(review.author);
            $('.your-review').html(review.reviewMessage);
            $('#your-review-input').val(review.reviewMessage);
          
          yourReview = review.reviewMessage;
          }
    
    
       });
      }
    
    
    $( document ).ready(function() {
        var clipboard = new ClipboardJS('.js-copy-btn');
    
    
      clipboard.on('success', function(e) {
        console.log(e);
        $(e.trigger).text('Copied!');
      });
    });
    
    
    </script>
    
    
    <style>
      ol li {
        margin-top: 20px;
    }
      
      .stamped-proxy-thankyou {
        margin-top: 0px !important;
        padding-top: 0px !important;
    }
      .stamped-proxy-thankyou a {
        color: orange;
    }
      
      .stamped-proxy-thankyou > div > div> p {
        display: none !important;
    }
      
      .js-copy-btn {
        background: orange;
        width: 200px;
        padding: 11px;
        text-align: center;
        color: white;
        border-radius: 5px;
        cursor: pointer;
    }
     pre {overflow-x: hidden;
        overflow-y: scroll;
        max-width:500px;
        height:auto;
      white-space:normal;}
    </style>
    	
  2. Paste the codes in the HTML editor of the Thank You page message section.

    MyBusiness1.png

  3. Please feel free to edit the template as required to fit your store's branding, and do not forget to replace the following variables in the codes:
    1. https://www.example.com for the Google review link. You can obtain the review link in your Google My Business account, here's the guide by Google on how to obtain the link: https://support.google.com/business/answer/7035772?hl=en
    2. ##apiKey## and ##storeUrl## in the API call within the script codes

      - The public API key can be obtained from the following page in Stamped's dashboard: https://go.stamped.io/v3/#/settings/api

      - As for the store URL, it needs to be the exact URL as shown in your account's dashboard, under the general settings:
      MyBusiness2.png

Was this article helpful?

0 out of 0 found this helpful

Have more questions? Submit a request