On this page:
This is some text inside of a div block.
This is some text inside of a div block.
This is some text inside of a div block.

nutrition

nutrition · Recommended

Appears in

Recipe

What is it?

nutrition provides the nutritional breakdown for a recipe. It uses the NutritionInformation type to report values like calories, fat, protein, carbohydrates, and other nutrient amounts per serving. This data helps users make informed dietary choices before deciding to cook a recipe.

Why this matters for AEO

When a user asks "how many calories are in banana bread" or "high protein recipes under 500 calories," AI answer engines extract nutrition data to give direct numerical answers and filter recipes by dietary criteria. Google also displays calorie counts in recipe rich results, making this one of the most visible schema fields for recipe content.

What the specs say

Schema.org:NutritionInformation. Nutrition information about the recipe or menu item. Source

Google: Recommended. "The number of calories in each serving produced with this recipe." Source

Google specifically highlights calories as the key nutrition field for rich results, though the full NutritionInformation type supports many more properties.

How to find your value

  • Caloriescalories
  • FatfatContent
  • Saturated fatsaturatedFatContent
  • CarbohydratescarbohydrateContent
  • SugarsugarContent
  • FiberfiberContent
  • ProteinproteinContent
  • SodiumsodiumContent
  • CholesterolcholesterolContent

Use a recipe nutrition calculator or registered dietitian analysis. Do not estimate values. Nutrition data should reflect one serving as defined by recipeYield.

Format and code

Type: NutritionInformation object

The nutrition property takes a NutritionInformation object. Include the @type and as many nutrient properties as you have data for:

{
  "@type": "Recipe",
  "name": "Banana Bread",
  "recipeYield": "18 servings",
  "nutrition": {
    "@type": "NutritionInformation",
    "calories": "170 calories",
    "fatContent": "6g",
    "saturatedFatContent": "3.5g",
    "carbohydrateContent": "27g",
    "sugarContent": "14g",
    "fiberContent": "1g",
    "proteinContent": "3g",
    "sodiumContent": "230mg",
    "cholesterolContent": "35mg"
  }
}

Property values include the unit (g, mg, calories). Google expects calories to include the word "calories" (e.g., "170 calories" not just "170").

Available NutritionInformation properties:

  • calories"170 calories"
  • fatContent"6g"
  • saturatedFatContent"3.5g"
  • transFatContent"0g"
  • unsaturatedFatContent"2.5g"
  • carbohydrateContent"27g"
  • sugarContent"14g"
  • fiberContent"1g"
  • proteinContent"3g"
  • sodiumContent"230mg"
  • cholesterolContent"35mg"
  • servingSize"1 slice"

You do not need to include every property. Include whatever data you have verified. At minimum, include calories since that is what Google highlights in rich results.

Webflow implementation

Static pages

Add to Page Settings > Custom Code (Before ):

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Recipe",
  "name": "Banana Bread",
  "nutrition": {
    "@type": "NutritionInformation",
    "calories": "170 calories",
    "fatContent": "6g",
    "carbohydrateContent": "27g",
    "proteinContent": "3g"
  }
}
</script>

CMS template pages

Create separate plain text CMS fields for each nutrient (Calories, Fat, Protein, etc.) and reference them in your embed:

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Recipe",
  "name": "{{wf {"path":"name","type":"PlainText"} }}",
  "nutrition": {
    "@type": "NutritionInformation",
    "calories": "{{wf {"path":"calories","type":"PlainText"} }} calories",
    "fatContent": "{{wf {"path":"fat","type":"PlainText"} }}g",
    "proteinContent": "{{wf {"path":"protein","type":"PlainText"} }}g",
    "carbohydrateContent": "{{wf {"path":"carbs","type":"PlainText"} }}g"
  }
}
</script>

In Schema HQ

The nutrition field reads from Webflow CMS nutrition fields and builds the NutritionInformation object automatically. It formats values with the correct units and handles the @type declaration. Only include CMS fields you have data for; Schema HQ omits empty properties rather than outputting blank values.

Real examples

King Arthur Baking (source):

{
  "nutrition": {
    "@type": "NutritionInformation",
    "calories": "170",
    "carbohydrateContent": "27g",
    "fatContent": "6g",
    "proteinContent": "3g",
    "sugarContent": "14g",
    "sodiumContent": "230mg"
  }
}

Note: Many recipe sites (Sally's Baking Addiction, Love and Lemons) display nutrition information on the page but omit it from their JSON-LD markup. Including nutrition in your schema gives you a competitive advantage in rich results and AI answer eligibility.

Related fields

FAQ

Is the calories field required for nutrition to work?

Google specifically highlights calories as the key nutrition property for recipe rich results. While the NutritionInformation type accepts any combination of properties, calories is the one Google displays. Include it whenever possible.

Should nutrition values be per serving or per recipe?

Per serving. Nutrition data should reflect one serving as defined by your recipeYield. If your recipe yields 8 servings, each value in nutrition represents the amount in one of those 8 servings.

Do I need to include all nutrition properties?

No. Include whatever verified data you have. A nutrition object with only calories is valid and useful. Adding more properties (fat, protein, carbs) increases the data available to AI engines for dietary filtering queries.

On this page:
This is some text inside of a div block.
This is some text inside of a div block.
This is some text inside of a div block.

Need help with schema on your site?

We implement structured data for Webflow sites — from audit to deployment.

Work with us

Work with us