Elxis CMS Forum

Support => General => Topic started by: grayarti on May 19, 2013, 12:15:48

Title: TinyMCE editor background
Post by: grayarti on May 19, 2013, 12:15:48
Hi!
I am using Elxis Poseidon 4.1 and the Delta template

... I have set up a custom background with:
body {
   background: #eee url(../images/bg_poseidon_2.jpg) no-repeat fixed center top;
   font:normal 10px/12px ‘Lucida Sans Unicode’, ‘Lucida Grande’, sans-serif;
   color:#191919; margin:0; padding:0;
}

... All just fine, but I would like that it does not appear also as the TinyMCE editor background.

... I have read this:
http://wiki.elxis.org/wiki/TinyMCE_editor_background
... and wanted to use the Alternative way:
( #tinymce.mceContentBody { background-image:none!important; background-color:#fff!important; } in the template.css )
... but this doesn't seem to work for me, maybe it applies only to the older versions of Elxis?

... any suggestions?
thanks!!
Title: Re: TinyMCE editor background
Post by: webgift on May 19, 2013, 12:39:05
Hi!
- Create a div inside the body tags of index.php file.
- Change the background color of body tag to white
- Add the background color at new div.

Example:
index.php file
<body>
   <div class="mywrapper">
        .........
   </div>
</body>

CSS file
body { margin:0; padding:0; background-color:#ffffff; color:#000; }
.mywrapper { background-color:blue; }
Title: Re: TinyMCE editor background
Post by: grayarti on May 19, 2013, 13:33:04
Hi Webgift, and thanks for your help!
... OK, I get the concept, and of course the editor background is now white (from the body tag),
but this new DIV (.mywrapper) only reaches the bottom of the .delta_page DIV, and not the full
screen.  I've played around, trying different positions but without a solution, in the index.php it
should be like this? :

<body>
<div class="mywrapper">
   <div class="delta_wrapper">
( with the closing </div> before </body> at the bottom)

... any help on what I'm doing wrong?
... thanks!
Title: Re: TinyMCE editor background
Post by: webgift on May 19, 2013, 17:12:06
Add this one:
.mywrapper { min-height:1080px !important; }
Did we fix that ? ;)
Title: Re: TinyMCE editor background
Post by: grayarti on May 19, 2013, 17:56:58
Hello again Webgift,
... thanks again, well, that's kind of like a solution, but I have had to put:
min-height:1106px ... to exactly fill my screen (iMac 1920x1200), but I have also had to take out
the small 5px margin I had at the top, which was remaining white.
... so, maybe a solution, I'll have to see what it looks like on a windows PC, and other browsers,
I'm getting the vertical scroll bar now, which before only showed when the 'delta_main' was  reached
when resizing.
... do you want to take a look, to understand what I'm talking about?
Title: Re: TinyMCE editor background
Post by: webgift on May 20, 2013, 10:52:08
Hello grayarti,
It's not an issue. You only have to play with CSS. As it seems you had added a margin-top:5px to body tag which it's not suggested. Instead of that you can use a padding-top:5px at css class mywrapper now.
Don't forget that we use the maximum min-height value in pixel. There are no so many screens with the same or larger height as yours (i think so).

You get a vertical scrollbar as we change the min-height. I got the vertical scrollbar from the begging as my screen resolution is 1280px (width) - 800px (height).
Title: Re: TinyMCE editor background
Post by: grayarti on May 20, 2013, 11:13:28
Hi Webgift, thanks for your interest!
... in actual fact, I have a 5px top margin in delta_wrapper, not in the body.

... I have now taken out the extra DIV option you advised, as it doesn't seem
like the best solution ( too 'screen type specific'! )
... The best solution, I think, would be to be able overide the background setting
in the TinyMCE editor, as was presented here:
http://wiki.elxis.org/wiki/TinyMCE_editor_background
... If this in no longer possible in 4.x, then I will just change to a lighter uniform
background image, pity!!  ;D
... Maybe you could ask if any of your colleagues have any good ideas?

... also, it seems there are missing European languages in 4.x  ( German, Spanish ),
is that right?
... thanks...
Title: Re: TinyMCE editor background
Post by: webgift on May 20, 2013, 11:29:43
You are very welcome, grayarti!
It's true that there are too many solutions in each case here. It's also true that i am a human being so there are possibilities to forget some things. :) The alternative solution you've sent has to do with TinyMCE editor instead of CKEditor. So you have to find out how it can be done with the current editor.

There are no any missing European Language in Elxis CMS 4.x. The truth is that there is no any volunteer to translate Elxis into these languages. The good news is that Elxis CMS 4.x has been translated into 11 languages till now!
Title: Re: TinyMCE editor background
Post by: grayarti on May 20, 2013, 11:50:03
Hello again Webgift,
... again, thanks! ... yes I thought that was the case about the languages, a pity! I thought there was a large
Elxis user community in Germany, although I did see someone had posted the Spanish files, but they are not
available in the  EDC.  ... in my case, as I work with Italian hotels and event agencies, I really need:
IT/EN/DE/FR/SP for any sites I'll be offering!!

... also, just an idea I have, but seeing as the TinyMCE editor takes it's Article's body-windows' background
from the template css file, wouldn't it make more sense to get the background color/image from the .delta_main DIV,
as this is where the content will be viewed, but never on the body background??
... just saying ...
'bye
Title: Re: TinyMCE editor background
Post by: webgift on May 20, 2013, 21:15:48
Each template use its own names on CSS classes. ;)
Title: Re: TinyMCE editor background
Post by: grayarti on May 20, 2013, 21:54:48
Yes, that's true, I hadn't taken that into account!!
... but I still don't see the usefulness of having the body background in the edit windows,
as your content is never shown there! ...then maybe a 'switch' button, to be able to choose
either a light/dark background?? Much more helpful!  ;D