Multiple headings in the toolbox

[Vinze]

On the homepage of Editor.js you can see multiple levels of headings in the screenshot, see:

But after installing Editor.js and the header plugin I only have one "Heading" item in the toolbox. I found the following pull request but I guess this isn't merged into the default branch? When simply doing a npm i --save @editorjs/header I get the following:

How do I enable this feature?

[nhuanhoangduc]

Try creating a custom Header class

class CustomHeader extends Header {
  static get toolbox() {
    return [
      {
        icon: IconH1,
        title: 'Heading 1',
        data: {
          level: 1,
        },
      },
      {
        icon: IconH2,
        title: 'Heading 2',
        data: {
          level: 2,
        },
      },
      {
        icon: IconH3,
        title: 'Heading 3',
        data: {
          level: 3,
        },
      },
    ]
  }
}

[trig79]

this worked for me, depending on where you extend you may need to import the icons: import {IconH1, IconH2, IconH3} from '@codexteam/icons'

[Vinze]

That seems to work, thank you!

Would be nice be able to configure this through an configuration option.

[TatianaFomina]

That seems to work, thank you!

Would be nice be able to configure this through an configuration option.

There is such ability, read official article for more info 👉 https://codex.so/editorjs-toolbox