Provides Headings Blocks for the Editor.js.

Get the package

yarn add @editorjs/header

Include module at your application

import Header from '@editorjs/header';

Optionally, you can load this tool from CDN JsDelivr CDN

Add a new Tool to the tools property of the Editor.js initial config.

var editor = EditorJS({ ... tools: { ... header: Header, }, ... });

You can insert this Block by a useful shortcut. Set it up with the tools[].shortcut property of the Editor's initial config.

var editor = EditorJS({ ... tools: { ... header: { class: Header, shortcut: 'CMD+SHIFT+H', }, }, ... });

All properties are optional.

var editor = EditorJS({ ... tools: { ... header: { class: Header, config: { placeholder: 'Enter a header', levels: [2, 3, 4], defaultLevel: 3 } } } ... });

You can select one of six levels for heading.

{ "type": "header", "data": { "text": "Why Telegram is the best messenger", "level": 2 } }