recipeIngredient

recipeIngredient · Recommended

Appears in

Recipe

What is it?

recipeIngredient lists every ingredient needed to make a recipe, including quantities and preparation notes. Each ingredient is a separate entry in an array, giving search engines and AI systems a structured, parseable list of what the recipe requires.

Why this matters for AEO

Ingredient data powers some of the most common recipe queries. When a user asks "what ingredients do I need for banana bread" or "recipes using ripe bananas," AI answer engines parse recipeIngredient arrays to give direct answers and match recipes to ingredient-based searches. Structured ingredient lists are also the foundation for shopping list features, dietary filtering, and substitution suggestions in AI assistants.

What the specs say

Schema.org:ItemList, PropertyValue, or Text. An ingredient or ordered list of ingredients and potentially quantities used in the recipe. The ingredients can be represented as free text or more structured values. Source

Google: Recommended. "An ingredient used in the recipe." Source

Google recommends including only ingredient text in each array item, not non-ingredient information like "optional" or section headers.

How to find your value

• Recipe card — The ingredient list, usually above the instructions
• Cookbook — The ingredients section at the top of the recipe
• CMS — Individual ingredient fields or a rich text ingredient list

Each ingredient should combine quantity, unit, and ingredient name in one string: "2 cups all-purpose flour" rather than splitting them into separate fields.

Format and code

Type: Array of Text strings

Every ingredient gets its own array element. This is the format used by virtually all recipe sites:

{
  "@type": "Recipe",
  "name": "Banana Bread",
  "recipeIngredient": [
    "2 cups mashed very ripe banana (about 4 large)",
    "1/2 cup cane sugar or brown sugar",
    "1/2 cup melted butter or vegetable oil",
    "2 large eggs",
    "2 cups all-purpose flour",
    "1 teaspoon baking soda",
    "1/2 teaspoon salt"
  ]
}

Best practices:

• One ingredient per array item
• Include quantity and unit: "8 tablespoons (113g) unsalted butter" not just "butter"
• Keep preparation notes with the ingredient: "2 cups mashed very ripe banana"
• Do not include section headers like "For the glaze:" as array items
• Do not include non-ingredient items like "optional" as separate entries

Avoid this pattern:

{
  "recipeIngredient": "2 cups flour, 1 cup sugar, 2 eggs"
}

A single comma-separated string loses the structure that makes ingredient data useful to search engines and AI systems.

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",
  "recipeIngredient": [
    "2 cups mashed ripe banana",
    "1/2 cup sugar",
    "1/2 cup melted butter",
    "2 large eggs",
    "2 cups all-purpose flour"
  ]
}
</script>

CMS template pages

Webflow CMS does not natively support arrays of text. Two approaches:

1. Rich text field: Store ingredients as a bulleted list in a rich text field, then manually build the JSON array in your custom code embed.

2. Plain text field: Store ingredients separated by newlines in a plain text field, then use JavaScript to split them into an array:

<script>
  var ingredients = "{{wf {"path":"ingredients","type":"PlainText"} }}";
  var arr = ingredients.split("\n").filter(function(i) { return i.trim(); });
  // Insert into your JSON-LD object
</script>

In Schema HQ

The recipeIngredient field automatically parses your Webflow CMS ingredient fields and builds the array structure. It handles rich text lists, plain text with line breaks, and CMS multi-reference fields, outputting a clean array of ingredient strings.

Real examples

King Arthur Baking (source):

{
  "recipeIngredient": [
    "8 tablespoons (113g) unsalted butter, at cool room temperature",
    "2/3 cup (142g) light brown sugar or dark brown sugar, packed",
    "1 teaspoon King Arthur Pure Vanilla Extract",
    "1 teaspoon ground cinnamon"
  ]
}

Love and Lemons (source):

{
  "recipeIngredient": [
    "2 cups mashed very ripe banana (about 4 large)",
    "\u00bd cup cane sugar or brown sugar",
    "\u00bd cup melted butter or vegetable oil",
    "2 large eggs"
  ]
}

Note how King Arthur includes gram measurements in parentheses alongside volume measurements. This is valid and provides extra precision.

Related fields

• recipeInstructions details how to use these ingredients
• recipeYield states the serving count these ingredients produce
• nutrition provides nutritional data for the resulting dish
• recipeCategory classifies the meal type
• recipeCuisine identifies the regional origin

FAQ

Should each ingredient be a separate array item?

Yes. Always use one ingredient per array element. A single comma-separated string loses the structured data benefits. Search engines and AI systems parse individual array items to identify, count, and categorize ingredients.

How should I handle ingredient sections like "For the frosting"?

Do not include section headers as array items. Google recommends only ingredient text in the array. If your recipe has distinct sections, list all ingredients in a single flat array. The grouping belongs in recipeInstructions using HowToSection.

Should I include "optional" ingredients?

Include them in the array with "(optional)" noted in the text: "1/2 cup chocolate chips (optional)". Do not create a separate "optional" entry.