Sign Up! Login: Password: New User? Forgot? Support
Code 
 
 
Forums 
Forums : Archive > Adding CSS for the Forum/Message Editor to match your site theme
Mottie (SuperAdmin) 4/13/2009 9:07 PM EST : Adding CSS for the Forum/Message Editor to match your...
ACK!
Mottie
Posts: 3883

0
Like

0
Dislike

Forum/Message Editor CSS

GuildPortal admin site link to original post

This CSS will let you modify the editor color to match your site. The editor is used in both your forums and mail messages. It will also add CSS to prevent the white text on a white background that you can see in the editor before image below (click to enlarge).

Editor Before
Editor After

Add this CSS to your Custom CSS (remove the <style> tag from the top and </style> tag from the bottom), Header HTML, footer or into any free form text/HTML box on your forums tab and mail tab.

CSS
<style type="text/css">
.RadEWrapper *,.ContentElement * { color:#000000; }
.RadEContent, .RadEContentBordered, .RadETextArea { background-color:#222222 !important; color:#dddddd !important; font-size:12pt !important; }
.RadEContent a:link, .RadEContentBordered a:link {color: #ffcc00 !important; text-decoration: none;}
.RadEContent a:hover, .RadEContentBordered a:hover {color: #ffffff !important; text-decoration: underline;}
.RadEContent a:visited, .RadEContentBordered a:visited {color: #8000ff; text-decoration: none;}
.RadEContent a:active, .RadEContentBordered a:active {color: #ff8000; text-decoration: none;}
</style>
Customizing
  • The top line makes sure that the Style, Font Name and Font Size boxes don't have white text on a white background. So keep this color dark, the default here is black. I tried changing the color of the toolbars, but it'll take a lot more messing around with CSS to get it perfect. So the toolbar should stay white with a dark color text.

    .RadEWrapper *,.ContentElement * { color:#000000; }

  • The second line modifies the background color of the editor. Adjust it to match your site. The default colors are very dark grey (#222222) with an almost white (#dddddd) text. You can also modify the font size (12pt) here because most of the time I'm squinting to see what I've typed. Make sure you keep the !important after each variable or it won't work

    .RadEContent, .RadEContentBordered, .RadETextArea { background-color:#222222 !important; color:#dddddd !important; font-size:12pt !important; }

  • The last four lines modify the link colors inside your editor. I only added the !important to the first two, but you can include the last two if you're having trouble seeing the links. I left in the "text-decoration" but it really doesn't do anything unless you are in "preview" mode. You could also add an !important after these parameters, but then you'd have to add it to all four.
This topic was moved from forum Instructions to forum Archive by Mottie.
This topic was moved from forum Instructions to forum Archive by Mottie.
Characters: Mottie Motty Mortie Ooshiny Mot Fudgems
TopBottom

Guppy Queen (Applicant) 4/24/2009 12:30 PM EST : RE: Adding CSS for the Forum/Message Editor to match ...
Guppy Queen
Posts: 41034

0
Like

0
Dislike

I've been using this mode and getting positive feedback from it. Thanks Mottie!
TopBottom

Guppy Queen (Applicant) 6/29/2009 6:08 PM EST : RE: Adding CSS for the Forum/Message Editor to match ...
Guppy Queen
Posts: 41034

0
Like

0
Dislike

Mottie, the editor has been changed, and this script no longer makes the background appear in a different color cry
TopBottom

Mottie (SuperAdmin) 7/7/2009 2:26 PM EST : RE: Adding CSS for the Forum/Message Editor to match ...
ACK!
Mottie
Posts: 3883

0
Like

0
Dislike

Hi Guppy!

Yeah the forum editor is completely different now... it broke a lot of the things I worked on. I'll look into this, but at this time it looks like the editor is in an iframe and there isn't a way to access or control the CSS for it 
Characters: Mottie Motty Mortie Ooshiny Mot Fudgems
TopBottom

Guppy Queen (Applicant) 7/7/2009 2:42 PM EST : RE: Adding CSS for the Forum/Message Editor to match ...
Guppy Queen
Posts: 41034

0
Like

0
Dislike

Bummer... thanks anyhow Mottie. I appreciate it.
TopBottom

 
 
Key 
New posts No new posts
New posts ( popular ) No new posts ( popular )
New posts ( sticky ) No new posts ( sticky )
New posts ( locked ) No new posts ( locked )
 
 
Who's Online 
There are   members online.
 
 
So-and-so has logged on!
%title%
%message%