Header, menu and page outline
A regular documentation page has four parts: the header, the left menu,
the text and the outline on the right. You write the text in Markdown, and the other parts
are connected by name in page.json.
Click “Check responsive preview” above the example and choose a phone. The menu and the header sections move behind the button on the left of the header, and the right column with the outline is hidden.
How it works
- The page is divided into regions:
headeris the header,sidebarthe left menu,outlinethe right column. The Markdown text always goes to the main region. - Each region holds a ready Docara part:
docara.headeris the header with the name, search and settings,docara.navigationthe site menu,docara.outlinethe page outline. - Docara builds the outline from the page’s
##and###headings. The menu is built from the site folder structure.
regions-composed.page.json
"layout": { "regions": { "header": { "enabled": true, "sections": [{"id": "branding", "section": "docara.header"}] }, "sidebar": { "enabled": true, "sections": [{"id": "navigation", "section": "docara.navigation"}] }, "outline": { "enabled": true, "sections": [{"id": "outline", "section": "docara.outline"}] } }},Every documentation page looks like this even without these lines: Docara turns on the three regions itself. You write them out when you change what they hold, as in the neighbouring examples.
What you can change
| Parameter | What it changes |
|---|---|
enabled |
Whether the region is shown: true or false |
sections |
What the region holds, top to bottom; up to eight parts |
id |
The name of the part in this region, in Latin letters; it tells the parts apart |
section |
Which Docara part: docara.header, docara.navigation, docara.outline or docara.shell for your own blocks |