Headings

Turn paragraphs into headings to break up a long post. They are saved as <h1>-<h4>, so search engines and screen readers see the structure.

createEditor('#editor', {
  toolbar: 'heading | bold italic | bulletList',
});

How to change a paragraph

• The heading menu offers Paragraph, Heading 1, Heading 2, Heading 3 and Quote. Its label shows the format at the caret.
• Ctrl+Alt+1-4 for headings 1-4, Ctrl+Alt+0 for a paragraph. Pressing the same heading key again turns it back into a paragraph.
• At the start of an empty line, type # to #### (Markdown input).
• Backspace at the very start of a heading turns it into a paragraph and keeps the text.
• Enter at the end of a heading starts a normal paragraph.

Heading 4 is not in the menu: use the shortcut or Markdown input. A selection over several paragraphs changes them all. Headings also work inside list items and table cells.

Presets and phones

heading is on the first row of the basic, board (default) and full presets, not in minimal. It is near the front of the phone toolbar too.

Saved HTML

<h2>Getting here</h2>
<p>Put the caret …</p>
<h3>Opening hours</h3>

Inserting a table of contents (toc) gives headings an id; see Bookmarks and TOC. The a11y check points out skipped levels, such as a heading 4 straight after a heading 2.

API

editor.exec('h2');          // heading 2 (again: back to paragraph)
editor.exec('paragraph');
editor.exec('block', 'h3'); // what the menu runs

Options