Skip to content
Accessible Cart

Fixing “Buttons do not have an accessible name” in Shopify

Quantity plus and minus, slider arrows, close icons and menu toggles are the usual culprits. This one can block purchases.

Found on 11.4% of 3,151 Shopify homepages we tested in our 2026 study.

What the message means

A button that contains only an icon has no name for screen readers. On a product page that can mean a shopper can't change the quantity or close the cart drawer.

How to fix it

Add visually hidden text or an aria-label to every icon-only button:

<button class="quantity__button" name="plus" type="button">
  <span class="visually-hidden">
    {{ 'products.product.quantity.increase' | t: product: product.title | escape }}
  </span>
  {% render 'icon-plus' %}
</button>

<button class="drawer__close" type="button" aria-label="{{ 'accessibility.close' | t }}">
  {% render 'icon-close' %}
</button>

Check app-injected buttons

Chat widgets, wishlist hearts and review popups often add unnamed buttons. Those come from the app, not your theme; check the app's settings or ask the vendor.

More guides