The default WSIWYG editor used in CFWebstore comes with a variety of pre-configured CSS styles that you can use in your product layouts. These are taken from the default.css style sheet included with the software. But what if you use another style sheet or want to add some additional style to the editor when adding product descriptions? It's actually very easy to do!

First, you will need to make sure that the editor is using your personal style sheet, if you are not using default.css. Go to customtags/fckeditorV2/ and open up the fckconfig.js file in a text editor. Around line 31 you will find the style sheet configuration, just change it to use your store's css file instead.

Now we just need to add our styles to the FCKEditor Style definition page. You will find this in your store's css directory, fckstyles.xml. Open up this file in a text editor. You will see a basic XML definition of the styles used by the editor. For each style you add, you'll need to give it a name that it will appear as in the WSIWYG styles list, the type of tag it is (span, div, etc.) and then define the actual attributes that will be used. In most cases, if you have defined the style in your style sheet, you would use "class" or "id" here, but you can also put a full list of attributes that will be created if you want to add styles here that are not in your css file. As an example, if you want to add a style that will wrap a span tag using the class "myspan" and you're going to call this "My Span" in the editor, you would add the following code to the XML file:

Adding new styles to the editor can be really helpful when creating custom product descriptions, so don't miss out on this great feature!