Forums

Changing background of tinymce editor

Permalink
I have done the following in previous versions without a problem. This is the first site where I am using version 5.5.0.

I changed the body of typography.css so it has an image background: 

body {
        /* customize_body */ font: normal normal 14px Arial; /* customize_body */
        /* customize_body */ color: #342000; /* customize_body */
        line-height:21px;
        background:#ffffff url(./images/background.png) repeat-x top;
}


Once I did this, the editor had the same image background Instead of a white background. Making it very hard to see what you are editing. I viewed a few posts on this subject and added the following within the main.css (In my theme's case va_base.css):

#body #tinymce { color:#000000 !important; background-color:#ffffff !important; }


This has not had any effect. I cleared the cache of my website and browser - no change.

When inpecting the editor with firebug, I noticed the following:

<body id="tinymce" class="mceContentBody " contenteditable="true" spellcheck="false" dir="ltr">


However I cannot tell where it is picking up this css (I would also like to turn the spell check to true).

Any ideas??

The site is violentacesclothing.com
globalnerds
 
PineCreativeLabs replied on at Permalink Reply
PineCreativeLabs
In your typography.css file, do this: 

body { background-color: #ffffff; }


Then, in your main.css file, do this: 

body { background: url(./images/background.png);
background-repeat: repeat-x;
background-position: left top; }


Hope that helps?
globalnerds replied on at Permalink Reply
globalnerds
Here is what I did that worked:

in typography.css - I removed all references to the background

in my main.css I added the following code:

body { background:#ffffff url(images/background.png) repeat-x top; }


note that I removed the ./ before the images text.

Thanks!
PineCreativeLabs replied on at Permalink Reply
PineCreativeLabs
That works too. The way I mentioned seems to work for me. But I guess it's a bit different, depending on how the theme is structured.