Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

We've moved the forum!

Please use forum.silverstripe.org for any new questions (announcement).
The forum archive will stick around, but will be read only.

You can also use our Slack channel or StackOverflow to ask for help.
Check out our community overview for more options to contribute.

Customising the CMS /

Moderators: martimiz, Sean, Ed, biapar, Willr, Ingo, swaiba

Custom editor javscript not loading in CMS


Go to End


4 Posts   1605 Views

Avatar
Babalou

Community Member, 21 Posts

2 March 2016 at 12:17pm

I have this customised HTMLEditorField which basically activates some customised TinyMCE editor plugins so that the editor uses BBCode instead of HTML and adds a word count and word limit on the field.
This works pretty well in the public site so I added the function to the CMS as well ... and it works ... but only if the page loads fully, like by reloading the page or clicking in the location bar and hitting return.
It does not work if I click on other pages in the site tree. Teh editor simply does not load.Obviously the the editor JS is not being initialised but I cannot find where I missed the boat. Has anybody had experience with modding the editor in the CMS?

Avatar
Babalou

Community Member, 21 Posts

2 March 2016 at 12:50pm

I believe that the following javascript needs to fire when the CMS navigates ajax-style to a new page, but I have no idea how to inject this into the CMS without rudely modding the core.

tinyMCE.init({
		theme : "advanced",
		mode : "textareas",
		plugins : "bbcode, wordlimit",
		theme_advanced_buttons1 : "bold,italic,underline,undo,redo,link,unlink,image,removeformat",
		theme_advanced_buttons2 : "",
		theme_advanced_buttons3 : "",
		theme_advanced_toolbar_location : "bottom",
		theme_advanced_toolbar_align : "center",
		theme_advanced_styles : "Code=codeStyle;Quote=quoteStyle",
		content_css : "$css_path",
		entity_encoding : "raw",
		add_unload_trigger : false,
		remove_linebreaks : false,
		inline_styles : false,
		convert_fonts_to_spans : false
	});

Avatar
Babalou

Community Member, 21 Posts

3 March 2016 at 12:27am

So the answer looks like this:
I was already including the javascript using Requirements but once the CMS loads it draws its data via ajax so JS has to do the event management. Learned how to make that work here:
https://www.bigfork.co.uk/takeaway/a-beginners-introduction-to-using-entwine-in-silverstripe

(function($) {
    $(document).ready(function(){
		$.entwine(function($) {
				$('textarea.wordcount').entwine({
					onmatch: function() {
						tinyMCE.init({
								theme : "advanced",
								mode : "textareas",
								plugins : "bbcode, wordlimit",
								theme_advanced_buttons1 : "bold,italic,underline,undo,redo,link,unlink,image,removeformat",
								theme_advanced_buttons2 : "",
								theme_advanced_buttons3 : "",
								theme_advanced_toolbar_location : "bottom",
								theme_advanced_toolbar_align : "center",
								theme_advanced_styles : "Code=codeStyle;Quote=quoteStyle",
								content_css : "$css_path",
								entity_encoding : "raw",
								add_unload_trigger : false,
								remove_linebreaks : false,
								inline_styles : false,
								convert_fonts_to_spans : false
						});
					}
        		});
        	});
    	});
})(jQuery);

Avatar
zz

Community Member, 16 Posts

8 March 2016 at 7:09am

Awesome! Thanks for this ;)