The forum operates in read-only mode. Please head to StackOverflow for support.

Tue, 06/16/2009 - 07:43

neatoboy

Joined: 16/06/2009

Posts: 5

Custom styles

I only want two styles to appear in the Style menu:

I've edited the fck_config.js file by changing this setting:

FCKConfig.EditorAreaCSS = 'http://www.xxxxxxxxxx.com.au/style/hb.css' ;

For some reason the styles in hb.css don't appear and only the default styles appear. What am I doing wrong?

Here are the styles defined in hb.css:

.mainheading {

font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 30px;
color: #a1d1f1;
text-decoration: none;
font-weight: bold;

}

.secondheading {

font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 24px;
color: #a1d1f1;
text-decoration: none;
font-weight: bold;
}

Tue, 06/16/2009 - 16:19

lesbarstow

Joined: 07/07/2008

Posts: 185

Re: Custom styles

The EditorAreaCSS is used to define CSS styles that apply to the document in the editor area, not styles that appear in the toolbar drop-down.

I think you're looking for FCKConfig.CustomStyles and FCKConfig.StylesXmlPath (or the styles contained within the XML file pointed to by that variable...)

Fri, 06/19/2009 - 00:38

neatoboy

Joined: 16/06/2009

Posts: 5

Re: Custom styles

Does that mean I need to edit the fck_styles.xml file?

If so, how do I translate the following into xml?

.mainheading {

font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 30px;
color: #a1d1f1;
text-decoration: none;
font-weight: bold;

}

.secondheading {

font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 24px;
color: #a1d1f1;
text-decoration: none;
font-weight: bold;
}

Wed, 06/24/2009 - 22:14

lesbarstow

Joined: 07/07/2008

Posts: 185

Re: Custom styles

You don't. Keep them in your CSS, and then add something similar to the following to the XML:

<Style name="Main Heading" element="span">
     <Attribute name="class" value="mainheading">
</Style>

Tue, 06/30/2009 - 07:19

neatoboy

Joined: 16/06/2009

Posts: 5

Re: Custom styles

I've added the following code to fck_styles.xml but the mainheading style still doesn't appear:

    <Style name="Main Heading" element="span">
         <Attribute name="class" value="mainheading">
    </Style>

I assume that I have to somehow "tell" the editor to look for 'mainheading' in the css file but how do I do this?

Tue, 06/30/2009 - 16:57

lesbarstow

Joined: 07/07/2008

Posts: 185

Re: Custom styles

Do you mean 'fckstyles.xml', or have you renamed your style XML to fck_styles.xml?

When I did that and loaded a new editor, I immediately got a 'Main Heading' entry in my Style drop-down. You *do* have to define the class 'mainheading' in a style sheet pointed to by your EditorAreaCSS config entry, or defined by an inline style sheet or CSS link if using the FullPage option. But even if the class isn't defined, you'll still be able to apply the style from the Style combo; if you don't see it, something's not loading properly or isn't defined in the right place.

Wed, 07/01/2009 - 05:45

neatoboy

Joined: 16/06/2009

Posts: 5

Re: Custom styles

In fck_config.js I have the following:

FCKConfig.EditorAreaCSS = FCKConfig.BasePath + 'http://www.xxxxxxx.com.au/style/hb.css' ;

Mon, 07/06/2009 - 19:37

lesbarstow

Joined: 07/07/2008

Posts: 185

Re: Custom styles

Define "it still doesn't work"...

Per my previous post - do you see the style in the Style drop-down combo?

If "no", then you have a problem with your FCKConfig.StylesXmlPath. This may be an actual configuration problem, or it may mean that you just need to clear your browser cache and try again.

If "yes", and you're not seeing the style applied to your text when you try to do that, then you have a problem with your FCKConfig.EditorAreaCSS - and you do, since you have a full URL appended to the FCKConfig.BasePath.

Wed, 07/08/2009 - 17:03

b3n

Joined: 30/06/2009

Posts: 6

Re: Custom styles

This is what I am looking for, but I'm struggling to find the equivalent setting in CKEditor/FCKEditor V3... any hints?