Hub pages
A hub page is a product-scoped landing page. It gives a reader one 360° view of a product across versions, deployment types, and surfaces.
Hub pages are composed entirely from directives. There is no free-form body content. That constraint is deliberate. It lets every link validate at build time, and it keeps every hub structurally consistent whoever authors it.
See the docs-builder documentation hub for a complete page.
Set layout: hub in the page frontmatter:
---
layout: hub
---
The hub layout differs from the default page layout in three ways:
- The right-rail table of contents is removed. The version dropdown lives in that rail, so a hub page does not show it.
- The previous and next page navigation is removed.
- The body owns the full width of the content column, so directives can render full-bleed sections.
The left sidebar stays. A reader can move between sibling hubs from there.
A hub page has no authored H1. The page title comes from the first {hero} directive's :title: option.
Title detection tries three sources in order:
- A top-level H1 in the body.
- An H1 nested inside a directive.
- The
:title:option of the first{hero}.
One field therefore drives both the on-page heading and the browser tab title.
A hub page exists to answer generic queries such as "Elasticsearch docs". Two fields carry that:
- The
{hero}:title:option, which becomes the indexed page title. - The frontmatter
description, which becomes the indexed description.
Write both deliberately. The search body indexes the hero title and description only. Section and card titles stay out, so a hub does not compete with the pages it links to on specific queries.
| Directive | Purpose |
|---|---|
{hero} |
Identity band. Carries the product icon, the page title, a description, and up to three actions. |
{card-group} |
Section heading and card grid. Renders as an accordion inside {explore}. |
{link-card} |
One card: title, description, link list, optional aside. Renders as a link column inside {explore}. |
{get-started} |
Onboarding funnel. An install command, a tutorial link, and numbered steps. |
{explore} |
The browse-everything section. A stack of collapsible accordions. |
---
layout: hub
---
:::{hero}
:icon: elasticsearch
:title: Elasticsearch documentation hub
:description: The distributed search and analytics engine at the heart of the Elastic platform.
:::