Adding Structured Data to your eCommerce website (JSON-LD & Microdata)

 

If you add products to Google Shopping, you might have encountered an error saying that prices could not be updated dynamically or missing microdata for condition etc…
The reason for this is that something on your website is causing an issue.

Typical Google Merchant Warnings :

  • Automatic item updates: Insufficient match of structured data price information
  • Automatic item updates: Missing schema.org structured data price information
  • Automatic item updates: Missing schema.org structured data availability information
  • Missing microdata for condition

Possible Causes :

  • You have enabled Automatic item update
    • You can disable this feature in Settings > Automatic Item Update, however I would recommend keeping this enabled
  • Multiple prices
  • Prices in the wrong currency
  • Only showing VAT exclusive prices
  • No structured data

Structured data is essentially an extra tag that you need to wrap around your HTML elements or using JSON-LD. This speeds up the crawling process for Google Merchant and avoids collecting wrong data, this article is referenced from Google Shopping FAQ.

If you are looking to add structured data to a eCommerce platform please have a look at the pre-made codes from the list below.

Here are some examples for developers.

JSON-LD

<script type="application/ld+json">
{
  "@context": "http://schema.org/",
  "@type": "Product",
  "image": "http://example.com/test.jpg",  
  "name": "Example Test",
  "description": "This is just a boring example",
    "offers": {
    "@type": "Offer",
    "priceCurrency": "USD",
    "price": "199.99"
  }
}
</script>

Microdata

Using a combination of HTML elements and meta tags

<div itemscope itemtype="http://schema.org/Product">
    <span itemprop="brand">The Brand</span>
    <span itemprop="name">The name</span>
    <img itemprop="image" src="http://example.com/myimage.jpg">
    <span itemprop="description">My Description</span>
    <span itemprop="productID" content="upc:">1234</span>
    <div itemprop="offers" itemscope itemtype="http://schema.org/Offer">
        Price: <span itemprop="price">10.00</span>
        Condition: <span itemprop="itemCondition" content="new">new</span>
    </div>
<meta itemprop="availability" content="http://schema.org/InStock"/> In Stock
<meta itemprop="gtin14" content="00886227537143" />
</div>

Using Meta tags only, beneficial if you don’t want to show values to your visitors

<div itemscope itemtype="http://schema.org/Product">
  <meta itemprop="name" content="Google Nexus 7" />
  <meta itemprop="gtin14" content="00886227537143" />
  <div itemprop="offers" itemscope="" itemtype="http://schema.org/Offer">
    <meta itemprop="priceCurrency" content="GBP">
    <meta itemprop="price" content="£289.95">
    <meta itemprop="availability" content="In Stock">
    <meta itemprop="itemCondition" itemtype="http://schema.org/OfferItemCondition" content="http://schema.org/NewCondition" />
  </div>
</div>

If you offer multiple currencies on your web page than you can list all of them on one page using meta tags.

<div itemtype="http://schema.org/Product" itemscope>
  <meta itemprop="name" content="Google Nexus 7">
  <meta itemprop="sku" content="abc123">
  <meta itemprop="gtin14" content="00886227537143" />
  <div itemprop="offers" itemscope itemtype="http://schema.org/Offer">
    <meta itemprop="price" content="229.95" />
    <meta itemprop="priceCurrency" content="USD" />
  </div>
  <div itemprop="offers" itemscope itemtype="http://schema.org/Offer">
    <meta itemprop="price" content="27800" />
    <meta itemprop="priceCurrency" content="JPY" />
  </div>
</div>

Important

If you have existing schema data than you need to ether delete the old schema data or copy elements you need from the code above into your existing schema. If you don’t do this, than Google will see two product listings which will result in errors.

For Example, if I already have the price, priceCurrency and availability, but do not have itemcondition. Than you need to copy the one line itemcondition and paste it inside the offers container. And not create a new offer container.

<meta itemprop="itemCondition" itemtype="http://schema.org/OfferItemCondition" content="http://schema.org/NewCondition" />

Checking The Results

You can use Google’s Structured data testing tool, to check if everything is done correctly. The below image shows an example of a correct listing.

Google Structured Data Testing Result