Basically, what I'm looking for is for the content that I edit with TinyMCE to look as close to the final product as possible.

Say for example I want put white text on my colored background. By default TinyMCE has a white background, which ensures the text isn't viewable when the page is opened by TinyMCE, which makes editing a pain to say the least. What TinyMCE should do is to use the same background color (in this case blue) as the default page does, but I'm not sure how to do this.

Any ideas on how I can change TinyMCE's default background color?

Comments

vm’s picture

administer -> settings -> tinymce

one of those menus gives you a choice of what style sheet to use.

altering tinymce's stylesheet may be enough to get you where you want to go as well.

smithaa02’s picture

That actually didn't do the trick...

It looks like I'll have to set the background manually with CSS. Does anybody know the ID or class of the TinyMCE editor that would allow me to get rid of the white background?

vm’s picture

It may benefit you to use the firefox browser with the webdev addon & the xray addon, which shows you all the css used to render a page. with these addons you can even externally manipulate the css file to make sure you are on right path.

I don't use tinymce any longer its been replaced by the FCKeditor.

emackn’s picture

body.mceContentBody {
  background: #fff;
  color: #000;
  text-align: left;
}
vm’s picture

I couldnt find the avove reference in tinymces css files for version 2.0.8 of the tinymce library. however i did find

.mceEditorArea { font-family: 'MS Sans Serif', sans-serif, Verdana, Arial; background: #FFFFFF; padding: 0; margin: 0; } in editor_ui.css

smithaa02’s picture

Once I added this and changed TinyMCE's settings to point to the theme's css, it worked.

MConway1’s picture

I am encountering the same problem but I like the default white background, what I need to change is the default font color. For some reason when I start tinyMCE the default text is white. So as you type it's white on white.

Is there a change I can make to my .css file to make the text start out as black?

vm’s picture

take a look at the tinymce css files that come with the library (not with the module)

use the web developer addon with firefox to help you tweak the css to find the proper css change.

hychanhan’s picture

Hi,

Thanks for your hint.
Now i can do it.

Thanks,
ChanHan Hy