Experts panel

This article has been written and edited by SEO & content specialists and reviewed by field experts.

Jelle Casper van Santen 1st degree connection1st Business Process Consultant

Jelle van Santen (Article author)

Data Analyst and Content Marketing Specialist

 

 

Jairo Guerrero - SaaS & Ecommerce SEO Specialist

Jairo Guerrero (Content reviewer)

Helping CEOs With Their SEO | Growing Websites Traffic x10 With 90-Day Content Sprints | Achieved +5M Revenue With SaaS & eCommerce SEO Campaigns | Trained +100 Companies | SEO Capitan & Founder @ Phanum

 

Use schema markup to increase your CTRs tremendously

This blog will exactly tell eCommerce businesses how to use schema markup to improve their rankings, impressions, and CTR.

The best part?

I’m not only going to tell you what schema markup implementations are best, but I will also show you the code so that you can implement it right now.

In short: if you want higher rankings in Google and more people to click and visit your product pages you will love this article on schema markup for eCommerce.

Table of contents

What is schema markup?
Why is schema markup important for eCommerce websites?
What schema markup do webshops need?
 Organization schema
 BreadcrumbList schema
 WebSite schema
 Product schema
 FAQPage schema
How to add schema markup to an online store
Conclusion

 

What is schema markup?

Schema markup is code that helps search engines to better understand and represent the content of your site. You should see schema markup (also known as structured data) as standardized hints that help you display the right information of your web pages in the search results.

 

Why is schema markup important for eCommerce websites?

When you add schema markup to your eCommerce web pages, search engines will process the information on the site better. In return, search engines can display this information as a rich snippet. And rich snippets give people more information about the website or page and are great for SEO. Let’s look at this SERP (Search Engine Results Page) example.

Schema markup example for Google search

In this SERP for the words “Ipad Review” we see multiple rich snippets that are added to several website links. These rich snippets include breadcrumbs, ratings, prices, pros and cons, and frequently asked questions.

While it is possible for Google to pick these from the content on your webpage, it is much easier to use schema markup to highlight these rich snippets for Google.

While this is a valuable best practice, many eCommerce websites don’t make use of schema markup. Which is a lost opportunity to gain extra traffic to your site. Schema markup can lead to higher rankings within search engines and a higher CTR, which are key KPIs for online stores to increase.

 

What schema markup do webshops need?

Schema markup comes in a lot of different formats. If you take a look at shema.org (the organization which is behind all the schema markup vocabulary) you can find schema markup for literally every type of content. You can use schema markup for music recordings, tv series, recipes, and much more.

However, here are the 5 best schema types that you should include in your eCommerce website. The order is determined by which of these schemas you should focus on implementing first.

 

The 5 most important schema markup implementations for webshops

Organization schema

BreadcrumbList schema

Website schema

Product schema

FAQPage schema

 

Use organization schema to show information about your webshop

Organization schema is useful to make search engines show information about your organization (read: eCommerce store) such as logo, address, phone number, founding date, and much more.

While you can include a lot of information with organization schema in your search engine results, it shouldn’t be overused too much. I recommend implementing relevant organization schema properties (elements within a certain schema type) to your homepage.

Which properties of the organization schema to use depends on your eCommerce business and what information you want to display in the search results. However, organization schema properties such as logo, phone number, and email could be a good addition for most eCommerce stores.

Coolblue schema markup example

In a rich snippet that you find when you Google “Coolblue” you will see their logo, social media profiles, founders, and a telephone number for customer service.

This information is displayed next to the search results and presents information in a visual manner, which gives customers immediately more information about the company without having to take more actions.

 

How to add organization schema markup

<html>
  <head>
    <title>About Us</title>
    <script type="application/ld+json">
    {
      "@context": "https://schema.org",
      "@type": "Organization",
      "url": "http://www.example.com",
      "logo": "http://www.example.com/images/logo.png"
    }
    </script>
  </head>
  <body>
  </body>
</html>

Note: In this example, you only see an implementation of the property logo, but more properties can be added.

 

Use breadcrumbList schema to rank higher in search engines

One of the most important factors for eCommerce websites to rank higher in search engines is a clear and well-structured hierarchy. BreadclumbList schema can make it easier for search engines to understand your site’s hierarchy and display this breadcrumb in, for example, Google’s search results.

The better Google understands the hierarchy of your webshop, the higher it will rank your pages.

Not only is this useful for search engines, but also for potential customers. With this additional piece of information, they know better what to expect when they click on your website’s link.

Basically, the breadcrumbs tell the path to the page you are on. Sort of like the directions, and indeed we like directions to understand where we are but also where we can go.

 

How to implement BreadcrumbList schema markup

(more info at Google Breadcrumbs Guide)

<html>
  <head>
    <title>Award Winners</title>
    <script type="application/ld+json">
    {
      "@context": "https://schema.org",
      "@type": "BreadcrumbList",
      "itemListElement": [{
        "@type": "ListItem",
        "position": 1,
        "name": "Books",
        "item": "https://example.com/books"
      },{
        "@type": "ListItem",
        "position": 2,
        "name": "Science Fiction",
        "item": "https://example.com/books/sciencefiction"
      },{
        "@type": "ListItem",
        "position": 3,
        "name": "Award Winners"
      }]
    }
    </script>
  </head>
  <body>
  </body>
</html>

 

Use WebSite schema so that users can find products to buy more easily

eCommerce stores may have 1000s or 10.000s products, but how can a user find what he or she is looking for in the search engine results? With WebSite schema!

One of the properties of WebSite schema enables websites to include a Sitelink search box in their search engine result. From here on it is very easy for users to search for a specific product they need. This is especially powerful for eCommerce websites as the user is directly led to the search result page on your website from the Google search results.

ebay rich snippet

With WebSite schema users can directly search for electric guitars from the Google search results.

 

Sitelink search box ebay

After this, users are directly redirected to the search results of electric guitar on your site.

 

How to implement the Sitelink search box schema markup

<html>
  <head>
    <title>The title of the page</title>
    <script type="application/ld+json">
    {
      "@context": "https://schema.org",
      "@type": "WebSite",
      "url": "https://www.example.com/",
      "potentialAction": {
        "@type": "SearchAction",
        "target": {
          "@type": "EntryPoint",
          "urlTemplate": "https://query.example.com/search?q={search_term_string}"
        },
        "query-input": "required name=search_term_string"
      }
    }
    </script>
  </head>
  <body>
  </body>
</html>

Note: It is best to only use this WebSite schema property for only one of your pages. Preferably your homepage!

 

Use product schema to make your products stand out from the rest

With product schema, you are able to show more information about your product in the Google search results. Properties you could use within the product schema are the average rating that customers gave to your product, a global trade item number, or product reviews.

To showcase the product schemas’ potential, we searched on Google for “Nikon D3500”. As you can see, almost every webshop included a product schema to showcase the ratings and amount of reviews. Some websites even highlighted specific features of the product or its availability.

product schema example nikon

This kind of information is very valuable to customers because they are able to quickly identify if the product a webshop offers is the right product for them and if that product is liked by others. This form of social proof in the form of ratings and reviews is very strong.

If you are the only one that uses product schema, the chances of people clicking on your link are much higher. However, if you are the only one not using it, your chances of getting clicks decreases rapidly.

 

How to implement product schema markup

 <html>
  <head>
    <title>Executive Anvil</title>
    <script type="application/ld+json">
    {
      "@context": "https://schema.org/",
      "@type": "Product",
      "name": "Executive Anvil",
      "image": [
        "https://example.com/photos/1x1/photo.jpg",
        "https://example.com/photos/4x3/photo.jpg",
        "https://example.com/photos/16x9/photo.jpg"
       ],
      "description": "Sleeker than ACME's Classic Anvil, the Executive Anvil is perfect for the business traveler looking for something to drop from a height.",
      "sku": "0446310786",
      "mpn": "925872",
      "brand": {
        "@type": "Brand",
        "name": "ACME"
      },
      "review": {
        "@type": "Review",
        "reviewRating": {
          "@type": "Rating",
          "ratingValue": "4",
          "bestRating": "5"
        },
        "author": {
          "@type": "Person",
          "name": "Fred Benson"
        }
      },
      "aggregateRating": {
        "@type": "AggregateRating",
        "ratingValue": "4.4",
        "reviewCount": "89"
      },
      "offers": {
        "@type": "Offer",
        "url": "https://example.com/anvil",
        "priceCurrency": "USD",
        "price": "119.99",
        "priceValidUntil": "2020-11-20",
        "itemCondition": "https://schema.org/UsedCondition",
        "availability": "https://schema.org/InStock"
      }
    }
    </script>
  </head>
  <body>
  </body>
</html>

 

Use FAQPage schema to position yourself as an authority

eCommerce sites that make use of content for their product or category page SEO should consider using schema for their FAQ sections. Many eCommerce sites have an FAQ section for certain products, including relevant questions that customers want to have answered.

In order to show these FAQs in the search results of search engines, one should use FAQPage schema to markup their FAQ sections. When people will search for the product they might see the questions and answers as well. Again, this may again persuade customers to buy from you instead of your competitors.

FAQPage schema markup example

For example, this Persian rug eCommerce website has FAQs in its rich snippet. It makes it stand out from the rest of the website as it takes up more space on the results page and is more likely to get interactions from customers.

 

How to implement FAQPage schema markup

<html>
  <head>
    <title>Example Site - Frequently Asked Questions(FAQ)</title>
    <script type="application/ld+json">
    {
      "@context": "https://schema.org",
      "@type": "FAQPage",
      "mainEntity": [{
        "@type": "Question",
        "name": "What is the return policy?",
        "acceptedAnswer": {
          "@type": "Answer",
          "text": "<p>Most unopened items in new condition and returned within <b>90 days</b> will receive a refund or exchange. Some items have a modified return policy noted on the receipt or packing slip. Items that are opened or damaged or do not have a receipt may be denied a refund or exchange. Items purchased online or in-store may be returned to any store.</p><p>Online purchases may be returned via a major parcel carrier. <a href=http://example.com/returns> Click here </a> to initiate a return.</p>"
        }
      }, {
        "@type": "Question",
        "name": "How long does it take to process a refund?",
        "acceptedAnswer": {
          "@type": "Answer",
          "text": "We will reimburse you for returned items in the same way you paid for them. For example, any amounts deducted from a gift card will be credited back to a gift card. For returns by mail, once we receive your return, we will process it within 4–5 business days. It may take up to 7 days after we process the return to reflect in your account, depending on your financial institution's processing time."
        }
      }, {
        "@type": "Question",
        "name": "What is the policy for late/non-delivery of items ordered online?",
        "acceptedAnswer": {
          "@type": "Answer",
          "text": "<p>Our local teams work diligently to make sure that your order arrives on time, within our normaldelivery hours of 9AM to 8PM in the recipient's time zone. During  busy holiday periods like Christmas, Valentine's and Mother's Day, we may extend our delivery hours before 9AM and after 8PM to ensure that all gifts are delivered on time. If for any reason your gift does not arrive on time, our dedicated Customer Service agents will do everything they can to help successfully resolve your issue.</p><p><a href=https://example.com/orders/>Click here</a> to complete the form with your order-related question(s).</p>"
        }
      }, {
        "@type": "Question",
        "name": "When will my credit card be charged?",
        "acceptedAnswer": {
          "@type": "Answer",
          "text": "We'll attempt to securely charge your credit card at the point of purchase online. If there's a problem, you'll be notified on the spot and prompted to use another card. Once we receive verification of sufficient funds, your payment will be completed and transferred securely to us. Your account will be charged in 24 to 48 hours."
        }
      }, {
        "@type": "Question",
        "name": "Will I be charged sales tax for online orders?",
        "acceptedAnswer": {
          "@type": "Answer",
          "text":"Local and State sales tax will be collected if your recipient's mailing address is in: <ul><li>Arizona</li><li>California</li><li>Colorado</li></ul>"}
        }]
    }
    </script>
  </head>
  <body>
  </body>
</html>

 

How to add schema markup to an online store

Schema markup can be added in various formats: JSON-LD, Microdata, or RDFa. However, Google recommends the JSON-LD format. Take that in mind when you want to optimize your site for Google specifically.

Once you have decided upon the format in which you want to make your schema markup, you should look into how you are going to implement this. There are two approaches:

  • Use extensions to add schema markup
  • or implement schema markup manually in the HTML code

 

Add schema markup with the help of extensions

If you want to implement schema with the help of extensions, you should consider using Schema Builder for Structured Data. This is an extension that helps you markup information for any webpage according to the JSON-LD format.

While these extensions may be useful in some cases, they can form a limitation. Most tools, including Schema Builder for Structured Data, do not include all schema formats. Therefore, I would suggest that eCommerce businesses that are serious about implementing schema do it manually in the HTML code of their eCommerce website.

 

Implement schema markup manually in the HTML code

Manual coding of the schema allows for the highest level of customization and will help you implement what is right for your specific business case.

Manual implementation is something that you can do yourself if you have coding knowledge and make use of the schema.org library.

Or, if you don’t have the skills to do this manually yourself, you can always opt to contact a specialized developer to implement this.

rich-results-test

Quick Expert Tip! Use the Rich Results Test to test your code before implementing it on your website. This can save you a lot of trouble.

 

Conclusion

Implementing schema markup can seriously upgrade the SEO game of many webshops. With the 5 implementations that are proposed in this article, you can already have a significant impact and start to outperform your competitors in the search engine search results.

If you want to know more tips and tricks on how to improve your SEO game, I recommend to you this article about performing an eCommerce SEO audit, which gives you 14 practical steps that you should follow to grow your eCommerce site organically.

Or you should read this article about the 5 best SEO tools for eCommerce sites in 2022, which will give you the 5 best free and paid tools to help you improve your rankings in Google.

 

If you have made it this far through the blog…

Chances are that you are seriously looking to improve your SEO game. That’s great we are here for it!

Phanum team

To get your webshop optimized for search engines, contact one of our eCommerce experts today.

Click this link to schedule an audit of your eCommerce site for free!