TinyMCE Configuration

Configure the TinyMCE editor through the Combo plugin.

TinyMCE Configuration Options

The tinymce section in your config.yml file controls the TinyMCE editor:

1tinymce:
2  block_formats:           # Block formats in the format dropdown
3    - 'Paragraph=p'
4    - 'Heading 2=h2'
5    - 'Heading 3=h3'
6    - 'Heading 4=h4'
7  style_formats:           # Custom style formats
8    - title: 'Buttons'
9      items:
10        - title: 'Primary Button'
11          selector: 'a'
12          classes: 'btn btn-primary'
13        - title: 'Secondary Button'
14          selector: 'a'
15          classes: 'btn btn-secondary'
16    - title: 'Inline'
17      items:
18        - title: 'Bold'
19          icon: 'bold'
20          format: 'bold'
21        - title: 'Highlight'
22          inline: 'span'
23          classes: 'highlight'
24  toolbar1:                # First toolbar row
25    - 'formatselect'
26    - 'bold'
27    - 'italic'
28    - 'bullist'
29    - 'numlist'
30    - 'link'
31    - 'unlink'
32  toolbar2:                # Second toolbar row
33    - 'styleselect'
34    - 'alignleft'
35    - 'aligncenter'
36    - 'alignright'
37    - 'removeformat'
38  plugins:                 # TinyMCE plugins to enable
39    - 'charmap'
40    - 'hr'
41    - 'link'
42    - 'lists'
43    - 'paste'
44    - 'tabfocus'
45    - 'textcolor'
46    - 'wordpress'
47    - 'wpautoresize'
48    - 'wpeditimage'
49    - 'wpemoji'
50    - 'wpgallery'
51    - 'wplink'
52    - 'wpdialogs'
53    - 'wptextpattern'
54    - 'wpview'

Block Formats

block_formats

Controls the block formats available in the format dropdown. Each format is specified as 'Label=tag'.

1tinymce:
2  block_formats:
3    - 'Paragraph=p'
4    - 'Heading 2=h2'
5    - 'Heading 3=h3'
6    - 'Heading 4=h4'
7    - 'Blockquote=blockquote'
8    - 'Preformatted=pre'

Style Formats

style_formats

Defines custom style formats for the styles dropdown. You can create groups of styles and individual styles.

1tinymce:
2  style_formats:
3    - title: 'Buttons'
4      items:
5        - title: 'Primary Button'
6          selector: 'a'
7          classes: 'btn btn-primary'
8        - title: 'Secondary Button'
9          selector: 'a'
10          classes: 'btn btn-secondary'
11    - title: 'Inline'
12      items:
13        - title: 'Bold'
14          icon: 'bold'
15          format: 'bold'
16        - title: 'Highlight'
17          inline: 'span'
18          classes: 'highlight'
19    - title: 'Blocks'
20      items:
21        - title: 'Note Box'
22          block: 'div'
23          classes: 'note-box'
24          wrapper: true

Each style format can have the following parameters:

title: The name of the style
selector: The element selector (for existing elements)
inline: The inline element to create
block: The block element to create
classes: CSS classes to apply
styles: Inline styles to apply
format: Predefined format to apply
wrapper: Whether to wrap the selection
icon: Icon to display in the menu

Toolbars

toolbar1 and toolbar2

Define the buttons to display in the TinyMCE toolbars. You can have up to four toolbars (toolbar1, toolbar2, toolbar3, toolbar4).

1tinymce:
2  toolbar1:
3    - 'formatselect'
4    - 'bold'
5    - 'italic'
6    - 'bullist'
7    - 'numlist'
8    - 'link'
9    - 'unlink'
10  toolbar2:
11    - 'styleselect'
12    - 'alignleft'
13    - 'aligncenter'
14    - 'alignright'
15    - 'removeformat'

Common toolbar buttons:

formatselect: Block format dropdown
styleselect: Style formats dropdown
bold: Bold text
italic: Italic text
underline: Underline text
bullist: Bullet list
numlist: Numbered list
link: Insert/edit link
unlink: Remove link
alignleft: Align left
aligncenter: Align center
alignright: Align right
removeformat: Remove formatting

Plugins

plugins

Specifies which TinyMCE plugins to enable. Plugins add functionality to the editor.

1tinymce:
2  plugins:
3    - 'charmap'
4    - 'hr'
5    - 'link'
6    - 'lists'
7    - 'paste'
8    - 'tabfocus'
9    - 'textcolor'
10    - 'wordpress'
11    - 'wpautoresize'
12    - 'wpeditimage'
13    - 'wpemoji'
14    - 'wpgallery'
15    - 'wplink'
16    - 'wpdialogs'
17    - 'wptextpattern'
18    - 'wpview'

Common plugins:

charmap: Character map
hr: Horizontal rule
link: Insert/edit link
lists: List management
paste: Paste handling
textcolor: Text color
wordpress: WordPress integration
wpautoresize: Auto resize editor
wpeditimage: Edit images
wpgallery: WordPress gallery

← Search Configuration Gutenberg Configuration →