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.

Archive /

Our old forums are still available as a read-only archive.

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

Customise the Editor?

Go to End

4 Posts   2417 Views


Community Member, 1 Post

5 February 2008 at 7:50pm

Edited: 05/02/2008 7:51pm

Hey guys,

I have only been using SilverStripe a few days but love what I've been able to accomplish in that time, however one nuisance that I have and haven't been able to fix is the font color for the Editor in the CMS.

The site I'm developing has a dark background and naturally I am using a white font. Unfortunately the Editor has a white background which makes it a pain for entering content as you can't read the text. Is there a way I can make the editor either have a dark background or a way the editor can override the default text color?

Hope someone can help.


Community Member, 2 Posts

4 June 2008 at 12:09am

Anyone know how to get round this problem? I'm in same situation and need to resolve it asap.

Bright Eyes David

Community Member, 26 Posts

4 June 2008 at 2:07am


Community Member, 2 Posts

4 June 2008 at 2:13am

Edited: 04/06/2008 2:14am

I've found a way of doing it which is to edit the code in tiny_mce_src.js . Silverstripe have added some custom sruff from what I can see which was using an iframe in the editor box (hence why changing the css for this wouldn't work). They have hard-coded the background color in the body tag of the iframe page.

File is located at jsparty > tiny_mce2 > tiny_mce_src.js. Look for following:

// SilverStripe modification: Apply extra classes (eg typography)
			var extraClass = replace_element.className + ' ' + form_element_name; 
			html = tinyMCE.getParam('doctype') + '<html><head xmlns=""><base href="' + tinyMCE.settings.base_href + '" /><title>blank_page</title><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"></head><body class="mceContentBody '  + extraClass + '" style="background-color:#ffffff";></body></html>';