Options for customizing the editor’s statusbar

The options listed on this page affect the TinyMCE statusbar. The statusbar option can be used to remove the statusbar from the editor.

statusbar

This option allows you to specify whether TinyMCE should display the status bar at the bottom of the editor.

The statusbar includes the elementpath, wordcount and editor resize.

To disable the status bar, the statusbar option should be provided with a boolean false value.

Type: Boolean

Default value: true

Possible values: true, false

Example: using statusbar

tinymce.init({
  selector: 'textarea',  // change this value according to your HTML
  statusbar: false
});

Statusbar feature options

The options affecting the features of the statusbar are listed below in the order the appear on the editor from left to right.

elementpath

This option allows you to disable the element path within the status bar at the bottom of the editor.

The element path shows the selected element and the parent elements. Clicking an element on the element path will select the element in the editor.

For example: If a paragraph element within a table is selected, the element path will show table > tbody > tr > td > p.

Selecting elements from the element path allows users to perform operations on blocks, such as applying formatting or copying an entire block.

Type: Boolean

Default value: true

Possible values: true, false

Example: using elementpath

tinymce.init({
  selector: 'textarea',  // change this value according to your HTML
  elementpath: false
});

Word Count

TinyMCE can be configured to show the current word count in the statusbar. For information on configuring the word count feature, see: The Word Count plugin.

branding

Use the branding option to disable the "Powered by Tiny" link displayed in the status bar for product attribution.

Product attribution is required for free users utilizing the Tiny Cloud infrastructure. If using TinyMCE under the MIT license, then support for the open source project would be appreciated by keeping attribution turned on in your editor. For information on TinyMCE attribution requirements, see: Logo & attribution requirements.

Type: Boolean

Default value: true

Possible values: true, false

Example: using branding

tinymce.init({
  selector: 'textarea',  // change this value according to your HTML
  branding: false
});

resize

This option allows the resize handle to be disabled or to set the resize handler to resize both horizontally and vertically. The option can be true, false or the string 'both'. False disables resizing, true enables vertical resizing only, 'both' makes it possible to resize in both directions horizontal and vertical.

When resizing is enabled, the editor can be resized by either:

  • Clicking and dragging the resize handle in the bottom right-hand corner of the editor.

  • Focusing the resize handle, and using the arrow keys. The Up Arrow and Left Arrow keys will make the editor smaller, and the Down Arrow and Right Arrow keys will make the editor larger.

Type: Boolean or String

Default value: true

Possible values: true, false, 'both'

The default value for this option is different for mobile devices. For information on the default mobile option, see: TinyMCE Mobile — Configuration options with mobile defaults.

Example: disabling editor resizing

tinymce.init({
  selector: 'textarea',  // change this value according to your HTML
  resize: false
});

Example: enabling vertical and horizontal editor resizing

tinymce.init({
  selector: 'textarea',  // change this value according to your HTML
  resize: 'both'
});