Skip to content

Ingredient List

A structured, supplement-facts style ledger of what's actually in a product: name, amount, form, where it came from, allergen flags, and a link to the certificate of analysis.

Most themes give you a rich-text block and leave you to hand-build a table. This is a real structured surface — which means the allergen flags are checkboxes rather than something you have to remember to type, and the amounts line up.

Try it

Ingredient list
3

Each ingredient is a block. The section takes up to 12.

EU FIC allergen flags stay visible but calm — never a red alarm.

A certificate-of-analysis link closes the ledger.

Storefront preview

Full disclosure

Ingredients

  • Iron bisglycinate

    Amount
    25 mg
    Form
    Capsule

    Chelated bisglycinate form for reduced GI side effects vs ferrous sulfate. Manufactured in Galway under EU GMP.

  • Vitamin D3 (cholecalciferol)

    ⚠ Soybeans
    Amount
    1000 IU
    Form
    Capsule

    Lichen-derived vegan D3. Independent COA per batch verifies potency to ±5% of label claim.

  • Magnesium glycinate

    Amount
    200 mg
    Form
    Capsule

    Albion Minerals chelate. Higher bioavailability and lower laxative effect vs magnesium oxide.

✓ Download Certificate of Analysis (COA)(Third-party lab verified)

Live demo — Ingredient list on storefront
Live demo — Ingredient list on storefront

Settings

SettingWhat it does
Color schemePicks which set of colors to use for this section
SubheadingA small line above the heading (e.g. "Full disclosure")
HeadingThe title of the section
TextA short paragraph under the heading
Certificate URLWhere the "Download Certificate of Analysis" link goes. Leave blank to hide the link row.
Related articlePick a blog post to link to (e.g. a guide to reading a supplement label)
Emit structured product usage data (advanced)Adds structured product-usage data (JSON-LD) for search engines. Off by default — enable only after confirming your products comply with the supplement and health-claim regulations in your jurisdiction.

Blocks

Each ingredient is one Ingredient block. The section takes up to 12, which keeps the grid to clean rows.

SettingWhat it does
Ingredient nameThe name shoppers see (e.g. "Magnesium glycinate")
AmountThe quantity per serving (e.g. "200")
UnitThe unit for the amount — mg, g, mcg, IU, ml
FormHow it's delivered — capsule, softgel, tablet, scoop, sachet, drops, or gummy. Shows as a chip; choose None to hide it.
SourcingA short provenance line: where it's from, what form, how it's made
Allergen flagsCheckboxes for the 14 EU declarable allergens. Tick the ones that apply.
Allergen noteFree text, if you need to say something the checkboxes can't
ContraindicationsWho should avoid this ingredient, or what it interacts with

Sourcing is a plain-text field

Don't paste HTML into Sourcing, Ingredient name, Amount, or Allergen note. These are plain-text fields, so any tags you paste show up as literal <p> text on your storefront rather than formatting anything. Type the sentence, not the markup.

Allergen flags

The 14 checkboxes are the EU's declarable allergen list (EU FIC 1169/2011, Annex II): gluten, crustaceans, eggs, fish, peanuts, soybeans, milk, nuts, celery, mustard, sesame, sulphites, lupin, molluscs.

Ticking one adds a flag next to the ingredient name and announces it to screen readers as "Contains allergen: …".

The flag is deliberately calm — stone-toned, not a red alarm. This is not softening the information: an allergen flag needs to be noticed and believed, and shoppers learn to tune out alarm colors that a store applies to everything. It stays high-contrast and it is never hidden.

Certificate of analysis

If you publish COAs, put the link in Certificate URL and a verification row closes the ledger. If you don't, leave it blank and the row disappears — better nothing than a link to a page that isn't there.

Tips

  • Fill in Sourcing. It's the field that separates a real ingredient list from a label photo. Shoppers who read ingredient lists are exactly the shoppers who care where things come from.
  • Use the real amounts, including the unwelcome ones. A visible 50 mg reads as more honest than an absent number.
  • Contraindications build trust rather than costing sales. The shopper who needed that warning was never going to be a happy customer.

Built for the Shopify Theme Store.