How to fix button name on Wix

Steps for Wix

1. Open the Wix Editor for your site. Click directly on the button element that is failing.
2. In the button settings panel, check whether a 'Tooltip' or 'ARIA Label' field is available (Wix has been rolling out accessibility properties) — if so, fill in a descriptive label.
3. If no ARIA field is available for that widget type, use the 'Custom Code' section (Settings → Custom Code → Head) to inject a JavaScript snippet that adds aria-label attributes to specific buttons by their selector after page load (e.g. document.querySelector('.cart-icon-button').setAttribute('aria-label', 'Open cart');).
4. For Wix Studio, use the Dev Mode / Velo editor to directly manipulate element properties and set accessibility attributes on components.
5. Verify with WAVE or axe DevTools after publishing.

<!-- ✅ Option 1: Visible text (best) -->
<button type="button">Add to cart</button>

<!-- ✅ Option 2: aria-label on an icon-only button -->
<button type="button" aria-label="Open search">
  <svg aria-hidden="true" focusable="false">...</svg>
</button>

<!-- ✅ Option 3: Visually-hidden span (text in DOM, hidden visually) -->
<style>
  .sr-only {
    position: absolute;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    border: 0;
  }
</style>
<button type="button">
  <svg aria-hidden="true" focusable="false">...</svg>
  <span class="sr-only">Open cart</span>
</button>

<!-- ❌ Broken: icon font with no label -->
<button type="button"><i class="icon-cart"></i></button>

What is button name?

Every button on your store — including icon-only buttons like a cart icon, search magnifying glass, hamburger menu, or social share button — must have a text name that screen readers can read aloud. When a button contains only an image or an icon font (e.g. a heart symbol or an arrow), there is no visible text for assistive technology to announce, so blind and low-vision users hear something useless like "button" with no description. WCAG Success Criterion 4.1.2 requires all interactive controls to have an accessible name. This name can be visible text inside the button, an `aria-label` attribute, an `aria-labelledby` reference, or a visually-hidden text element — the screen reader just needs something meaningful to say.

Roughly 7–8% of online shoppers use assistive technology, and an unnamed button is a complete dead-end for them — they cannot add to cart, open the menu, or complete checkout if those buttons have no accessible name. Beyond lost conversions, this is a WCAG 2.1 Level A violation (the lowest, most-required level), meaning it exposes your store to legal complaints and ADA/Section 508 accessibility lawsuits, which have been rising sharply in ecommerce. Google's crawlers also parse ARIA labels and button text as page signals; cleaner, descriptive buttons contribute to better crawlability and can positively influence rankings. Fixing unnamed buttons is typically a quick, high-impact change that simultaneously removes legal risk, improves conversion for disabled users, and makes your site more professional.

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