TinyMCE in UI Page is missing tools from toolbar

Robert Beeman
Kilo Sage

We have an old (but heavily utilized) UI Page with TinyMCE loaded on a textarea. It works fine, but some of the tools aren't showing up in the toolbar even though they are specified in the init. Our users are specifically requesting the Link button. In my personal developer instance, I made a very basic UI Page for troubleshooting this, and I cannot figure out why they aren't there.

Sample UI Page HTML:

<?xml version="1.0" encoding="utf-8" ?>
<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">
	
	<script>
	
	<script>
	   tinymce.init({
	   mode : "specific_textareas",
	   editor_selector : "mceEditor",
	   width: '100%',
	   height: '300px',
	   menubar: "tools",
	   toolbar: "$[gs.getProperty('glide.ui.html.editor.v4.toolbar.line1')]",
	   content_css : "* {font: 10px arial, sans-serif;} b {font-weight:bold;} th {font-weight:bold;} strong {font-weight:bold;}",
	   });
	</script>
	
	<textarea cols="60" rows="10" id="textfield" name="textfield" class="mceEditor"></textarea>
	
</j:jelly>

That first <script> on line 4 is being removed for some reason. It was supposed to be loading 'tinymce.full.jsx' from '/scripts/tinymce4_4_3/'


'glide.ui.html.editor.v4.toolbar.line1' System Property value:

bold,italic,underline,undo,redo,|,fontselect,fontsizeselect,table,|,forecolor,backcolor,link,unlink,|,image,media,code,|,alignleft,aligncenter,alignright,|,bullist,numlist,fullscreen


Resultant UI Page:
find_real_file.png

It looks like table, forecolor, backcolor, link, unlink, image, media, code, and fullscreen are all missing. Does anyone know what is going on? Thank you for your help with this!

16 REPLIES 16

AmanG
ServiceNow Employee
ServiceNow Employee

What is the sys_property glide.ui.html.editor pointing to? 

Its value is 'tinymce'

find_real_file.png

AmanG
ServiceNow Employee
ServiceNow Employee

Here's all the options - 

newdocument,bold,italic,underline,strikethrough,alignleft,aligncenter,alignright,alignjustify,formatselect,fontselect,fontsizeselect,table,cut,copy,paste,pastetext,searchreplace,bullist,numlist,outdent,indent,blockquote,undo,redo,link,unlink,code,forecolor,backcolor,removeformat,hr,visualblocks,subscript,superscript,charmap,image,media,preview,fullscreen

 

Add them to either property glide.ui.html.editor.v4.toolbar.line1 or glide.ui.html.editor.v4.toolbar.line2, and that should fix it. 

That's the thing. The tools that I want are there, they just aren't showing up when TinyMCE renders. See Link is listed, but it looks like table, forecolor, backcolor, link, unlink, image, media, code, and fullscreen are all missing.

find_real_file.png