---
title: "Full featured examples"
description: "These examples display all of the plugins available with TinyMCE Cloud premium subscriptions."
canonical_url: "https://www.tiny.cloud/docs/tinymce/5/full-featured/"
md_url: "https://www.tiny.cloud/docs/tinymce/5/full-featured/index.md"
version: "5"
last_updated: "2024-04-09T09:35:32Z"
tokens: 2573
---
Important This page documents TinyMCE 5. For new projects, Tiny recommends using the latest, most up-to-date version. [See TinyMCE 8 documentation](../../latest/).
# Full featured examples
## Full Featured: Including Premium Plugins
This example includes most of the available TinyMCE plugins, including plugins available on Tiny Cloud premium subscriptions. Please note, it includes [premium plugins](/tinymce/features/).
Want to try it for yourself ? [Get started with TinyMCE now on Cloud](/auth/signup/).
**Example**
```js
var useDarkMode = window.matchMedia('(prefers-color-scheme: dark)').matches;
tinymce.init({
selector: 'textarea#full-featured',
plugins: 'print preview powerpaste casechange importcss tinydrive searchreplace autolink autosave save directionality advcode visualblocks visualchars fullscreen image link media mediaembed template codesample table charmap hr pagebreak nonbreaking anchor toc insertdatetime advlist lists checklist wordcount tinymcespellchecker a11ychecker imagetools textpattern noneditable help formatpainter permanentpen pageembed charmap tinycomments mentions quickbars linkchecker emoticons advtable export',
tinydrive_token_provider: 'URL_TO_YOUR_TOKEN_PROVIDER',
tinydrive_dropbox_app_key: 'YOUR_DROPBOX_APP_KEY',
tinydrive_google_drive_key: 'YOUR_GOOGLE_DRIVE_KEY',
tinydrive_google_drive_client_id: 'YOUR_GOOGLE_DRIVE_CLIENT_ID',
mobile: {
plugins: 'print preview powerpaste casechange importcss tinydrive searchreplace autolink autosave save directionality advcode visualblocks visualchars fullscreen image link media mediaembed template codesample table charmap hr pagebreak nonbreaking anchor toc insertdatetime advlist lists checklist wordcount tinymcespellchecker a11ychecker textpattern noneditable help formatpainter pageembed charmap mentions quickbars linkchecker emoticons advtable'
},
menu: {
tc: {
title: 'Comments',
items: 'addcomment showcomments deleteallconversations'
}
},
menubar: 'file edit view insert format tools table tc help',
toolbar: 'undo redo | bold italic underline strikethrough | fontselect fontsizeselect formatselect | alignleft aligncenter alignright alignjustify | outdent indent | numlist bullist checklist | forecolor backcolor casechange permanentpen formatpainter removeformat | pagebreak | charmap emoticons | fullscreen preview save print | insertfile image media pageembed template link anchor codesample | a11ycheck ltr rtl | showcomments addcomment',
autosave_ask_before_unload: true,
autosave_interval: '30s',
autosave_prefix: '{path}{query}-{id}-',
autosave_restore_when_empty: false,
autosave_retention: '2m',
image_advtab: true,
link_list: [
{ title: 'My page 1', value: 'https://www.tiny.cloud' },
{ title: 'My page 2', value: 'http://www.moxiecode.com' }
],
image_list: [
{ title: 'My page 1', value: 'https://www.tiny.cloud' },
{ title: 'My page 2', value: 'http://www.moxiecode.com' }
],
image_class_list: [
{ title: 'None', value: '' },
{ title: 'Some class', value: 'class-name' }
],
importcss_append: true,
templates: [
{ title: 'New Table', description: 'creates a new table', content: '' },
{ title: 'Starting my story', description: 'A cure for writers block', content: 'Once upon a time...' },
{ title: 'New list with dates', description: 'New List with dates', content: '' }
],
template_cdate_format: '[Date Created (CDATE): %m/%d/%Y : %H:%M:%S]',
template_mdate_format: '[Date Modified (MDATE): %m/%d/%Y : %H:%M:%S]',
height: 600,
image_caption: true,
quickbars_selection_toolbar: 'bold italic | quicklink h2 h3 blockquote quickimage quicktable',
noneditable_noneditable_class: 'mceNonEditable',
toolbar_mode: 'sliding',
spellchecker_ignore_list: ['Ephox', 'Moxiecode'],
tinycomments_mode: 'embedded',
content_style: '.mymention{ color: gray; }',
contextmenu: 'link image imagetools table configurepermanentpen',
a11y_advanced_options: true,
skin: useDarkMode ? 'oxide-dark' : 'oxide',
content_css: useDarkMode ? 'dark' : 'default',
/*
The following settings require more configuration than shown here.
For information on configuring the mentions plugin, see:
https://www.tiny.cloud/docs/plugins/premium/mentions/.
*/
mentions_selector: '.mymention',
mentions_fetch: mentions_fetch,
mentions_menu_hover: mentions_menu_hover,
mentions_menu_complete: mentions_menu_complete,
mentions_select: mentions_select,
mentions_item_type: 'profile'
});
```
The following plugins are excluded from this example:
- [MoxieManager (Premium Plugin)](../moxiemanager/) — [**Tiny Drive**](../tinydrive-plugin/) included instead.
- [Autoresize](../autoresize/) — Resizes the editor to fit the content.
- [BBCode](../bbcode/) — Changes the markup used for the content.
- [Code](../code/) — [**Advanced Code Editor**](../advcode/) included instead.
- [Full Page](../fullpage/) — Used for modifying HTML `` elements.
- [Paste](../paste/) — [**PowerPaste**](../introduction-to-powerpaste/) included instead.
- [Spellchecker](../spellchecker/) — [**Spell Checker Pro**](../introduction-to-tiny-spellchecker/) included instead.
- [Tab Focus](../tabfocus/) — Changes the behavior of the TAB-key within the editor.
## Full Featured: Non-Premium Plugins
This example includes only non-premium plugins. These plugins are also used in the [Full Featured: Including Premium Plugins Demo above](#fullfeaturedincludingpremiumplugins).
**Example**
```js
var useDarkMode = window.matchMedia('(prefers-color-scheme: dark)').matches;
tinymce.init({
selector: 'textarea#open-source-plugins',
plugins: 'print preview paste importcss searchreplace autolink autosave save directionality code visualblocks visualchars fullscreen image link media template codesample table charmap hr pagebreak nonbreaking anchor toc insertdatetime advlist lists wordcount imagetools textpattern noneditable help charmap quickbars emoticons',
imagetools_cors_hosts: ['picsum.photos'],
menubar: 'file edit view insert format tools table help',
toolbar: 'undo redo | bold italic underline strikethrough | fontselect fontsizeselect formatselect | alignleft aligncenter alignright alignjustify | outdent indent | numlist bullist | forecolor backcolor removeformat | pagebreak | charmap emoticons | fullscreen preview save print | insertfile image media template link anchor codesample | ltr rtl',
toolbar_sticky: true,
autosave_ask_before_unload: true,
autosave_interval: '30s',
autosave_prefix: '{path}{query}-{id}-',
autosave_restore_when_empty: false,
autosave_retention: '2m',
image_advtab: true,
link_list: [
{ title: 'My page 1', value: 'https://www.tiny.cloud' },
{ title: 'My page 2', value: 'http://www.moxiecode.com' }
],
image_list: [
{ title: 'My page 1', value: 'https://www.tiny.cloud' },
{ title: 'My page 2', value: 'http://www.moxiecode.com' }
],
image_class_list: [
{ title: 'None', value: '' },
{ title: 'Some class', value: 'class-name' }
],
importcss_append: true,
file_picker_callback: function (callback, value, meta) {
/* Provide file and text for the link dialog */
if (meta.filetype === 'file') {
callback('https://www.google.com/logos/google.jpg', { text: 'My text' });
}
/* Provide image and alt text for the image dialog */
if (meta.filetype === 'image') {
callback('https://www.google.com/logos/google.jpg', { alt: 'My alt text' });
}
/* Provide alternative source and posted for the media dialog */
if (meta.filetype === 'media') {
callback('movie.mp4', { source2: 'alt.ogg', poster: 'https://www.google.com/logos/google.jpg' });
}
},
templates: [
{ title: 'New Table', description: 'creates a new table', content: '' },
{ title: 'Starting my story', description: 'A cure for writers block', content: 'Once upon a time...' },
{ title: 'New list with dates', description: 'New List with dates', content: '' }
],
template_cdate_format: '[Date Created (CDATE): %m/%d/%Y : %H:%M:%S]',
template_mdate_format: '[Date Modified (MDATE): %m/%d/%Y : %H:%M:%S]',
height: 600,
image_caption: true,
quickbars_selection_toolbar: 'bold italic | quicklink h2 h3 blockquote quickimage quicktable',
noneditable_noneditable_class: 'mceNonEditable',
toolbar_mode: 'sliding',
contextmenu: 'link image imagetools table',
skin: useDarkMode ? 'oxide-dark' : 'oxide',
content_css: useDarkMode ? 'dark' : 'default',
content_style: 'body { font-family:Helvetica,Arial,sans-serif; font-size:14px }'
});
```
The following plugins are excluded from this example:
- [All premium plugins](/tinymce/features/).
- [Autoresize](../autoresize/) — Resizes the editor to fit the content.
- [BBCode](../bbcode/) — Changes the markup used for the content.
- [Full Page](../fullpage/) — Used for modifying HTML `` elements.
- [Spellchecker](../spellchecker/) — Requires Server-Side components, see: [Check spelling in TinyMCE](../spell-checking/).
- [Tab Focus](../tabfocus/) — Changes the behavior of the TAB-key within the editor.