Rich Snippets guide for online shops
Rich Snippets guide for online shops
In the search engine results, it is all about catching the attention of users at all costs! With Rich Snippets, you have a chance to add targeted information of your online shop in Google search results. This article will show you the various content that you need to consider in this case.
SEO has become a constant fight for the attention of users. In addition to having strong meta titles and descriptions, the use of Rich Snippets is another fairly simple way to catch the eye of potential users.
Basics of Rich Snippets
From a search engine’s point of view, Rich Snippets help structure data in a specific scheme and provide targeted information about the content of the website. This requires the website operator to mark specific information on the website.
Basically, there are formats like Microdata, RDFa, and JSON-LD that can be used to integrate Rich Snippets in the source code. Google currently recommends the latest version of JSON-LD that supports all the important markups.
You can find a library of all existing markups under www.schema.org, which you can use for semantic markup of your web content.
Example:
<script type="application/ld+json">
{
"@context": "http://schema.org",
"@type": "Organization",
"url": "http://www.your-company-site.com",
"contactPoint": [{
"@type": "ContactPoint",
"telephone": "+1-401-555-1212",
"contactType": "customer service"
}]
}
</script>
Integration of the Sitelinks Search Box
If you want to integrate the Sitelinks Search Box for your brand, you need to inform Google of how your internal search works. You can use the JSON-LD format to implement the search box. Here, you only need to add the code on the homepage.
How to markup the search field:
<script type="application/ld+json">
{
"@context": "http://schema.org",
"@type": "WebSite",
"url": "https://leathertrousersexample.com/",
"potentialAction": {
"@type": "SearchAction",
"target": "https://leathertrousersexample.com/search?q={search_term_string}",
"query-input": "required name=search_term_string"
}
}
</script>
Product markup
For an online shop, product markup is probably the most interesting type of markup when it comes to Rich Snippets. As the following example shows, product reviews, price, and availability are displayed if the markup is implemented correctly:
<script type="application/ld+json">
{
"@context": "http://schema.org/",
"@type": "Product",
"name": "knickerbockers Oberbayern",
"image": "http://www.leathertrousersexample.de/knickerbockers-oberbayern.jpg",
"description": "This is the product description",
"mpn": "123456",
"brand": {
"@type": "Thing",
"name": "leathertrouserbrand"
},
"aggregateRating": {
"@type": "AggregateRating",
"ratingValue": "4.9",
"reviewCount": "14"
},
"offers": {
"@type": "Offer",
"priceCurrency": "EUR",
"price": "459.99",
"availability": "http://schema.org/InStock"
}
}
</script>
Breadcrumb markup
A breadcrumb is a type of navigation for website users and search engines. It provides users with a clear trace of the current click path and the website’s navigation structure at all times, thus making it easier for them to navigate back to higher levels.
Implementing a breadcrumb markup
<script type="application/ld+json">
{
"@context": "http://schema.org",
"@type": "BreadcrumbList",
"itemListElement": [{
"@type": "ListItem",
"position": 1,
"item": {
"@id": "https://www.leathertrousersexample.com/leathertrousers",
"name": "Leathertrousers"
}
},{
"@type": "ListItem",
"position": 2,
"item": {
"@id": "https://www.leathertrousersexample.com/leathertrousers/knickerbockers",
"name": "leather knickerbockers"
}
},{
"@type": "ListItem",
"position": 3,
"item": {
"@id": "https://www.leathertrousersexample.com/leathertrousers/knickerbockers/leatherknickerboxers-oberbayern-brown",
"name": "knickerboxers 'Oberbayern' in brown"
}
}]
}
</script>
Data feeds for Google’s Knowledge Graph
Google uses its Knowledge Graph to illustrate interesting facts within SERPs. For online shops, the Knowledge Graph has particularly been interesting for brand searches. You can feed the Knowledge Graph with targeted information about your brand.
Company logo markup:
<script type="application/ld+json">
{
"@context": "http://schema.org",
"@type": "Organization",
"url": "https://www.leathertrousersexample.com",
"logo": "https://www.leathertrousersexample.com/images/logo.png"
}
</script>
Provide contact information for your customer service
<script type="application/ld+json">
{
"@context": "http://schema.org",
"@type": "Organization",
"url": "http://www.leathertrousersexample.com",
"contactPoint": [{
"@type": "ContactPoint",
"telephone": "+49-123-456-78910",
"contactType": "customer service"
}]
}
</script>
Conclusion
The examples presented here show how you can optimally integrate markups for Google. These provide the search engine with more information about your web content and are rewarded with attractive Rich Snippets in search results.