Unsupported or Custom Platform: Getting Started

If you're running on a custom-built or e-commerce platform other than those listed below, use this guide to learn how to install the Stamped main widget, add Product Rich Snippets, and push your order data into Stamped.

• Shopify

In this guide

• Adding the main widget
• Including Product Rich Snippets
• Pushing orders into Stamped

Adding the main widget

This is where the reviews submitted by your customers will be shown, and customers will also be able to share reviews directly in the widget. Installation of this widget is simple and just requires a script and HTML element to be added.

Add in Header:

<script type="text/javascript" src="https://cdn1.stamped.io/files/widget.min.js"></script>
<script type="text/javascript">//<![CDATA[ 
StampedFn.init({ apiKey: '##publicAPIKey##', sId: '##storeHash##' }); 
// ]]></script>

Add in Product Page for Main Review Widget: 

<div id="stamped-main-widget" 
data-product-id="##product.id##" 
data-name="##product.title##" 
data-url="##product.url##" 
data-image-url="##product.image##" 
data-description="##product.description##" 
data-product-sku="##product.handle##"> 
</div>

Add in Product / Collection page for Reviews Star Badge: 

<span class="stamped-product-reviews-badge stamped-main-badge" data-id="##product.id##"></span>

Note: Replace all variables with your store's and product's info. ##sId## should be the storeHash, which you can find in the API Keys section in the dashboard
https://go.stamped.io/v3/#/settings/api
 

Including Product Rich Snippet

Before you start 

This script requires your store to already have a product schema (JSON-LD) present on each product page. This is typically added by a developer or an SEO app. If your store does not have existing product schema, this script will not work. If you are unsure, check with your developer or contact our support team before proceeding.

To include the product rich snippet, your store needs to have a set of product schema codes present in the site, which can be custom-developed or rendered by an SEO app. Once the product schema is present, please install the following script:

<script>

function addEventListenerStamped(el, eventName, handler) {
  if (el.addEventListener) { el.addEventListener(eventName, handler); }
  else { el.attachEvent('on' + eventName, function () { handler.call(el); }); }
}

addEventListenerStamped(document, 'stamped:reviews:loaded', function(e) {
  if (typeof jQueryStamped === 'undefined') return;

  var ratingCount = parseInt(jQueryStamped('meta[itemprop="reviewCount"]').attr('content'), 10);
  var ratingValue = parseFloat(jQueryStamped('meta[itemprop="ratingValue"]').attr('content'));

  if (document.querySelector('script[data-stamped-rich-snippet]')) return;

  var richSnippet = {
    "@context": "http://schema.org",
    "@type": "Product",
    "@id": window.location.href + "#product"
  };

  if (ratingValue > 0) {
    richSnippet.aggregateRating = {
      "@type": "AggregateRating",
      "ratingValue": ratingValue,
      "reviewCount": ratingCount
    };
  }

  var script = document.createElement('script');
  script.type = 'application/ld+json';
  script.setAttribute('data-stamped-rich-snippet', 'true');
  script.innerHTML = JSON.stringify(richSnippet);
  document.getElementsByTagName('head')[0].appendChild(script);
});

</script>

The script above automatically generates a dynamic @id value based on the current page URL. You will need to ensure that your existing product schema code also uses a matching dynamic value for the @id field. It must reflect the canonical URL of whichever product page it is on. For example: "@id": window.location.href + "#product" If your product schema is rendered server-side or via an SEO app, ensure the @id value it outputs matches this format. A mismatched or hardcoded @id will prevent the two schema pieces from linking correctly, and Google may not display your star ratings in search results.

You can use Google's Rich Results Test or Schema.org’s Schema Markup Validator test tool to confirm that the placement of the code is correct. You should see the aggregateRating field rendering within the product schema on product pages, which contains reviews:

Pushing Orders Into Stamped

We'll need to know when a new order has been created or fulfilled so that Stamped can send the customer a review request email. This can be done by pushing order data into Stamped:

• Integration with Stamped REST APIs

On an order creation or fulfilment event, make a POST request to the Stamped Orders API endpoint with your order details. This will trigger a review request email to be generated, added to the Stamped Review Request Pending queue, and sent to the customer on the scheduled date. Full API documentation including required fields, authentication, and example payloads can be found in the Stamped REST API reference. If you are unsure which event to hook into, we recommend triggering on order fulfilment, as this is when the customer is most likely to have received their product.