Blocks: basics
The nine blocks most pages are built from: header area, metrics, heading, text, services, prices, questions and the call to action. For each of them you find every setting here with its type, whether it is required and its default.
Overview
The blocks nearly every page is built from: header area, headings, text, services, prices and questions.
In the editor these blocks sit at the very top of the left column under "Basics" — the category is already open when you arrive. A typical home page is made of hero, feature grid, metrics, prices, FAQ and CTA in that order.
How to read the tables and which settings every block has on top of its own is explained on the chapter overview.
Hero hero
Header area of a page with the H1, a short subline and up to two buttons.
The headline of the first hero on a page becomes the H1 — the most important heading for search engines and screen readers. Any further hero on the same page looks identical but counts one level lower.
- In the editor
- Basics
- Page structure
- Standalone
- Settings
- 12
| Setting | Type | Required | Default | Meaning |
|---|---|---|---|---|
headline | Text | Required | no default | The H1 of the page; ==text== sets a coloured accent. |
subline | Text | optional | no default | One sentence below the headline. |
badges | List of texts | optional | empty | Short keywords rendered as chips in the hero. |
cta | Group | optional | no default | Primary button of the hero. |
cta.text | Text | Required | no default | Label of the button. |
cta.url | Text | Required | no default | Target of the button as a path or full address. |
secondaryCta | Group | optional | no default | Second, less prominent button. |
secondaryCta.text | Text | Required | no default | Label of the button. |
secondaryCta.url | Text | Required | no default | Target of the button as a path or full address. |
layout | Choice | optional | classic (rendering) | Hero arrangement: classic, centered or compact (flatter). Possible values: classic, centered, compact |
image | Text | optional | no default | Background image; without one the hero renders the theme animation. |
imageAlt | Text | optional | no default | Alternative text, only needed if the image carries a message of its own. |
On top of these come the common settings _style.
Metrics stats-bar
Horizontal bar with a few key figures; prices do not belong here.
- In the editor
- Basics
- Page structure
- Inline
- Settings
- 5
12
years in business
480+
completed jobs
24 h
response time
| Setting | Type | Required | Default | Meaning |
|---|---|---|---|---|
layout | Choice | optional | band (rendering) | Presentation: band (connected), cards (separate cards) or plain. Possible values: band, cards, plain |
items | List of entries | Required | empty | The key figures in display order. |
items[].value | Text | Required | no default | The value of the figure. |
items[].suffix | Text | optional | no default | Characters after the value, for example a percent sign. |
items[].label | Text | Required | no default | Label below the value. |
On top of these come the common settings _style.
Heading heading
Subheading that opens a new section of the page.
- In the editor
- Basics
- Page structure
- Section start
- Settings
- 3
Our workshop
| Setting | Type | Required | Default | Meaning |
|---|---|---|---|---|
text | Text | Required | no default | The text of the heading. |
level | Choice | optional | 2 | Rank of the heading; level 2 appears in the table of contents. Possible values: 2, 3, 4 |
id | Text | optional | no default | Anchor of the heading; without it the anchor is derived from the text. |
On top of these come the common settings _style.
Text paragraph
Body text for the main part of a page.
- In the editor
- Basics
- Page structure
- Inline
- Settings
- 1
Body text for the main part of a page. An empty line in the field starts a new paragraph, bold and italic work just as well as a link.
| Setting | Type | Required | Default | Meaning |
|---|---|---|---|---|
text | Text | Required | no default | The body text; Markdown is allowed. |
On top of these come the common settings _style.
Feature grid feature-grid
Grid of services or benefits, each with icon, title and text.
From two filled cards upwards it additionally produces a machine-readable list for search engines.
- In the editor
- Basics
- Page structure
- Inline
- Settings
- 6
Repair
One or two sentences on the service.
Maintenance
Similar lengths look calmest.
Emergencies
Three cards fill the row.
| Setting | Type | Required | Default | Meaning |
|---|---|---|---|---|
columns | Choice | optional | 3 | Number of columns; the number of entries should match it. Possible values: 2, 3, 4 |
layout | Choice | optional | cards (rendering) | Presentation: cards, minimal (without frames) or centered. Possible values: cards, minimal, centered |
items | List of entries | Required | empty | The entries of the grid in display order. |
items[].icon | Text | optional | no default | Name of the icon; unknown names fall back to a default icon. |
items[].title | Text | Required | no default | Title of the entry. |
items[].text | Text | Required | no default | Description text of the entry. |
On top of these come the common settings _style and columnsByBp.
Price anchor price-band
A single prominent price with benefit points and a button.
If the "price" field contains an amount, a price statement for search engines is generated from it as well. So only enter prices there that really apply on the page.
- In the editor
- Basics
- Page structure
- Inline
- Settings
- 11
| Setting | Type | Required | Default | Meaning |
|---|---|---|---|---|
price | Text | Required | no default | The price, set large. |
eyebrow | Text | optional | no default | Short line above the price. |
unit | Text | optional | no default | Suffix after the price, for example per month. |
note | Text | optional | no default | Footnote below the price, for example about VAT. |
bullets | List of texts | optional | empty | Benefit points below the price. |
button | Group | optional | no default | Primary button next to the price. |
button.text | Text | Required | no default | Label of the button. |
button.url | Text | Required | no default | Target of the button as a path or full address. |
secondary | Group | optional | no default | Second, less prominent button. |
secondary.text | Text | Required | no default | Label of the button. |
secondary.url | Text | Required | no default | Target of the button as a path or full address. |
On top of these come the common settings _style.
Service list price-list
List of individual services with prices, in the style of a menu or treatment card.
- In the editor
- Basics
- Page structure
- Inline
- Settings
- 9
Maintenance
- Annual check
Visual inspection and report
- Small repair
Up to 30 minutes on site
Consulting
- Site survey
On-site appointment with report
credited against an order
| Setting | Type | Required | Default | Meaning |
|---|---|---|---|---|
title | Text | optional | Unsere Leistungen | Heading above the block. |
subtitle | Text | optional | no default | Short line below the heading. |
layout | Choice | optional | lines | Presentation of the rows: lines, dots (leader dots) or cards. Possible values: lines, dots, cards |
items | List of entries | Required | empty | The rows in display order. |
items[].group | Text | optional | no default | Section the row belongs to, for example starters. |
items[].title | Text | Required | no default | Name of the service. |
items[].text | Text | optional | no default | Short description of the service. |
items[].price | Text | optional | no default | Price of the service. |
items[].note | Text | optional | no default | Additional detail on the row, for example a duration. |
On top of these come the common settings _style.
FAQ faq
Frequently asked questions with answers; the block also supplies the page FAQPage schema.
All FAQ blocks of a page together produce one machine-readable question-and-answer block for search engines.
- In the editor
- Basics
- Page structure
- Section start
- Settings
- 3
| Setting | Type | Required | Default | Meaning |
|---|---|---|---|---|
items | List of entries | Required | empty | The questions and answers in display order. |
items[].question | Text | Required | no default | The question. |
items[].answer | Text | Required | no default | The answer to the question. |
On top of these come the common settings _style.
CTA promo
Closing call to action; it is rendered in the footer area of the page.
This block does not appear where it sits in the list: it is rendered into the footer area of the page. One per page is therefore enough.
- In the editor
- Basics
- Page structure
- Inline
- Settings
- 5
| Setting | Type | Required | Default | Meaning |
|---|---|---|---|---|
title | Text | Required | no default | Heading of the call to action. |
text | Text | Required | no default | One sentence that backs up the call to action. |
button_text | Text | Required | no default | Label of the button. |
button_url | Text | Required | no default | Target of the button. |
badge | Text | optional | no default | Short keyword shown as a chip above the heading. |
On top of these come the common settings _style.