Preview plugin
Shows a popup of the current content in read-only format.
Contribute to this pageThis 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',
menubar: 'view',
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
toolbar
configuration option. - The
quickbars_insert_toolbar
configuration option. - Custom Context toolbars.
Menu items
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:
- The
menu
configuration option. - The
contextmenu
configuration option. - Custom Menu toolbar buttons.
Commands
The Preview plugin provides the following JavaScript command.
Command | Description |
---|---|
mcePreview | Displays a preview of the editor contents. |
Example
tinymce.activeEditor.execCommand('mcePreview');
Was this article helpful? Yes - No
Well, that's awkward . Would you mind opening an issue or helping us out?
Thanks for the feedback!
Can't find what you're looking for? Let us know.
Except as otherwise noted, the content of this page is licensed under the Creative Commons BY-NC-SA 3.0 License, and code samples are licensed under the Apache 2.0 License.