How to Add Google Rich Snippets in Blogger
Hi, Guys Welcome back to another tutorial on Blogger. In this tutorial, I will show you how to add google rich snippets in blogger. There are thousands of plugins in Wordpress but blogger lacks the support for most of the plugin.There are some websites that provide the rating widget but in this tutorial, I will show you how to insert a Schema rating widget without any third party code or website, just by using official Schema rating script.
There are some other structured data elements that are not discussed here if you want an article on all structured data in blogger comment below or contact us.
Note: This tutorial cover all the aspects of schema rating widget but it depends on Google to accept the structured data or not.
Table of Contents
What are rich snippets?
The snippet is simply what Google shows to a user when someone searches in google. For example when we search for a question or a product we could see search result showing different snippets. The default snippet would be similar to this below.Google shows the title in blue colour and URL in green colour. Google Introduced rich snippets to enhance the browsing experience by providing extra information about the content to easily understand what the website has. A Google rich snippet result would look like this below.
Importance of Structured data in SEO
Structured data has become very strict nowadays, websites with structured data are most favoured in the google search results, therefore, we have to focus on optimising our website with all necessary structured data.Most of the Blogger theme has some structured data present in it but among theme, some doesn't contain any relevant Structured data and show many errors in Google console. To avoid this Pre-test your theme and make sure that it doesn't contain any errors in structured data and Just copy the demo page URL of your theme and paste the URL in the below tool
After that check how many structured data elements are present in it and after that choose the theme with most structured data elements.
How to add Structured data to Blogger
Now let us learn how to add structured data to blogger with simple code.I have worked with Google star rating code for the blogger to advance the blogging experience in blogger and I will show you the proof. There are some codes which show errors in Google structured data testing tool. So I planned to build a clean code with official schema aggregate snippet code from here. You can too check out other rating elements like product price, amount etc from the official link
Google aggregate rating Code for Blogger
Five-star widget code for a blogger is optimised to provide only the relevant information and to optimise code for blogger and not to overload the current theme. In my experience before choosing blogger template don't go for design thinks about the SEO elements like structured data in the theme.How to Add a Star Rating widget to Blogger
# Method 1
Optimised Standalone Code for Blogger without any third party widget.Note: Keep a backup of your theme and proceed to protect your data.
<div class='post-rating' itemscope='' itemtype='http://schema.org/Review'><span itemprop='itemReviewed' itemscope='' itemtype='http://schema.org/Thing'><a expr:href='data:post.url' itemprop='url' target='_blank'/></span><span itemprop='author' itemscope='' itemtype='http://schema.org/Person'><strong>Author :</strong> <span itemprop='name'><data:post.author/></span></span><span itemprop='reviewRating' itemscope='' itemtype='http://schema.org/Rating'><strong>Rating:</strong> <span itemprop='ratingValue'>5</span> out of <span itemprop='bestRating'>5</span></span><span itemprop='publisher' itemscope='' itemtype='http://schema.org/Organization'></span></div>Find <div class='post-footer'> in your theme and you will find it twice in your theme. Paste the below code below the second one
And Recheck your Post URL in Google Structured data testing tool and check whether it's showing any error.
For that Goto, Google Tester and paste the post URL and Click Run Test and see whether it is having an error or not
Modifying the rating code
You can change the Author to Review by or Product by replacing Author : in the below code<span itemprop='author' itemscope='' itemtype='http://schema.org/Person'><strong>Author :</strong> <span itemprop='name'><data:post.author/></span></span># Method 2 (Recommended)
This method is recommended for the best experience and those facing problems using the first method. Google recommends using JSON-LD for structured data whenever possible. You can check out more details about all the schema formats supported by Google here.
- Find <div class='post-footer'> in your theme and you will find it twice in your theme. Paste the below code below the second one.
- Change the Author name, Google plus profile and time (Publishing time which would be the same for every post)
- That's all
<!-- Review Star Rating In Google Search Results -->
<script type='application/ld+json'>
{
"@context":"https://schema.org",
"@type":"Review",
"author": {
"@type":"Person",
"name":"Muhammed Fasil K",
"sameAs":"https://www.blogger.com/profile/12071624565375682546"
},
"url": "<data:blog.canonicalUrl/>",
"datePublished":"<data:post.dateHeader/>",
"publisher": {
"@type":"Organization",
"name":"<data:blog.title/>",
"sameAs":"<data:blog.homepageUrl/>"
},
"description":"<data:blog.metaDescription/>",
"inLanguage":"en",
"itemReviewed": {
"@type":"Product",
"name": "<data:blog.pageName/>",
"sameAs": "<data:blog.canonicalUrl/>",
"image": "<data:blog.postImageThumbnailUrl/>",
"aggregateRating": {
"@type": "AggregateRating",
"ratingValue": "4.5",
"bestRating": "5",
"ratingCount": "11"
}
}
}
</script>
<!-- Review Star Rating In Google Search Results -->Debugging the Errors
This is the shortest code that you can see for the rating element in blogger but if you encountered in any errors in structured data testing tool please comment below with your errors. I successfully tested this feature in flex mag and its working great.This code doesn't guarantee that your search result would show ratings, it is up to Google whether to show or not, but this code works like a charm. Google checks on various criteria before showing your rating tag like website authority etc to enhance the credibility of what it offers to people.
Type site:www.pcweek.in and see whether my article on Google is showing rating or not
Conclusion
I Hope that you liked this post on How to Add Google Rich Snippets in Blogger. You can freely comment your doubts and queries below.If you liked this article, then please share this with your friends. You can also find us on Twitter, Facebook, YouTube, and Instagram.
DISQUS
Disqus Comments
FACEBOOK
Disclaimer : Muhammed Fasil K is a participant in the Amazon Services LLC Associates Program, an affiliate program to earn commission by advertising and linking sites to Amazon products.