Preview plugin

This plugin adds a preview button to the toolbar. Pressing the button opens a dialog box showing the current content in a preview mode. It also adds a menu item Preview under the File and View menu dropdowns.

Basic setup

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

Toolbar buttons

The Preview plugin provides the following toolbar buttons:

Toolbar button identifier Description

preview

Previews the current editor contents.

These toolbar buttons can be added to the editor using:

The Preview plugin provides the following menu items:

Menu item identifier Default Menu Location Description

preview

File

Previews the current document.

These menu items can be added to the editor using:

Commands

The Preview plugin provides the following TinyMCE command.

Command Description

mcePreview

Displays a preview of the editor contents.
Example
tinymce.activeEditor.execCommand('mcePreview');