Skip to content
StoreA11y

Shopify · 4.1.2 Name, Role, Value (Level A)

Input buttons with no value or name on Shopify

Some <input type="button"|"submit"|"reset"> elements have an empty value, so they are announced as just "button". These are usually older submit buttons in newsletter or search forms.

Which WCAG criterion this fails

  • 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. Give the input a value attribute — that string is both the visible text and the accessible name: value="Subscribe".
  2. If the button must show only an icon, switch it to a <button> element with the icon inside and an aria-label, which is easier to style than an <input>.
  3. Never leave value="" and paint the label on with CSS content — assistive technology does not read generated content reliably.

Where this usually lives

sections/newsletter.liquid, snippets/search-form.liquid, and any legacy sections carried over from an older theme

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 -->
<input type="submit" value="">

<!-- After -->
<input type="submit" value="Subscribe">

<!-- Or, for an icon-only submit -->
<button type="submit" aria-label="Search">
  <svg aria-hidden="true" focusable="false">…</svg>
</button>

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: input-button-name (axe-core).