How to remove default option in toolbar of react-draft-wysiwyg?

Viewed 7092

enter image description here

According my question, I want to remove some default toolbar option like a font family or emoji and remain only text style options. How to do that ?

For my editor.

<Editor
    editorState={editorState}
    wrapperClassName="demo-wrapper"
    onEditorStateChange={this.onEditorStateChange}
    toolbar={{
        inline: { inDropdown: true },
        list: { inDropdown: true },
        textAlign: { inDropdown: true },
        link: { inDropdown: true },
        history: { inDropdown: true },
    }}
/>
1 Answers

Pass an array named options containing all options you need in the toolbar property. Here is an array with all available options:

options: ['inline', 'blockType', 'fontSize', 'fontFamily', 'list', 'textAlign', 'colorPicker', 'link', 'embedded', 'emoji', 'image', 'remove', 'history']

And here is example containing only text style options and without font family

<Editor
    editorState={editorState}
    wrapperClassName="demo-wrapper"
    onEditorStateChange={this.onEditorStateChange}
    toolbar={{
        options: ['inline', 'blockType', 'fontSize', 'list', 'textAlign', 'history'],
        inline: { inDropdown: true },
        list: { inDropdown: true },
        textAlign: { inDropdown: true },
        link: { inDropdown: true },
        history: { inDropdown: true },
    }}
/>

For more information see: https://jpuri.github.io/react-draft-wysiwyg/#/docs

Related