Skip to content
StoreA11y

Shopify · 3.3.2 Labels or Instructions (Level A)

Form field has more than one label on Shopify

Some form fields are pointed at by two or more <label> elements. Screen readers disagree about which one wins — some read the first, some read the last, some read both — so the field is announced inconsistently or wrongly.

Frequently litigated

Conflicting labels are pleaded alongside missing labels as evidence the checkout is unusable.

Which WCAG criterion this fails

  • Does not meet 3.3.2 Labels or Instructions (Level A)
  • Does not meet 4.1.2 Name, Role, Value (Level A)

How to fix it on Shopify

Everything below is done from Online Store > Themes > Edit code. Take a copy of the theme before editing.

  1. Find the input id from the finding, then search the theme for that id inside `for="…"`. There will be two or more matches.
  2. Keep exactly one <label>. This usually happens after an app injects a duplicate label, or after a section was copy-pasted.
  3. If the second label is genuinely a hint or a unit ("kg", "optional"), convert it to a <span> and link it with aria-describedby instead of `for`.
  4. If an app added the duplicate, check the app's settings for a "render label" toggle before editing the theme, or the edit will be overwritten on the next app update.

Where this usually lives

sections/main-contact.liquid, sections/main-cart-footer.liquid, and any app block injected into the product form

Paths given for Dawn and its derivatives (Sense, Craft, Refresh, Studio). A heavily customised theme may differ; the CSS selector in your scan report points at the exact element.

Code

<!-- Before: two labels claim the same field -->
<label for="Qty">Quantity</label>
<label for="Qty">Required</label>
<input id="Qty" type="number">

<!-- After: one label, the rest becomes a description -->
<label for="Qty">Quantity</label>
<input id="Qty" type="number" aria-describedby="QtyHint">
<span id="QtyHint">Required</span>

How to confirm it is fixed

Re-run the scan. This rule should drop out of the findings entirely. If the instance count falls but does not reach zero, the same defect exists in another template — product cards and quick-view modals are the usual second home for it.

Effort: low. Rule id: form-field-multiple-labels (axe-core).