Headings introduce and order the segments on a page. On a website with many pages, each level should have similar importance.

Syntax

Markdown headings are preceded by number signs # and a space. The six available headings are associated with the following meaning in Perplex:

  1. # Page TitleNot needed on standard Perplex pages!

  2. ## Section Heading

  3. ### Subsection Heading

  4. #### Sub-Subsection Heading

  5. ##### Paragraph Heading

  6. ###### Small Paragraph Heading

Usually we don’t want to apply the full hierarchy on moderate sized pages, because too much structure is confusing. For an appropriate layout, it may be desirable to skip one or two levels and use paragraph headings inside of sections for example.

But this is against recommended HTML guidelines. Headings should be used strictly in their descending order, because screen readers and other automatic interpreters get confused otherwise. To follow this recommendation we need to skip headings visually.

Another variation of their style is to highlight them. Its an easy way to inform readers about especially important text segments.

For these style variations Perplex offers Markdown attributes.

Paragraph Headings

We can style any heading like a paragraph heading with the attribute {.h-p}. For the probably rare occasions we need to style a heading as a small paragraph heading we need an additional attribute: {.h-p .h-p-s}.

Special Headings

To highlight some warning, an important information or tip, we have the attributes {.h-warn}, {.h-info} or {.h-tip}.

A warning paragraph for example starts with a heading like this:

##### Warning Paragraph {.h-warn}
Far far away, behind the word mountains, far from the countries Vokalia and…

Linebreak for Headings

There is one problem, we can’t solve directly with Markdown, attributes or even a shortcode. Sometimes we want to force a linebreak in long headings, when the usual line length on larger screens breaks them at an unfortunate place.

In this case we can use the replacement {‍/} like this:

### A long subsection heading about a very complex topic{‍/}exceeding the line length

Beware

This special linebreak replacement is only needed in headings or titles, because they can’t be wrapped in Markdown. Otherwise Markdown can handle them.

Layout

Headings are not only recognized by their font styling but also by the white-space surrounding them. That’s why the following examples are shown in the way they usually appear: In front and in between some text.


Page Title

If the page already has a title, the first heading should not occur in the Markdown content. Like many themes Perplex provides titles for all pages.

We still may need the first heading on special pages without a title section, when we want to compose a title in the Markdown content.

Section Heading

Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts. Separated they live in Bookmarksgrove right at the coast of the Semantics, a large language ocean. A small river named Duden flows by their place and supplies it with the necessary regelialia.

Subsection Heading

Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts. Separated they live in Bookmarksgrove right at the coast of the Semantics, a large language ocean. A small river named Duden flows by their place and supplies it with the necessary regelialia.

A long subsection heading about a very complex topic exceeding the line length

Because of the line break before the last word this heading looks quite bad on larger screens. We can correct this with the replacement {‍/}:

Another subsection heading about a very complex topic
exceeding the line length

The inserted <br>-tag gets disabled on small screens, because it would make things even worse there for long headings.

Sub-Subsection Heading

Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts. Separated they live in Bookmarksgrove right at the coast of the Semantics, a large language ocean. A small river named Duden flows by their place and supplies it with the necessary regelialia.

Styled Paragraph Heading

Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts. Separated they live in Bookmarksgrove right at the coast of the Semantics, a large language ocean. A small river named Duden flows by their place and supplies it with the necessary regelialia.

Warning Paragraph

Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts. Separated they live in Bookmarksgrove right at the coast of the Semantics, a large language ocean. A small river named Duden flows by their place and supplies it with the necessary regelialia.

Info Paragraph

Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts. Separated they live in Bookmarksgrove right at the coast of the Semantics, a large language ocean. A small river named Duden flows by their place and supplies it with the necessary regelialia.

Tip Paragraph

Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts. Separated they live in Bookmarksgrove right at the coast of the Semantics, a large language ocean. A small river named Duden flows by their place and supplies it with the necessary regelialia.

Small Paragraph Heading

Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts. Separated they live in Bookmarksgrove right at the coast of the Semantics, a large language ocean. A small river named Duden flows by their place and supplies it with the necessary regelialia.