Configuring system properties for TinyMCE HTML editor
Summarize
Summary of Configuring System Properties for TinyMCE HTML Editor
This guide provides information on configuring various system properties for the TinyMCE HTML editor in ServiceNow. These properties enable customization of the editor's behavior, ensuring it meets specific needs for rich text editing in your applications.
Show less
Key Features
- Valid Plugins: Control which client-side plugins can be added using
glide.ui.html.editor.validpluginsand enable specific plugins withglide.ui.html.editor.enabledplugins. - Toolbar Configuration: Define valid toolbar buttons with
glide.ui.html.editor.toolbar.validbuttonsand configure the toolbar itself usingglide.ui.html.editor.toolbar. - Paste Behavior: Customize how pasted content is handled from different sources, including Microsoft Word, using
glide.ui.html.editor.paste.htmlimportandglide.ui.html.editor.paste.wordimport. - Font Collection: Specify available font options for users via
glide.ui.html.editor.font.collection. - Inline Element Filtering: Manage which inline elements are filtered when pasting content with
glide.ui.html.editor.paste.filteredinlineelements. - URL Configuration: Set the URL handling behavior with
glide.ui.html.editor.converturlsandglide.ui.html.editor.relativeurls. - Context Menu: Customize the editor’s context menu options through
glide.ui.html.editor.contextmenu. - Toolbar Visibility: Control the visibility of the toolbar when focusing out of the editor using
glide.ui.html.editor.toolbar.on.focus.
Key Outcomes
By configuring these system properties, ServiceNow customers can enhance the usability of the TinyMCE editor, ensuring a more tailored and efficient editing experience. This allows for better content management, improved formatting options, and a consistent user interface that aligns with organizational standards.
There are multiple system properties that are used to configure the behaviour of the HTML editor field type. Learn about the system properties available in the TinyMCE rich text editor.
| System properties for TinyMCE HTML editor | Type | Description |
|---|---|---|
| glide.ui.html.editor.valid_plugins | String |
Client-side HTML editor plugins that CAN BE added/or used (spaced delimited).
Important: Removing plugins could cause undesirable side-effects. |
| glide.ui.html.editor.enabled_plugins | String |
Client-side HTML editor plugins that should be added (spaced delimited) in order for them to get enabled on the widget. Only plugins added in glide.ui.html.editor.valid_plugins can be added. Removing plugins could cause undesirable side-effects. |
| glide.ui.html.editor.toolbar.valid_buttons | String |
A valid (supported) button list for html fields. Use this to limit what buttons CAN BE added to the toolbar. |
| glide.ui.html.editor.toolbar | String |
Configures the editing toolbar for HTML fields. This is a space-separated list without commas. Only valid buttons added in glide.ui.html.editor.toolbar.valid_buttons can be added. |
| glide.ui.html.editor.paste.html_import | Choice list |
Paste formatting behavior for HTML. This setting controls how content from sources other than Microsoft Word is filtered when being pasted on html-editor. Note that this includes content copied from TinyMCE itself. The
supported values are:
|
| glide.ui.html.editor.paste.word_import | Choice list |
Paste formatting behavior for word. This setting controls how content from Microsoft Word is filtered when being pasted on html-editor. Note that this includes content copied from TinyMCE itself. The supported values are:
|
| glide.ui.html.editor.font.collection | String |
User can select different font collection for Tiny MCE HTML editor: Example with one font:
Note:
More than one font value should be separated by a semi-colon with no space or line-break. Example with more than one font:
|
| glide.ui.html.editor.paste.filtered_inline_elements | String | This setting allows the content to be filtered when pasted from MS Word to the TinyMCE V6 editor. This property takes input as a comma separated string of inline elements to be filtered by selecting the Remove formatting button on the paste prompt dialog. Default value is 'strong, b'. |
| glide.ui.html.editor.convert_urls | True | False | This system property is used to set the convert_urls config of TinyMCE. Default: false. Note: This is related to the value of relative_urls which itself is set by glide.ui.html.editor.relative_urls. |
| glide.ui.html.editor.extended_valid_elements | String | This system property is used to set the extended_valid_elements config of TinyMCE. Default: <Empty string>. |
| glide.ui.html.editor.relative_urls | True | False | glide.ui.html.editor.relative_urls is used to set the relative_urls config of TinyMCE. Default: true. Note: This is related to the document_base_url which is not configurable in ServiceNow and is set to the window.location.origin (the base url of the instance). |
| glide.ui.html.editor.contextmenu | String |
Client-side HTML editor has its own context menu, overriding the browser's. Holding Ctrl while right-clicking bypasses the editor's context menu to show the native context menu. This property specifies which context menu options are available. Default value is "link image table" (without quotes). A value of "false" (without quotes) disables the editor's context menu. |
| glide.ui.html.editor.toolbar.on.focus | String |
True: User should be able to see hide toolbar behaviour if they move focus out. False: User should always see the toolbar regardless of the tab focus. Note:
This property isn't added OOTB (out of the box) but can be added by an admin. |
| glide.ui.html.editor.default_link_target | This system property is used to set link_default_target. |