How to fix landmark no duplicate main on WooCommerce

Ensure each page contains exactly one `<main>` landmark element (or one element with `role="main"`) so screen-reader users can navigate directly to the page's primary content.

Steps for WooCommerce

  1. The '<main>' landmark lives in your active WordPress theme. Navigate to Appearance › Theme File Editor (or use a local/staging FTP/SSH client for safety).
  2. Open the theme's 'header.php' and 'page.php' / 'single.php' / 'archive.php' — search each for '<main' and 'role="main"'. Consolidate to exactly one.
  3. If you are using a block theme (Full Site Editing), go to Appearance › Editor › Templates, select the relevant template, switch to Code Editor view, and inspect the markup for duplicate 'core/group' blocks set as 'tagName: main'.
  4. If a page-builder plugin (Elementor, Divi, Beaver Builder) is adding the duplicate, check the plugin's layout settings or its page/post wrapper element and change its HTML tag from 'main' to 'div' or 'section'.
  5. Install the 'axe DevTools' browser extension and re-scan the page to confirm one main landmark.
Official WooCommerce documentation ↗
<main>
  <!-- All unique page content lives here — product listings,
       article body, cart, etc. -->
</main>

<!-- ✅ Only ONE <main> per page. Everything else uses
     <header>, <nav>, <aside>, <footer>, <section>, or <article>. -->

<!-- ❌ Do NOT add a second <main> or role="main" anywhere else on the same page -->
<!-- <div role="main">…</div>  ← remove this if <main> already exists -->

What is landmark no duplicate main?

Every web page should have exactly one "main landmark" — the region that holds the page's primary, unique content. This is created by using the HTML `<main>` tag or by adding `role="main"` to any container element. When a page accidentally includes two or more of these landmarks (for example, because a theme template wraps content in `<main>` and a widget or app adds another one), assistive technologies become confused about where the real content starts. The WCAG rule `landmark-no-duplicate-main` flags this exact situation.

Screen-reader users rely on landmarks to skip repetitive navigation and jump straight to what matters on a page — this is a foundational accessibility technique. When two `<main>` landmarks exist, screen readers may announce the wrong region, navigate to the wrong place, or skip content entirely, making your store effectively unusable for a significant portion of shoppers with disabilities. In many jurisdictions (USA, EU, UK, Australia) selling online to the public creates legal obligations under accessibility laws such as the ADA, EAA, and WCAG-based regulations; duplicate landmarks are a clear, auditable WCAG 2.x violation that can appear in demand letters and audits. Fixing it also signals clean, well-structured HTML to search engines, which can marginally support crawlability and indexing.

See the complete Landmark no duplicate main guide for every platform and the full background.

Not sure if your WooCommerce store has this?

Run a free SEOLZ audit — we’ll find landmark no duplicate main and every other issue across your whole site.

Scan my site free

Fix landmark no duplicate main on another platform