TinyMCE inlite editing mode

Theme that renders a lightweight UI for inline editing.

Contribute to this page

The Distraction-free theme renders the editor in lightweight inline mode. This mode provides options to quickly insert links, images, and tables into the content. For a sample view of this mode, see the Distraction-free Editor example page.

The inlite plugin renders the editor in lightweight inline mode. The current default theme is Classic. This is an optional, even more, lightweight distraction-free UI for the editor.

Example:
tinymce.init({
    selector: "div.tinymce",
    plugins: [ 'inlite' ],
    toolbar: false,
    menubar: false,
    inline: true
});

Theme specific controls

quicklink

The quicklink quickly inserts and edits link inline.

Example:
tinymce.init({
    selector: "div.tinymce",
    plugins: [ 'inlite' ],
    toolbar: false,
    menubar: false,
    inline: true,
    inlite_selection_toolbar: 'bold italic | quicklink h2 h3 blockquote'
});

quickimage

quickimage inserts images from the local machine into the editor. These can be automatically uploaded by configuring image uploading.

Example:
tinymce.init({
    selector: "div.tinymce",
    plugins: [ 'inlite' ],
    toolbar: false,
    menubar: false,
    inline: true,
    inlite_insert_toolbar: 'quickimage quicktable'
});

quicktable

quicktable quickly inserts a 2x2 table with 100% width.

Example:
tinymce.init({
    selector: "div.tinymce",
    plugins: [ 'inlite' ],
    toolbar: false,
    menubar: false,
    inline: true,
    inlite_insert_toolbar: 'quickimage quicktable'
});

Related configuration options

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.