Text blocks

Heading block

Headings are used to structure your content. When adding this block select the appropriate heading level. In article templates you can use h2 up to h6. On the homepage a h1 can also be used.

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Headings are used in a specific order, on article templates the h1 is reserved for the page title, so you will always start with adding a h2. If the structure of the text requires further subdivision then use a h3.

Don’t skip levels, for example a h4 after a h2. Don’t use headings for ‘design’ reasons or in full caps because you might think this text is extra important and really needs to be read, this is just bad practice. A proper page structure helps readers and search engines to understand your page.

Text block

This is the standard WYSIWYG editor field for inline content with formatting for:
bold, italic, code link and email.

Superscript and subscript

At the moment of writing, this block doesn’t support the use of subscript or superscript. Untill supported, I’ve added these options with a text replacement:

  • Use a tilde ~ just before a character for subscript: H2O
  • Use a caret ^ for superscript: 100m2

List block

A WYSIWYG editor field for ordered and unordered lists. When a list is placed after a paragraph the whitespace above the list can be removed and an expanded line height can be used.

Unordered list

After a paragraph of text one line of white space is added, the list underneath has this white space removed which is an option in the block settings.

  • An unordered list item
  • An unordered list item
    • Use the tab key to add a nested unordered list
    • Use the tab key to add a nested unordered list
  • An unordered list item

Ordered list

The list items of this list have extra margin, before and after, applied:

  1. An ordered list item.
  2. An ordered list item.
    1. Use the tab key to add a nested ordered list.
    2. Use the tab key to add a nested ordered list.
  3. An unordered list item.

Quote block

“You forget what you want to remember, and you remember what you want to forget”

Cormac McCarthy, The Road

Line block

This block creates a hr element or horizontal rule and represents a thematic break. For example a change in a story, or a transition to another topic:


Code block

h2 {
  border-top: 4px solid var(--color);
}