Lists plugin
The lists
plugin allows you to add numbered and bulleted lists to TinyMCE. To enable advanced lists (e.g. alpha numbered lists, square bullets) you should also enable the Advanced List (advlist
) plugin.
The plugin also normalizes list behavior between browsers. Enable it if you have problems with consistency making lists.
Basic setup
tinymce.init({
selector: 'textarea', // change this value according to your HTML
plugins: 'lists',
toolbar: 'numlist bullist'
});
Options
Toolbar buttons
The Lists plugin provides the following toolbar buttons:
Toolbar button identifier | Description |
---|---|
|
Formats the current selection as a bullet list. |
|
Formats the current selection as a numbered list. |
These toolbar buttons can be added to the editor using:
-
The
toolbar
configuration option. -
The
quickbars_insert_toolbar
configuration option.
Commands
The Lists plugin provides the following TinyMCE commands.
Command | Description |
---|---|
InsertDefinitionList |
Inserts a definition list into the editor. |
InsertOrderedList |
Inserts an ordered list into the editor. |
InsertUnorderedList |
Inserts an unordered list into the editor. |
RemoveList |
Removes the list elements from the selection. |
tinymce.activeEditor.execCommand('InsertDefinitionList', false, {
'list-item-attributes': {class: 'mylistitemclass'},
'list-attributes': {id: 'mylist'}
});
tinymce.activeEditor.execCommand('InsertOrderedList', false, {
'list-style-type': 'decimal',
'list-item-attributes': {class: 'mylistitemclass'},
'list-attributes': {id: 'mylist'}
});
tinymce.activeEditor.execCommand('InsertUnorderedList', false, {
'list-style-type': 'disc',
'list-item-attributes': {class: 'mylistitemclass'},
'list-attributes': {id: 'mylist'}
});
tinymce.activeEditor.execCommand('RemoveList');