using stylesheets

Ok, I am being stupid. I looked on http://dev.fckeditor.net/wiki/v3_status and editing area css should be available in 3.0 final. I've tried:

print "CKEDITOR.replace('editedFormHTML',{width:1000, height:500, contentsCss:'/mystyle.css'});\n";

in my php code and it isn't picking up the styles. I've even tried pasting the style into the contents.css file that is included, but it's still not working for me. It looks like that part of the docs is still empty for version 3.

Is anyone using this and could give me an example?

Thanks!

Bob

Thu, 09/03/2009 - 22:28

rramsey

Joined: 04/08/2009

Posts: 4

Re: using stylesheets

I solved this, and I'll document it in case someone else has a similar problem. Our designer created a style sheet like this:

#one
{
color:red;
}
#two
{
font-size: 24pt;
}
#three
{
background-color:yellow;
}
#one #two #three p
{
font-style:italic;
}

The body was something like:

<body>
<div id="one">
<div id="two">
<div id="three">
<p>Hello World!</p>
</div></div></div></body>

This would display "Hello World!" in red text on a yellow background, italicized, and in 24 point type. I've simplified things a lot, but this is nice, normal, valid css.

I configured ckeditor to use the stylesheet and made my code like this:

<body>
<div id="one">
<div id="two">
<div id="three">
<textarea id="editme"><p>Hello World!</p></textarea>
</div></div></div></body>

The problem was that the text was the plain default text. What I had to do to fix it was to duplicate the divs inside the text area, like so:

<body>
<div id="one">
<div id="two">
<div id="three">
<textarea id="editme">
<div id="one">
<div id="two">
<div id="three"><p>Hello World!</p></div></div></div></textarea>
</div></div></div></body>

Then in the javascript for the submit validation I chopped the redundant divs from the textarea from the beginning and end of the content.

I think this is a limitation of the way textareas work, not ckeditor. I ran into exactly the same problem, and fix, with the xinha editor.