Skip to main content
TestAccessibility

WordPress fix guide

Fix Empty buttons on WordPress

Icon-only buttons need visible text or `aria-label`.

This page ties the generic issue to how it usually shows up in WordPress markup and tooling, then walks you through a fix and verification loop.

Verify on a live URL

Scan, fix, deploy, then rescan the same address to compare reports.

Main issue guide: Empty buttons →

At a glance

Instructional

Icon-only controls need a name

Visible text, aria-label, or associated text can supply an accessible name.

Where this comes from on WordPress

Block themes, mega-menu toggles, and plugin icons (search, cart, close) shipped without text or aria-label.

What this issue means

Causes

Designers remove visible text assuming icons are universal. SVG or `<img>` icons without alt contribute empty names.

Fixes

Add visually hidden text or `aria-label` that matches the action: “Close dialog”, “Submit order”.

How to fix on WordPress

In WordPress, fix the underlying theme or block output: child themes, block patterns, or plugin markup. Re-scan after updates—page builders often regress heading order or button names.

How to fix

Add visible text or aria-label that states the action: “Close dialog”, “Add to favorites”.

Ensure disabled state is communicated to assistive tech, not only styled gray.

Common mistakes on WordPress

  • Using `title` instead of aria-label or visible text.
  • SVG icons without `<title>` or button name.
  • Fixing only one page while the pattern lives in a shared template.
  • Caching plugins serving old HTML after fixes.

How to verify the fix

  1. In wp-admin, open the page on the front-end; use keyboard only through the fixed region.
  2. If you use a builder, re-publish/clear cache so changes appear.
  3. Rerun the public scan on the same URL and compare the report link.

Related: 4.1.2 Name, Role, Value.

Same issue on other platforms

Related issues

Guides

Next steps

TestAccessibility · WordPress fix · localhost:3001