Composition Blocks: Ingredients, Materials, and Constituents
Build a composition block that structures ingredients, materials, quantities, and regulated product facts for buyers, search engines, and AI agents clearly.
A composition block is a structured declaration of what a product consists of. It keeps ingredient names, material types, component quantities, percentages, functions, and required qualifiers together so a buyer does not have to reconstruct the product from packaging photographs or marketing prose.
Material composition
Product: Harbor work jacket, shell fabric, style HJ-204
- Recycled polyester
- 65% by fiber weight
- Organic cotton
- 35% by fiber weight
- Coating
- Polyurethane; excluded from fiber percentages
Declaration basis: shell fabric only. Lining: 100% polyester. Source: approved product record HJ-204-US, revision 6.
The element separates the product and scope from each constituent and value. “65% recycled polyester” is meaningful only when the reader knows whether it describes the shell, lining, filling, whole garment, or packaging.
Why this element matters
Composition affects decisions that product slogans cannot answer. A shopper may avoid an allergen, compare wool content, check a coating, choose a recyclable mono-material package, or confirm an active component’s concentration. They may be deciding whether the product is safe, suitable, maintainable, policy-compliant, or worth its price.
Structure reduces that decision cost. “Made with cotton, recycled polyester, and a protective coating” leaves readers to discover which part each material belongs to and whether the list is complete. Labelled rows make names, values, and omissions easy to scan.
Search engines, comparison systems, shopping agents, accessibility tools, and product feeds also need to retain the relationship between a constituent, quantity, unit, product part, and variant. Commas cannot reliably show whether “cotton 35%, polyester lining, polyurethane coated” means three percentages, two fabrics and a finish, or incomplete copy.
Regulated declarations make ambiguity more serious. Controlled product classes can have market-specific naming, ordering, emphasis, quantity, and language requirements. Because obligations differ by product and jurisdiction, preserve the approved declaration, market, revision, and source; never ask a writer or renderer to infer compliance. Structure does not make content compliant, but it makes required fields testable.
When to use it
Use a composition block whenever constituent identity or amount influences selection, safe use, compliance, comparison, care, recycling, or procurement. Applications include:
- food and beverage ingredient declarations, with separately governed allergen emphasis where required;
- cosmetic ingredient names in the approved order and nomenclature;
- textile fiber composition split by shell, lining, filling, trim, or other relevant part;
- furniture and construction materials separated by structural layer or component;
- chemical mixtures and active components with concentrations and a declared basis;
- supplements or formulated products whose ingredient identity and amount must remain distinct;
- packaging composition used for disposal, recycling, or environmental claims;
- technical assemblies where “composition” means a bounded bill of constituent materials rather than a full parts catalog.
Use one block for one approved scope. A mattress may have named cover, comfort-layer, and core groups; different flavors need separate records. Every row must remain true for the product, variant, market, and revision named at the top.
Near misses need different structures. Dimensions, voltage, compatibility, and performance are specifications. Nutrition describes nutrients and a serving basis, not necessarily ingredients. Care instructions describe behavior after purchase. Separate allergen statements need their own approved treatment. “Planet friendly” is neither a constituent nor evidence. A manufacturing bill of materials may be too detailed or confidential for customers.
The element writing rules take precedence: select the typed element by the passage’s purpose. If the block’s job is to identify what the subject consists of, use composition even when a generic table, accordion, or paragraph could imitate its appearance.
Where to place it
Place the primary block after product identity and purchase facts but before claims, instructions, or guidance that depends on composition. It normally precedes care, safety, sustainability, and detailed specifications. Regulatory placement requirements override editorial preference.
A compact purchase-region summary must include decision-critical facts and expose the complete declaration without changing context. Keep the full content in the page source and reachable without JavaScript.
Keep the block beside its scope label. It may sit next to an image or specification table with clear headings. It may not sit beside another variant’s claim, an unqualified environmental badge, or contradictory marketing. Never insert a testimonial, offer, cross-sell, or CTA between the declaration heading and rows.
For multipacks, kits, and configurable products, put each independently formulated item in a labelled subgroup. Never average compositions across the bundle. On mobile, preserve the order: subject and scope, basis, constituents, qualifiers, source or revision. Visual columns may collapse, but relationships may not.
Anatomy
- Title: names the declaration plainly, such as “Ingredients,” “Material composition,” or “Active components.”
- Subject identity: binds the content to an exact product, SKU, variant, formulation, or component.
- Scope: states the market, product part, preparation state, pack component, or other boundary that determines what the rows describe.
- Declaration basis: explains what quantities mean, such as percentage by fiber weight, milligrams per tablet, or grams per 100 grams as sold.
- Constituent name: preserves the approved common, technical, standardized, or regulated name.
- Amount: supplies a number, range, threshold, or intentionally absent state without guessing.
- Unit or proportion: stays attached to its amount and uses one defined convention within a group.
- Role or qualifier: identifies functions, sub-ingredients, coatings, carriers, processing aids, or exclusions only when approved and relevant.
- Required emphasis: exposes an allergen, active component, or mandated phrase through text and semantic markup, not color alone.
- Provenance: records the approved source, market, revision, and review date used to render the declaration.
Design examples
Every design variant uses the same underlying constituent records. The variant changes labels and grouping because the product class asks a different question; it never turns a verified declaration into free-form promotional copy.
Ordered ingredients. Use when sequence is meaningful or regulated. Preserve source order, punctuation, nested ingredients, and required emphasis. Do not alphabetize for visual neatness or merge two approved names into a friendlier label.
Material percentages by component. Use for textiles, furniture, packaging, or layered goods. Group by physical part, state what the percentages total within, and distinguish a surface treatment from the underlying fiber or material.
Active components and concentrations. Use when an active substance or functional constituent must be quantified. Keep the amount, unit, basis, and product state together. Safety warnings and directions remain separate governed elements even when they derive from the same source.
Layered technical composition. Use for assemblies such as flooring, insulation, filters, or mattresses. Represent the physical hierarchy explicitly. Thickness may appear as a constituent qualifier, but unrelated performance specifications belong in their own table.
Compact comparison. Use only when two or more products have genuinely comparable constituent categories. Show “Not declared” or “Not applicable” rather than an empty cell. Keep the complete authoritative block on each product record; the comparison is a derived view, not a new source.
Parameters
“Source” identifies where the renderer obtains each field. The approved product or regulatory record remains authoritative; the body may add controlled explanatory context but may not override source-bound facts.
| Name | Type | Required | Min/max | Default | Source |
|---|---|---|---|---|---|
| title | Plain string | No | 1–5 words | Composition | First heading in body |
| subject | Product or component identifier | Yes | 1 value; 1–80 characters | Owning page product | Attribute |
| variant | SKU or formulation identifier | Conditional | 1 exact value; 1–64 characters | Owning product | Attribute |
| market | Controlled market or jurisdiction code | Yes for regulated content | 1–8 codes | Site market | Attribute |
| scope | Plain string or controlled component ID | Yes | 1–8 groups; 1–50 characters each | whole-product | Attribute |
| basis | Controlled string | Required when amounts appear | 1 per group; 2–12 words | None | Attribute |
| ordered | Boolean | No | true or false | false | Attribute |
| items | Constituent records | Yes | 1–100 rows | None | Body |
| item.name | Approved plain or standardized name | Yes | 1–120 characters | None | Body |
| item.amount | Decimal, range, threshold, or null | Conditional | 0 or greater; 1 value | Not declared | Body |
| item.unit | Controlled unit or percent | Required with amount | 1 unit | Inherited from basis | Body |
| item.role | Controlled or approved plain string | No | 1–6 words | Absent | Body |
| item.flag | Enum list | No | 0–4 values | None | Body |
| revision | Plain identifier | Yes for regulated content | 1 value; 1–40 characters | None | Attribute |
| reviewed | ISO 8601 date | Yes for regulated content | 1 date | None | Attribute |
| source | Approved system or document ID | Yes | 1–3 values | None | Attribute |
| note | Plain text | No | 0–40 words | Absent | Body |
The allowed item.flag values are implementation-controlled, for example allergen, active, restricted, or regulated-name. A flag triggers approved presentation and validation; authors cannot use arbitrary flags to create warnings or marketing badges.
Syntax and code examples
All three forms encode the same jacket shell record. The portable directive is the canonical authored representation; a project must implement and test the Hugo and WordPress adapters before publishing it.
Portable Markdown directive
:::composition{subject="Harbor work jacket" variant="HJ-204" market="US" scope="shell" basis="percent by fiber weight" source="pim:H-J204-US" revision="6" reviewed="2026-08-20"}
## Material composition
- name: Recycled polyester
amount: 65
unit: "%"
- name: Organic cotton
amount: 35
unit: "%"
Note: Polyurethane coating is excluded from fiber percentages. Lining is declared separately.
:::
Hugo shortcode
{{< composition subject="Harbor work jacket" variant="HJ-204" market="US" scope="shell" basis="percent by fiber weight" source="pim:H-J204-US" revision="6" reviewed="2026-08-20" >}}
## Material composition
- name: Recycled polyester
amount: 65
unit: "%"
- name: Organic cotton
amount: 35
unit: "%"
Note: Polyurethane coating is excluded from fiber percentages. Lining is declared separately.
{{< /composition >}}
Every Hugo parameter is named. The example does not mix positional and named parameters.
WordPress
[composition subject="Harbor work jacket" variant="HJ-204" market="US" scope="shell" basis="percent by fiber weight" source="pim:H-J204-US" revision="6" reviewed="2026-08-20"]
<h2>Material composition</h2>
<ul>
<li data-name="Recycled polyester" data-amount="65" data-unit="percent">Recycled polyester: 65%</li>
<li data-name="Organic cotton" data-amount="35" data-unit="percent">Organic cotton: 35%</li>
</ul>
<p>Polyurethane coating is excluded from fiber percentages. Lining is declared separately.</p>
[/composition]
A native WordPress block should store constituents as repeatable typed records, not as one rich-text field. Lock source-bound names and values when they come from a product information management system, while allowing an authorized reviewer to approve market-specific presentation.
Good and bad examples
Good
Material composition — Harbor work jacket HJ-204, shell: 65% recycled polyester; 35% organic cotton. Percentages are by fiber weight of the shell fabric. Polyurethane coating is excluded from fiber percentages. Lining: 100% polyester. Approved source HJ-204-US, revision 6.
This works because it names the exact product and parts, supplies a basis for each percentage group, distinguishes the coating from fibers, and exposes the approved revision. The values total within their declared scope rather than pretending to describe the whole jacket.
Bad
Premium eco blend: Mostly natural cotton with recycled performance fibers and a planet-friendly protective finish.
This fails because “mostly” is not an amount, “blend” hides the relationship between materials, and “finish” has no chemical or component identity. It omits the shell-versus-lining scope, makes an unsupported environmental claim, and gives no source or revision. A buyer cannot compare it, and a machine cannot extract defensible constituents.
Schema markup and accessibility
No universal composition schema covers every regulated product class. For a genuine Product, a simple material may map to Schema.org’s material. Named facts can sometimes map through additionalProperty and PropertyValue, keeping name, value, and unitText or unitCode together. Stable identifiers must bind them to the visible variant.
Do not force declarations into unrelated properties. Recipe.recipeIngredient describes a recipe, not a packaged product label. Never emit a percentage from list order or turn an environmental or allergen inference into fact. Generate sector feeds from the approved record, not rendered HTML.
Structured data supplements, never replaces, the visible declaration. Machines must not receive a richer or differently scoped version. If schema cannot express a basis or qualifier, omit the property and preserve the visible fact.
Use a real heading and one semantic container per declaration. Ordered ingredients use lists; name-value records use description lists or tables with headers. Nested compounds need nested list structure. Screen-reader order must match approved order.
Never rely on bold, uppercase, color, icons, or tooltips alone for allergens or regulated status. Include required text in accessible content. Expanders need a button, accurate state, keyboard operation, and server-rendered fallback. Visible and accessible units must agree.
Writing rules
The block preserves exact product truth, so brevity cannot justify dropping scope, basis, qualifiers, or required names. Apply these rules after confirming the source and market policy:
- Title the block in one to five words. Prefer the vocabulary buyers and regulators expect: “Ingredients,” “Material composition,” or “Active components.”
- Include one to 100 rows. Above that, use governed grouping or an approved document; never silently truncate.
- Keep names to 120 characters where possible, but preserve longer regulated names intact.
- Preserve required order. Otherwise retain the approved product-record sequence across channels.
- Attach amounts to units and a basis. Never force incomparable layers into a false 100% total.
- Use numerals for quantities and controlled unit symbols. Localize decimal and unit presentation without changing the stored value.
- Distinguish “Not declared,” “Not applicable,” “Amount not provided,” and zero; a blank is ambiguous.
- Keep notes to 40 words after the affected group. They clarify scope but cannot override rows.
- Use factual, neutral language. Keep explanations separate from legal or standardized names.
- Review the exact product class, market, language, variant, and revision. Revalidate every relevant change.
Never put price, stock, delivery, testimonials, promotional claims, disposal instructions, dosage directions, safety warnings, full nutrition facts, or unrelated specifications inside the composition block. Those facts may sit nearby in their own governed elements. Never infer “free from,” hypoallergenic, vegan, recyclable, natural, organic, nontoxic, or environmentally preferable from a constituent list alone. Never use a packaging photograph as the only declaration, because its text may be unreadable, stale, market-specific, and unavailable to assistive technologies.
Post types that use it
The postTypes frontmatter field is the implementation source for this matrix.
| Post type | Role | Placement | Required adaptation |
|---|---|---|---|
| Product page | Authoritative customer declaration | After identity and purchase facts, before dependent claims or instructions | Bind to exact SKU, market, scope, and approved revision |
| Category page | Filtering or compact comparison fact | In filters or product summaries only when values are normalized | Keep the complete declaration on the product record and expose missing states |
| Buying guide | Decision criterion | After explaining why a material or ingredient matters | Quote current sourced facts without implying safety or quality from composition alone |
| Comparison page | Like-for-like constituent comparison | Within a shared-criteria section | Align scope and basis; never compare whole-product values with one component |
| Review page | Verified product fact supporting analysis | Near the relevant finding or product-facts section | Separate manufacturer declaration from observations made during testing |
| Standard or regulation page | Example of an affected declaration | After scope and obligation are defined | Label jurisdiction, effective version, exceptions, and authoritative source |
| Agentic product data | Machine-actionable constituent record | Within the exact product or variant entity | Expose typed names, values, units, basis, scope, provenance, and revision |
QA checklist
- The block identifies the exact product, SKU or formulation, market, and physical scope it describes.
- The declaration comes from an approved source, and its source ID, revision, and review date are retained.
- Every constituent name matches the approved common, technical, standardized, or regulated name.
- Ordered declarations preserve source order; no renderer alphabetizes, merges, or reorders the rows.
- Every numeric value has a unit and a visible basis, and ranges or thresholds retain their operators.
- Percentages total only within a valid shared scope; excluded layers, coatings, and components are identified.
- Missing, zero, not applicable, and not declared are represented as distinct states.
- Compound ingredients or layered materials use explicit nested groups rather than ambiguous punctuation.
- Required allergen, active-component, or regulated emphasis remains available in text and to assistive technology.
- The visible block, product feed, packaging source, schema output, and variant selection do not contradict one another.
- No composition row contains price, availability, promotion, testimonial, unsupported benefit, or inferred environmental or safety claims.
- The complete declaration works without images, hover, color, JavaScript, or an expanded desktop layout.
- Changes to formulation, supplier, component, packaging, jurisdiction, or revision trigger revalidation.
- The three syntax examples preserve the same subject, scope, basis, rows, source, and revision.
FAQ
Is a composition block the same as a specification table?
No. A composition block identifies what a product consists of and, where relevant, the amount or proportion of each constituent. A specification table describes measurable characteristics such as dimensions, capacity, voltage, or compatibility. Keep the two structures separate even when they appear near each other.
Must every ingredient include a percentage?
No. Include a percentage when the governing rule, approved source, or buyer decision requires it. Never infer a percentage from list order. Preserve the approved ingredient order and show an exact amount only when the source provides a valid basis and unit.
Can marketing rewrite regulated ingredient or material names?
No. Display names may be supplemented with a plain-language explanation when policy allows, but the required legal or standardized name must remain intact. Marketing copy cannot replace, abbreviate, reorder, or soften a regulated declaration.
Does a composition block automatically produce schema markup?
No. Some fields can map to Product.material or additionalProperty values, but there is no universal Schema.org composition object for every product class. Emit only supported properties that accurately describe the visible product, and never use structured data as a substitute for the on-page declaration.
How should composition differ between product variants or markets?
Bind the block to the exact SKU and market. If color, size, flavor, formula, supplier, or destination changes the declaration, render the matching approved record and identify its scope. Do not combine several variants into a single list unless every constituent and amount is genuinely identical.
More tutorials in this section
Ready to put it into practice?
Free check · 7-day trial · no credit card