Customize the Rich-Text Editor Toolbar

After adding a large text field to the asset type and setting the appearance to rich-text editor, you can create a custom toolbar.

The toolbar is prepopulated with the standard toolbar groups and options, and you see a preview of it.

To customize the toolbar, click the JSON tab, and edit the JSON configuration using syntax like the following examples.

The large text field supports the following actions and groups:

Actions: Anchor, BGColor, Blockquote, Bold, BulletedList, Copy, Cut, Font, FontSize, Format, HorizontalRule, Image, Indent, Italic, JustifyBlock, JustifyCenter, JustifyLeft, JustifyRight, Link, Maximize, NumberedList, Outdent, Paste, PasteText, Redo, RemoveFormat, Source, Strike, Subscript, Superscript, Table, TextColor, Underline, Undo, Unlink

Groups:

• basicstyles—Bold, Italic, Underline, Strike, Subscript, Superscript
• styles—Format, Font, FontSize
• clipboard—Cut, Copy, Paste, PasteText
• colors—TextColor, BGColor
• undo—Undo, Redo
• links—Link, Unlink, Anchor
• paragraph—
  • list—BulletedList, NumberedList
  • indent—Outdent, Indent
  • blocks—Blockquote
• align—JustifyLeft, JustifyBlock, JustifyRight, JustifyCenter
• insert—
  • image—Image
  • table—Table
  • horizontalrule—HorizontalRule
• mode—Source
• tools—Maximize (full screen view)
• cleanup—RemoveFormat

In addition, you can use the row separator entry: "/"

Note:

If you set any other value in the toolbarGroup configuration, the value will be removed before the Content Editor toolbar is created. You can't provide extraPlugins. Also, if the toolbarGroups configuration is used, "name"/"groups" is supported, but if the toolbar configuration is used, then "name"/"items" is supported.

You can use either toolbarGroups and removeButtons, or toolbar for the properties. See the examples below.

Example 23-1 Option 1: "toolbarGroups" and "removeButtons"

{
	"toolbarGroups": [
		{"name": "basicstyles"},
		{"name": "styles"},
		{"name": "colors"},
		{"name": "clipboard"},
		"/",
		{"name": "links"},
		{"name": "insert"},
		{"name": "paragraph", "groups": ["list", "indent"]},
		{"name": "align"},
		{"name": "undo"},
		{"name": "cleanup"},
		{"name": "mode"},
		{"name": "tools"} 
	], 
	"removeButtons": "Subscript, Superscript, Anchor, Copy, Cut" 
}

Example 23-2 Option 2: "toolbar"

{
	"toolbar": [ 
		{"name": "basicstyles", "items": ["Bold", "Italic", "Underline", "Strike", "Subscript", "Superscript", "-", "RemoveFormat"]},
		{"name": "paragraph", "items": ["NumberedList", "BulletedList", "-", "Outdent", "Indent", "-", "JustifyLeft", "JustifyCenter", "JustifyRight", "JustifyBlock"]},
		{"name": "links", "items": ["Link", "Unlink", "Anchor"]},
		{"name": "insert", "items": ["Image", "Table"]},
		"/",
		{"name": "styles", "items": [Format", "Font", "FontSize"]},
		{"name": "colors", "items": ["TextColor", "BGColor"]},
		{"name": "tools", "items": ["Maximize"]}
	]
}