Bold text is not a subheading. WordPress renders whatever tag sits underneath, and a bolded paragraph is still a paragraph.
Learning how to add subheadings in WordPress takes about 30 seconds. Doing it correctly across 5 different editors takes a bit more.
Roughly 71.6% of screen reader users navigate a page by jumping through headings, and skipped levels now appear on 41.8% of the top million home pages (WebAIM).
This guide covers:
- The Heading block, Classic Editor, raw HTML, and page builder methods
- Correct h2 to h6 hierarchy and how to style it
- Anchors, table of contents links, and auditing tools
What Is a Subheading in WordPress?
A subheading in WordPress is an HTML heading element, h2 through h6, sitting inside post or page content. The Heading block produces it. Bold text, larger type, and colored paragraphs are not subheadings, because none of them output a heading tag.
The post title is already your h1. Your theme prints that title from the template, not from the editor.
So the first subheading you type inside the content area starts at h2. That one fact clears up most of the confusion around this topic.
| Level | Role in a WordPress post | Typical count |
|---|---|---|
| H1 | Main post/page title, usually generated by the theme | 1 |
| H2 | Major sections of the article | 5–12 |
| H3 | Subsections that explain a specific aspect of an H2 | 0–4 per H2 |
| H4–H6 | Deeper subsections for detailed topics or nested components | As needed |
Why Bold Text Is Not a Subheading
Three things are missing when you bold a paragraph instead of applying a heading tag:
- No semantic tag in the markup, only a strong element wrapped in a paragraph
- No entry in the document outline, so the section is invisible to any table of contents
- No announcement from a screen reader working through the heading list
WebAIM’s Screen Reader User Survey found 71.6% of respondents navigate a long page by jumping through headings first. Bold text gives them nothing to jump to.
Where Subheadings Show Up Beyond Blog Posts
Bumping a paragraph to 28px through the typography panel is a font size change, nothing more. The tag underneath stays a paragraph.
Heading elements live in more places than the post editor, though:
- Static pages built with the block editor
- Template parts and query loops edited in the Site Editor
- Block-based widget areas in footers and sidebars
- WooCommerce product descriptions and custom post types
What Are the Methods to Add Subheadings in WordPress?
WordPress offers 5 methods to add subheadings: the Heading block in the block editor, the format dropdown in the Classic Editor, raw markup in the Custom HTML block or Code Editor, heading widgets inside page builders, and Heading blocks placed in Site Editor templates.
| Method | Interface | Who uses it |
|---|---|---|
| Heading block | WordPress Block Editor (Gutenberg) | Most post and page authors |
| Format dropdown | Classic Editor / Visual editor | Legacy sites and content teams |
| Raw markup | Custom HTML block or Code Editor | Developers and imported content |
| Heading widget | Elementor, Divi, Beaver Builder | Page-builder users and landing-page creators |
| Template heading | Site Editor / block themes | Users editing theme-level templates |
Key point: all 5 methods produce the same thing in the browser. An h2 written in Elementor and an h2 typed in the block editor are identical once the page renders.
What differs is speed and how easily you can fix the level later.
The block editor now ships with 87.1 million active installations and has been used to write 332.3 million posts, according to WordPress.com’s Gutenberg in Numbers dashboard. The Heading block sits third in usage across all blocks at 10.4%, behind Paragraph (43.7%) and Image (10.7%).
How to Add a Subheading in the WordPress Block Editor?
Type ## followed by a space at the start of an empty paragraph block to create an h2. WordPress converts it instantly. Three hashes gives you an h3. The block inserter and the slash command both work as alternatives.
WordPress 7.0 “Armstrong”, released May 20, 2026, changed how this feels. The Heading block now registers h1 through h6 as separate block variations, each with its own icon in the inserter.
You pick the level before you type instead of correcting it afterward. Small change, big difference in daily use.
Adding a Heading Block with the Slash Command
Start on an empty line, type /heading, then hit Enter. The block appears with the cursor already in it.
Set the level from the block toolbar dropdown or the Block tab in the right sidebar. Both write to the same attribute.
Faster option: select an existing heading and press Ctrl+Alt+2 through Ctrl+Alt+6 on Windows, or Ctrl+Option plus the same numbers on Mac.
Converting a Paragraph Into a Subheading
Click the block type icon at the far left of the paragraph toolbar, then choose Heading from the Transform menu.
WordPress keeps the text and swaps the tag. If you drafted a whole article in paragraphs first (a lot of people do), you can convert section by section without retyping anything.
The default landing level is h2, which matches what most themes expect.
Checking Heading Order in List View
List View is the panel that shows every block in the post as a nested tree. Open it from the icon in the top toolbar.
Headings display with their level, so a stray h4 sitting between two h2s becomes obvious in about two seconds.
- Drag blocks in List View to reorder whole sections
- Click any heading to jump straight to it in the canvas
If you have never turned this on, do it before your next long post. It saves more time than almost any plugin. To switch a site back to this editor after using something else, see how to enable the Gutenberg editor in WordPress.
How to Add Subheadings in the Classic Editor?
Select your text in the Visual tab, then pick Heading 2 through Heading 6 from the Paragraph dropdown at the far left of the toolbar. Keyboard shortcuts skip the dropdown entirely and apply the level in one keystroke.
The Classic Editor plugin still carries 9 million active installations and was last updated on May 28, 2026. WordPress maintains it officially and renews the support commitment annually, so it is not a temporary workaround.
| Action | Classic Editor | Block Editor |
|---|---|---|
| Apply H2 | Alt + Shift + 2 | Ctrl + Alt + 2 |
| Apply H3 | Alt + Shift + 3 | Ctrl + Alt + 3 |
| See raw markup | Text tab | Code Editor: Ctrl + Shift + Alt + M |
Mac users swap Alt+Shift for Ctrl+Option. The numbers stay the same.
Cannot find the dropdown at all? Click the Toolbar Toggle button on the right end of the top row. It expands the second toolbar row, which is also where text justification in WordPress and other alignment controls hide.
Switch to the Text tab afterward to confirm the tag. You should see a clean <h2>, not a span carrying inline styles.
Content written in the Classic Editor migrates fine. Headings survive the move to blocks because they were real heading tags all along.
How to Add Subheadings with HTML in WordPress?
Insert a Custom HTML block and write <h2>Your heading</h2> directly. For editing an entire post at once, open the Code Editor with Ctrl+Shift+Alt+M and type heading tags into the raw block markup.
Manual markup is the only method that lets you attach classes and IDs in the same keystroke:
<h2 class="section-lead">targets that heading from your CSS without touching global rules<h3 id="pricing">creates a jump target for anchor links
The pasting problem: content copied out of Google Docs or Word usually arrives as span elements wrapped in inline styles rather than heading tags. It looks right and behaves wrong.
Paste with Ctrl+Shift+V for plain text, then apply headings inside WordPress. Or run the source through a Word to HTML converter first and paste clean markup into a Custom HTML block.
Drafting in markdown instead? A markdown to HTML converter turns hash-prefixed lines into proper heading elements before import.
One boundary worth naming. Heading tags written inside theme template files belong to the layout, not the article, and they render on every page using that template. Post content headings render once. The difference matters when you are deciding where a heading should live, which the breakdown of WordPress templates versus themes covers in more depth.
How to Add Subheadings in Elementor, Divi, and Other Page Builders?
Every major builder separates the visual size of a heading from its HTML tag. In Elementor you set the tag under Content, in Divi through the module’s heading level field, in Beaver Builder through the Heading module dropdown. Changing the tag never changes the styling.
Elementor now appears on 32.67% of WordPress sites in the April 2026 HTTP Archive crawl, ahead of the block editor at 20.62%, wpBakery at 8.52%, and Divi at 5.72%. Its free plugin passed 10 million active installations, and the companion Hello theme carries over 1 million on its own.
| Builder | Where the tag lives | Common default |
|---|---|---|
| Elementor | Heading widget → Content → HTML Tag | H2 |
| Divi | Text/Heading module → heading or title settings | H2 |
| Beaver Builder | Heading module → HTML Tag dropdown | H2 |
Here is the pet peeve. Builders default every new heading to h2, so a landing page assembled from 6 sections and 12 feature cards ships with 12 h2 tags and zero hierarchy.
Nothing warns you. The page looks fine.
Fix it at the source: set the tag as you drop each widget, not during a cleanup pass three weeks later. Elementor’s global heading settings under Site Settings control typography across the site, but they do not touch tags, so the correction stays manual.
How to Set the Correct Subheading Hierarchy?
Use one h1 per page, supplied by the post title. Open each main section with an h2. Nest attributes of that section under h3, and components of an h3 under h4. Never skip a level on the way down.
Skipping is more common than you would guess. WebAIM’s 2026 Million report found skipped heading levels on 41.8% of the top one million home pages, up from 39% the year before, while pages with no headings at all dropped to 7.5%.
A correct structure reads like an outline:
- h1: How to Add Subheadings in WordPress
- h2: How to Add Subheadings with HTML in WordPress
- h3: Adding Classes and IDs to Heading Tags
- h4: Naming Rules for Anchor IDs
- h2: How to Set the Correct Subheading Hierarchy
Jumping from h2 straight to h4 breaks WCAG 1.3.1, the Info and Relationships criterion, because the markup no longer communicates the relationship the visual layout implies.
Screen readers build a flat list from your heading tags. NVDA, used by 65.6% of survey respondents, and VoiceOver, at 70.6% on mobile, both let users pull that list and move through it level by level.
When the levels lie, the list lies. That is the practical case for web accessibility here, and it costs you nothing to get right.
One caution on styling. Pick heading levels from the outline, then adjust the appearance. Choosing an h4 because it looks smaller inverts the process and wrecks the structure, which is exactly where semantic hierarchy and visual hierarchy in web design stop agreeing with each other.
88.8% of screen reader users rate heading levels very or somewhat useful in the same WebAIM survey. Roughly 25 headings sit on the average home page, so the structure is doing real work whether you designed it or not.
How to Style Subheadings in WordPress?
Set heading styles site-wide under Appearance > Editor > Styles > Typography > Headings, or in theme.json for block themes. Classic themes use the Customizer’s Additional CSS panel. Individual headings pull typography, color, and spacing controls from the block sidebar.
Three layers exist, and picking the wrong one is how sites end up with 40 one-off overrides nobody can trace.
| Layer | Where it lives | Scope |
|---|---|---|
| Global Styles | Appearance → Editor → Styles | Site-wide styles for headings and other blocks |
theme.json | Theme root folder | Defines theme-level defaults and styles for heading levels |
| Additional CSS | Appearance → Customize → Additional CSS | Custom CSS, mainly available in classic themes |
| Block sidebar | Right sidebar when a heading block is selected | Styles/settings for an individual heading block |
theme.json arrived in WordPress 5.8 and the Styles interface followed in 5.9. Block theme adoption has moved fast since, with full site editing usage climbing 145% through 2025 according to industry tracking.
Site-Wide Heading Styles in the Site Editor
Open the Styles sidebar, click Typography, then Headings. Every h1 through h6 inherits what you set there.
Per-level control sits one layer deeper. Scroll to the Blocks panel at the bottom of the Styles sidebar and pick Heading to override a single level.
WordPress generates CSS custom properties from theme.json, which is why the editor preview finally matches the published page. Fluid sizing uses clamp values, so a CSS clamp calculator saves guesswork when you want h2 text scaling between mobile and desktop.
That approach is closer to responsive typography than fixed pixel values, and it removes a chunk of media query work.
Styling a Single Subheading with a CSS Class
Select the heading, open the Advanced panel in the block sidebar, and type a class name into the Additional CSS class(es) field.
WordPress 7.0 added a Custom CSS box in that same Advanced panel. Anything you write there stays scoped to that one block instead of polluting a global stylesheet.
- Class field: reusable across headings, styled once in your stylesheet
- Block Custom CSS: single-use, no stylesheet edit required
Color and background color settings in WordPress live in the same sidebar under Styles.
How to Link to Subheadings with Anchors and a Table of Contents?
Open the Advanced panel in the Heading block sidebar and type a value into the HTML anchor field. WordPress writes it as an id attribute on the heading tag, which turns that section into a jump target for links, menus, and table of contents plugins.
Anchor naming rules: lowercase, hyphens instead of spaces, no punctuation, unique within the page. pricing-tiers works. Pricing Tiers! does not.
Link to it from anywhere with #pricing-tiers appended to the URL, or with just the hash on the same page. The same syntax works inside navigation menus and body copy, which overlaps with how you add internal links in WordPress generally.
Now the part that trips people up. The core Table of Contents block is still marked experimental and ships only with the Gutenberg plugin, not with WordPress itself.
| Tool | Reach | How it builds the list |
|---|---|---|
| Core Table of Contents block | Depends on WordPress/Gutenberg availability | Reads heading blocks in the content and generates a table of contents |
| Easy Table of Contents | 400,000+ installs | Scans configured heading tags and automatically generates the TOC |
| LuckyWP Table of Contents | 100,000+ installs | Generates hierarchical or linear TOCs with configurable heading levels |
| Rank Math TOC block | Included with Rank Math | Adds a TOC block that can be configured and edited within the editor |
Every one of these reads your heading tags. Bolded paragraphs produce an empty table of contents, which is usually the moment people discover their headings were never real headings.
Easy Table of Contents works with the block editor, Classic Editor, Elementor, Divi, and WPBakery, so the method you used to write the heading rarely matters.
What Are the Most Common Subheading Mistakes in WordPress?
The 5 most common subheading mistakes are empty heading blocks, more than one h1 per page, heading levels picked for visual size, vague heading text, and bolded paragraphs standing in for real heading tags.
Empty heading blocks: hit Enter twice inside a heading and WordPress keeps the block. It renders as an empty h2 and gets flagged by every accessibility checker.
A second h1 in post content: WebAIM’s 2026 Million report found more than one h1 on 18.1% of the top million home pages, up from 16.3% a year earlier.
Worth separating two problems that get confused. Duplicate h1 tags sit inside the page, while duplicate title tags in WordPress sit in the head and affect what shows in search results.
Picking the level by size: the h6 count on the average home page more than doubled in a single year, and 94.9% of pages carrying at least one h6 also have skipped heading levels. People reach for h6 because it looks small.
Style it down instead. Set the level from the outline, then shrink the type, an approach that overlaps with the broader rules of accessible typography.
Vague heading text: “Introduction”, “More Info”, and “Details” tell a skimming reader nothing. Yoast SEO checks whether your keyphrase appears in subheadings for exactly this reason.
Yoast also flags subheading distribution when any section runs past 300 words without a break (250 for cornerstone content).
Across the million home pages WebAIM scanned, h3 is now the most common level at 37.5% of all headings, ahead of h2 at 29%. Plenty of those h3s have no h2 above them.
How to Check Subheading Structure on a Published Page?
Open Chrome DevTools and read the Accessibility tree, or install HeadingsMap for a one-click outline of every heading level. WAVE and axe DevTools flag skipped levels and empty headings. Screaming Frog extracts H1 and H2 data across an entire crawl.
Editor previews lie occasionally. Themes and builders can output a different tag than the one you selected, so the check happens on the published URL.
| Tool | What it surfaces | Scope |
|---|---|---|
| Chrome DevTools | Rendered heading tags, DOM structure, and accessibility information | One page |
| HeadingsMap | Heading outline and hierarchy problems | One page |
| axe DevTools | Accessibility violations mapped to WCAG rules | One page or user flow |
| Screaming Frog | Extracted H1/H2 data, missing headings, duplicates, and related SEO issues | Whole site |
HeadingsMap runs around 100,000 weekly active users in Chrome and works in Firefox and Edge too. No Safari version, which is mildly annoying if that is your daily driver.
axe DevTools has passed 800,000 Chrome installs, and Deque puts its catch rate at 57% of issues during coding. Automated scanners generally surface 30% to 50% of common problems, so a tool pass is a starting point rather than a sign-off, which is why a web accessibility checklist still earns its place in the workflow.
WAVE injects annotations straight onto the rendered page. It also reports the heading level of each item, which makes an h4 sitting under an h2 obvious without opening any code.
Same engine, wider view: WebAIM runs the WAVE API across a million home pages every February. The 2026 pass logged 1,206,444 skipped heading levels, roughly one in every 25 headings on the web.
WordPress sites in that sample averaged 52.8 errors per page, 5.8% below the overall average of 56.1. Better than Shopify at 75.1, behind Squarespace at 33.0.
For site-wide work, Screaming Frog’s H1 and H2 tabs export straight to CSV. The free version stops at 500 URLs, which covers most blogs.
Custom Extraction with an XPath expression like //h2 pulls every h2 on the site into one sheet, useful when you want to see whether your section headings actually differ from each other.
Inside the dashboard, Yoast SEO added a Single H1 check to its content analysis, and Rank Math runs comparable structure tests. Neither replaces a crawl, though both catch the obvious breakage before you publish. WAVE also flags the low contrast text that WebAIM found on 83.9% of home pages in 2026, so color contrast problems tend to surface in the same pass as your heading errors.
FAQ on How To Add Subheadings In WordPress
What heading level should the first subheading be?
Start at h2. The post title already occupies the h1 and gets output by your theme template, so h2 is the correct first level inside content. Nest h3 underneath it.
Why is my subheading not showing up as a heading?
Check the Text tab or Code Editor. Bolded paragraphs and resized text look like headings but carry no heading tag, so screen readers, table of contents plugins, and crawlers skip them entirely.
Can I add subheadings in WordPress without a plugin?
Yes. The Heading block ships with WordPress core, and the Classic Editor format dropdown does the same job. Plugins only earn their place for automatic table of contents generation or bulk heading audits.
How do I change a heading level after publishing?
Select the heading, then pick a new level from the block toolbar dropdown or press Ctrl+Alt plus the number. Update the post. HTML anchors stay intact, so existing jump links keep working.
Should I use more than one h1 per page?
No. WebAIM’s 2026 Million report found multiple h1 tags on 18.1% of top home pages, up from 16.3% a year earlier. Yoast SEO runs a Single H1 check for this reason.
Do subheadings help SEO?
Indirectly. Headings help Google map sections to queries and feed featured snippets. Semrush and Moz correlation studies show a small positive relationship between h2 and h3 usage and rankings, not a direct ranking factor.
How do I add a subheading in Elementor?
Drop in a Heading widget, type your text, then set the HTML Tag selector under the Content tab. Elementor defaults every heading to h2, so the level needs correcting manually on each widget.
Can I add subheadings to WordPress pages, not just posts?
Yes. Pages, custom post types, WooCommerce product descriptions, template parts in the Site Editor, and block-based widget areas all accept Heading blocks. Hierarchy rules stay identical wherever the heading sits.
How many subheadings should a post have?
No fixed number. Yoast SEO flags any section running past 300 words without a subheading (250 for cornerstone content), which lands most long articles somewhere between 5 and 12 h2 sections.
Why did my Google Docs headings turn into plain text?
Google Docs and Word paste as span elements wrapped in inline styles rather than real heading tags. Paste with Ctrl+Shift+V for plain text, then apply the Heading block inside WordPress.
Conclusion
Knowing how to add subheadings in WordPress is less about the keystroke and more about the tag that ends up in the markup.
Pick your level from the outline first. Type ##`, use the slash command, or grab an h3 variation straight from the inserter in WordPress 7.0.
Then verify. Open List View before you publish, and run HeadingsMap or a Screaming Frog crawl afterward.
A workable order:
- Draft the h2 and h3 outline before writing a word
- Add HTML anchors to any section you plan to link
- Set typography once in Global Styles or theme.json, never per heading
Do that consistently and your document outline stays clean without a single audit fixing it later.


