Hello Folks, Today in this article we are going to explain How to Add Review Ratings By Schema Markup Recipes.In previous tutorial we have already talked about Adding Schema.org Review Rating Markup In Blogger template.Enabling rich snippets for recipes you can markup your article/content with Schema Structured data,You can Display Review Ratings By adding Schema Recipe markup.However there are some more features of schema recipe markup like, you can display reviewer ratings,cooking time, preparation time, Ingredients information , nutrition info.Google uses this information to show your content/article in a useful manner example: Displaying rich snippets for your recipe results , enabled your webpage for recipe specific search tools page.
But we have modified to add in blogger template however you can still use if you want to share cooking recipes markup.After adding Schema.org recipe markup in your blogspot website google will display the Image of the article infront of the article title and star ratings followed by the reviews counter added by you,by default we have added 35 value for the reviews you can modified it too n numbers.You can look below image for example.
You can see in the above image that shows 121 reviews by shekhar singh and also the star ratings.For star ratings display we have added Schema.org aggregate review rating.The Rating value is 5.0 and for the stars based on 121 review counts.In order to install Schema.org recipes markup in your blogger template you need to follow the below steps.
How to Install Schema.org Recipes Review Rating Markup In Blogger Template
Installation Steps:
Step 1. Log in to your Blogger account and Go to your Blogger Dashboard.
Step 2. Now Click on -> Template -> Edit HTML
Step 3. Now Search for the <data:post.body/> tag you will find 3 times we will stop at third one (in my template case) your may be different one, now copy the below code and paste it just above/below <data:post.body/> tag.
<div class='bsdrating' typeof='Recipe' vocab='http://schema.org/'>
<b:if cond='data:post.thumbnailUrl'>
<img expr:alt='data:post.title' expr:src='data:post.thumbnailUrl' property='image'/>
<b:else/>
<img expr:alt='data:post.title' itemprop='image' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQsZBn2daijnlPJk2ivWS5hIBniUSMI13bY6YK969r0-df3hxMEPmArcq4Is8bPyrTuEi-Hv8bSaVwIyR5NAXAY_zrjrw-EtVIDhj0NYsYKHFIuJs1Etb6JFlpwVw9btUri0qnel1tEMA/s1600-r/Bloggersstand%252Blogo%252B2016.png'/>
</b:if>
<span property='name'>
<data:post.title/>
</span>By:
<span property='author' typeof='Person'>
<span property='name'>
<data:post.author/>
</span>
</span>
<time expr:datetime='data:post.timestampISO8601' property='datePublished'>
<data:post.timestampISO8601/>
</time>
<span property='aggregateRating' typeof='http://schema.org/AggregateRating'>
<span property='ratingValue'>
5.0
</span>
stars based on
<span property='reviewCount'>
35
</span>
Reviews
</span>
<span property='description'>
<data:post.snippet/>
</span>
</div>
To verify you have added correct Schema.org recipe markup review ratings, visit https://developers.google.com/structured-data/testing-tool/ fetch your URL and check in your post pages there you can see review schema.org recipes markup review ratings in google structured data testing tool.