Rich snippets - Recipes

New!schema.org lets you mark up a much wider range of item types on your pages, using a vocabulary that Google, Microsoft, and Yahoo! can all understand. Find out more. (Google still supports your existing rich snippets markup, though.)

When recipe information is marked up in web pages, Google may use that information to show rich snippets for recipe results, and for inclusion in Google with Recipe View. (Recipe View is currently available only in the US and Japan, but we're working to bring it everywhere.)

Usage guidelines

The goal of a recipe rich snippet is to provide users with additional information about a specific cooking recipe, such as the reviewer(s) star ratings (1 to 5 stars), cook/prep time, and calorie information.

The following guidelines apply to recipe snippets:

When using recipe markup, the main topic of the page needs to be about a specific recipe. Using recipe markup on a page containing multiple recipes is not supported.

If the recipe markup contains a single review, the reviewer’s name needs to be a valid name (Person or Organization). For example, "50% off ingredients" is not a valid name for a reviewer.

Properties

Google recognizes the following microdata, RDFa, and microformats (hRecipe) properties. Where the microformats name differs from the microdata/RDFa name, the hRecipe name appears in parentheses. Properties in bold are required. In addition, rich snippets are currently only shown for recipes that provide at least two of the following:

The length of time it takes to prepare the recipe for dish, in ISO 8601 duration format. Can use min, max as child elements to specify a range of time.

cookTime

The time it takes to actually cook the dish, in ISO 8601 duration format. Can use min, max as child elements to specify a range of time.

totalTime (duration)

The total time it takes to prepare the cook the dish, in ISO 8601 duration format. Can use min, max as child elements to specify a range of time.

nutrition

Nutrition information about the recipe. Can contain the following child elements: servingSize, calories, fat, saturatedFat, unsaturatedFat, carbohydrates, sugar, fiber, protein, cholesterol. These elements are not explicitly part of the hRecipe microformat, but Google will recognize them.

instructions

The steps to make the dish. Can contain the child element instruction, which can be used to annotate each step.

yield

The quantity produced by the recipe (for example, number of people served, number of servings, etc).

ingredient

An ingredient used in the recipe. Can contain child items name (name of the ingredient) and amount. Use this to identify individual ingredients.

On the first line, indicates that the HTML enclosed in the <div> represents a Recipe. itemscope indicates that the content of the <div> describes an item, and itemtype="http://www.data-vocabulary.org/Recipe" indicates that the item is a Recipe.

The sample describes properties of the recipe, such as its author, ingredients, and preparation time. To label recipe properties, each element containing one of these properties (such as <div> or <span> is assigned an itemprop attribute indicating a property. For example, <span itemprop="author">.

A property can consist of another item (in other words, an item can include other items). For example, the recipe above includes an Review-aggregate item (itemtype="http://www.data-vocabulary.org/Review-aggregate") with the properties rating and count, and a Recipe-ingredient item (ingredient), which in turn has the properties amount and name.

Except in special circumstances, Google won't display content that is not visible to the user. However, in some situations it can be valuable to provide search engines with more detailed information, even if you don't want that information to be visible to the people who visit your page. This example uses the datetime attribute to indicate that the rich snippets parser should use the attribute value to find the prep time, cook time, and total time needed to make the dish, but still displays the durations on the page in a human-readable way. For example: <time datetime="PT1H" itemprop="cookTime">1 hour</time>.

Here is the same HTML code marked up with microformats. (Note: Some of the properties shown above, while recognized by Google, are not part of the official hRecipe draft specification published on microformats.org.)

In the first line, class="hrecipe" indicates that the HTML enclosed in the divrepresents a Recipe—in this case, apple pie.

The structured information is conveyed by the class attribute (such as class="fn" and class="author"), and the values (such as "white sugar", "1 hr 30 min"). You can change the tags such as span and div to suit your formatting needs.

Except in special circumstances, Google won't display content that is not visible to the user. However, in some situations it can be valuable to provide search engines with more detailed information, even if you don't want that information to be visible to the people who visit your page. The HTML above contains an example of the microformats value class pattern, used to indicate the total cook time to search engines in ISO 8601 duration format, while at the same time displaying this information in human-friendly style ("1 hour 30 min") on the page itself. It uses the title attribute to indicate that the rich snippets parser should use the attribute value to find the total time needed to make the dish, but still displays the durations on the page in a human-readable way. For example: <span class="value-title" title="PT1H30M">.

The example begins with a namespace declaration using xmlns. This indicates the namespace where the vocabulary (a list of entities and their components) is specified. You can use the xmlns:v="http://rdf.data-vocabulary.org/# namespace" declaration any time you are marking up pages for people, review, recipe, event, or place data. Be sure to use a trailing slash and # (xmlns:v="http://rdf.data-vocabulary.org/#").

Also on the first line, typeof="v:Recipe" indicates that the marked-up content describes a Recipe.

Each property of the recipe (such as the name, summary, and fat content) is labeled using property. The property name is prefixed with v: (<span property="v:fat">).

Except in special circumstances, Google won't display content that is not visible to the user. However, in some situations it can be valuable to provide search engines with more detailed information, even if you don't want that information to be visible to the people who visit your page. This example uses the content attribute to indicate that the rich snippets parser should use the attribute value to find the prep time, cook time, and total time needed to make the dish, but still displays the durations on the page in a human-readable way. For example: <span content="PT30M" property="v:prepTime">30 min</span>.