Recipe Pins
Recipe Pins let you add a title, serving size, cook time, ratings, and a list of ingredients to recipes from your site. We can also display if a recipe is paleo, vegetarian, vegan or gluten free.
Add recipe Pins to your site
1. Add Schema.org or hrecipe markups between the <head> </head> section of your HTML code for each page you want to enable recipe Rich Pins on
2. Use our Rich Pin validator to make sure we can see the Rich Pin data
3. If everything looks good, click Apply now - make sure to pick HTML tags when applying
Recipe ratings
You can add Ratings info to your Recipe Rich Pins. To do so, add the meta tag needed via Schema.org markup. If you need help implementing Ratings info to your site, feel free to visit Schema.org or take a look at this sample Pin to see how bettycrocker.com has set up their site. Please note that Ratings info can only be added using Schema.org markup (not h-recipe) and Ratings info will only show up on iOS and Android devices.
Schema.org and hrecipe markups
Here are the required Rich Pin fields for each type of markup. Edit the fields in black to reflect your recipes. Schema.org markups
<div itemscope itemtype="https://schema.org/Recipe">
<span itemprop="name">
Orange-Pineapple-Carrot Smoothie</span>
<span itemprop="description">
Description of your recipe.</span>
<span itemprop="aggregateRating">
Aggregate rating will show here</span>
<meta itemprop="url"
content="https://myrecipesite.com/pineapple.html" />
<span itemprop="recipeYield">Serves 1</span>
Ingredients:
<span itemprop="ingredients">ingredient 1</span>,
<span itemprop="ingredients">ingredient 2</span>,
<span itemprop="ingredients">ingredient 3</span>,
<span itemprop="ingredients">
add as many ingredient tags as you need</span>.
Instructions:
<span itemprop="recipeInstructions">
Put the pineapple, ice, orange juice, carrot and
banana in a blender. Blend until smooth.</span>
</div>
hrecipe tags
<article class="h-recipe">
<h1 class="p-name">Bagels</h1>
<ul>
<li class="p-ingredient">Flour</li>
<li class="p-ingredient">Sugar</li>
<li class="p-ingredient">Yeast</li>
</ul>
<p>Takes <time class="dt-duration" datetime="1H">1 hour</time>,
serves <data class="p-yield" value="4">four people</data>.</p>
<div class="e-instructions">
<ol>
<li>Start by mixing all the ingredients together.</li>
</ol>
</div>
</article>