Multiple H1 tags on one page: does it matter and how to fix it

What it looks like in the HTML

Before

<header>
  <h1 class="site-title">Bean Notes</h1>
</header>
<main>
  <h1>Cold Brew at Home: A Beginner's Guide</h1>
  <h1>What you need</h1>
</main>

After

<header>
  <p class="site-title">Bean Notes</p>
</header>
<main>
  <h1>Cold Brew at Home: A Beginner's Guide</h1>
  <h2>What you need</h2>
</main>

Why it matters

Screen reader users often navigate by headings, and many jump straight to the H1 to find the start of the content. When the site logo, the post title and a promo banner are all H1s, that shortcut stops working. The same goes for anyone reading the page's outline, including tools that summarize it.

For search, the effect is modest. Google reads headings to understand structure, and it does not require exactly one H1. But several H1s dilute which one is the main topic, and when they come from the template, they add the same site-wide words to the top of every page.

Common WordPress causes

• The site title is an H1 on every page. Older themes wrap the logo or site name in <h1> everywhere. The post title is also an H1, so every single post has two.
• H1 headings inside the content. In the block editor, the post title is already printed as the H1. An author who adds a Heading block and picks H1 creates a second one.
• Page builders. Every heading widget has its own tag setting. Designers pick H1 for big text, so a landing page can end up with an H1 in the hero, another in a section title and another in a call to action.
• Hidden elements. Popups, mobile menus, sliders and off-canvas panels can contain their own H1s, invisible until opened but present in the HTML.

How to fix it in WordPress

1. List the H1s. In your browser's developer tools console, run document.querySelectorAll('h1') to see each one and where it sits. Decide which one is the real main heading, usually the post or page title.
2. Fix the site title in the theme. Many themes have a setting for the site title tag, or print it as H1 only on the homepage. If yours does not, change the tag to <p> or <div> in a child theme's header template, keeping the CSS class so the style does not change.
3. Demote headings in the content. In the block editor, select each extra H1 block and change it to H2. Use the Document Overview (the list view's outline tab) to see the full heading structure at a glance.
4. Fix page builder widgets. In Elementor or Divi, select the heading and set its HTML tag. Keep the size in the design settings, not the tag: an H2 can look as large as you like.
5. Check hidden components. Edit popup, slider or menu templates so their headings use H2 or lower, or a non-heading tag if they are not headings at all.

Hydrogen SEO manages titles, metadata and schema but does not rewrite your theme's headings. Heading structure feeds the Content structure area of its site health score.

When you can ignore this warning

If the extra H1s are in separate, self-contained sections, such as a page that genuinely combines two distinct articles, and the fix would mean fighting your theme, it is reasonable to leave it and spend the time elsewhere. Google has been clear that multiple H1s are not a ranking problem in themselves. Template-wide duplicates like an H1 site logo are still worth fixing, because the fix is usually small.

How to check the fix

Rerun document.querySelectorAll('h1').length in the console; it should return 1. Check a post, a page, an archive and the homepage, since they use different templates. Clear any page cache first. The free SEO audit reports the H1 count for any URL.