Advanced Heading — Documentation

Advanced Heading is a heading with the controls core leaves out: inline highlight spans, an optional sub-heading above or below the title, an accent line, and full typography control over both the heading and the sub-heading. Use it for section titles, hero headlines, and anywhere a plain Heading block isn't enough.

How to add

Open the block inserter, switch to the Axiom Blocks category, and click Advanced Heading. Type directly into the heading — select any run of text and use the Highlight toolbar button to wrap it in a highlight span.

Heading

Heading text — edited inline in the canvas, not the sidebar.

HTML tag — the element the heading renders as: h1–h6, p, or div. Choose the tag that fits your document outline; the visual size is controlled separately by typography, so picking h2 for SEO doesn't lock you into a size.

Sub-heading

Enable sub-heading reveals a secondary line with its own controls:

Sub text — the sub-heading content.
Tag — h1–h6, p, or div.
Position — Above or Below the main heading.

The sub-heading has a complete, independent typography panel (family, size, weight, line height, letter spacing, transform, decoration, alignment).

Accent line

Enable accent adds a short rule next to the heading:

Position — above or below the heading.
Alignment — left, center, or right.
Width and Thickness — any CSS length.
Color.

The block sidebar is split into two tabs. Settings is what the heading does; Styles is how it looks, organised by part.

Tab	Section	Covers
Settings	Heading	Level/tag, highlight behavior, accent line show and position
Settings	Advanced	Visibility, Position, anchor, CSS class
Styles	Heading	Text color, typography, max width
Styles	Sub-heading	Text color, typography
Styles	Highlight	Background color, radius
Styles	Accent	Accent line color
Styles	Link	Link color
Styles	Spacing	Padding and margin on the outer wrapper

Styling

Each text part carries its own color and typography, so you style the sub-heading where you edit the sub-heading rather than hunting through a combined panel.

Part	Rows
Heading	Text, Typography, Max width (per device)
Sub-heading	Text, Typography
Highlight	Background, Radius — a large radius gives the pill treatment
Accent	Color of the accent line
Link	Color for any anchors inside the heading or sub-heading
Spacing	Padding and margin on the outer block

The block supports Wide and Full alignment from the toolbar and an HTML anchor.

HTML output

// terminalhtml

<div class="wp-block-axiom-blocks-advanced-heading ab-ah">
  <span class="ab-ah__accent is-accent-left" aria-hidden="true"></span>
  <h2 class="ab-ah__heading">
    The blocks core <mark class="ab-ah-highlight">forgot</mark>
  </h2>
  <p class="ab-ah__sub">Plus a few you can't get anywhere else.</p>
</div>

Highlight colors, link colors, and the accent line are driven by CSS custom properties (--ab-ah-hl-color, --ab-ah-accent-color, …) on the wrapper, so they cascade to every matching element without inline styles on each span.