How to fix input button name on BigCommerce

Steps for BigCommerce

1. In your BigCommerce admin, go to Storefront → My Themes → click Customize on the active theme → then Edit Theme Files (or use the Stencil CLI locally).
2. Search template files (`.html` files in `templates/components/` and `templates/pages/`) for `<input type="submit"` or `<input type="button"` with an empty or missing `value`.
3. Update the `value` attribute to a meaningful label, using Stencil's translation keys where available (e.g., `value="{{lang 'cart.checkout'}}"`), then save.
4. Publish the theme update and verify with Chrome DevTools Accessibility panel or a screen reader.

<!-- ❌ BEFORE: empty value — screen readers say nothing useful -->
<input type="submit" value="">

<!-- ✅ AFTER option 1: descriptive value attribute -->
<input type="submit" value="Add to Cart">

<!-- ✅ AFTER option 2: aria-label when value must stay empty -->
<input type="submit" value="" aria-label="Add to Cart">

<!-- ✅ AFTER option 3: switch to <button> for more flexibility -->
<button type="submit" aria-label="Add to Cart">
  <svg aria-hidden="true"><!-- cart icon --></svg>
</button>

What is input button name?

An "input button" is any clickable button on your website created with HTML's `<input type="button">`, `<input type="submit">`, or `<input type="reset">` tags. The button's visible (or accessible) label comes from its `value` attribute — for example, `value="Add to Cart"`. When that `value` attribute is missing or left empty (`value=""`), the button has no name that a screen reader can read aloud. This violates WCAG Success Criterion 4.1.2 (Name, Role, Value), which requires every interactive element to have an accessible name.

Screen reader users — including many people with visual impairments — rely on the button's accessible name to understand what will happen when they activate it. A button with no name is announced as something like "button" with no context, making your checkout, search, newsletter sign-up, or contact forms unusable for those shoppers. Beyond the direct accessibility barrier, this is a legal compliance risk: WCAG 2.1 AA is referenced by laws like the ADA (US), EN 301 549 (EU), and the Equality Act (UK), and empty button names are a clear, easily documented violation. Fixing this also improves your overall site quality signals and reduces the risk of accessibility-related complaints or litigation.

See the complete Input button name guide for every platform and the full background.