Styles Configuration
The editor offers complete and powerful support for separating text formatting definitions from the text itself. And even more, it's possible to offer a complete set of predefined formatting definitions to the end-user (writer) so the text can be well designed without messing up the HTML source.
To do that, the "Style" toolbar command has been introduced. It shows a complete list of available styles with preview for text styles.
Customising the Editor and Kaboodle Styles
Kaboodle uses a number of Cascading Style Sheet (CSS) files that can be modified. The following three files that manage general site styles can be found in your file repository.
kbd_editorarea.xml
kbd_editorarea.css
kbd_administration.css
The editor CSS file and the default kaboodle CSS file are fully customisable. There are two sets of styles, the editor styles including the editor styles list, and the default kaboodle styles. The editor styles are independent of the kaboodle styles and are managed separately.
Important. User defined styles added to the editor CSS file must be replicated in the kaboodle CSS file for them to be visible on published pages.
1. Customising the Editor Styles list
The list of available styles is completely customisable for your needs. It is based on an XML file. This file can be placed anywhere in file repository.
The Styles XML file
It is a simple file that describes how to name and apply each style available in the editor. This is a sample:
< ?xml version="1.0" encoding="utf-8" ?>
<Styles >
< Style name="My Image" element="img">
<Attribute name="style" value="padding: 5px" />
<Attribute name="border" value="2" />
</Style >
< Style name="Italic" element="em" />
< Style name="Title" element="span">
<Attribute name="class" value="Title" />
</Style >
< Style name="Title H3" element="h3" />
</Styles >
The above sample shows how to define four styles, one for an "Object" element (in this case for images) and three for text. The editor will show the styles in a context sensitive fashion, so when an image is selected, only the "My Image" style will be available in the list and when text is selected the "Italic", "Title" and "Title H3" will be shown.
For more information please refer the FCK Editor wiki at http://wiki.fckeditor.net/Developer's_Guide/Configuration/Styles
2. User defined styles
The following is a list of the current user defined styles in the kbd_editorarea.css and kbd_editorarea.xml files.
tag line
Main Head
Intro
XHead
Breakout Head
Body copy
Caption
3. Default kaboodle styles
The following styles are the current styles defined in the kbd_administration.css file. Changes to the kaboodle default styles will affect all pages, including all site administration styles.
NOTE: It is recommended that you add or modify user defined styles to this file but not alter the predefined kaboodle default styles as the results can be unpredicatable.. At the time of writing backward compatibility issues within the various kaboodle versions preclude changes to some of the default styles (for example the Title, Subtitle, and Highlight styles - which are handled elsewhere in previous versions). In other words, changes to the default kaboodle styles may not necessarily be reflected in all site styles.
Normal
Formatted
Address
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
Title Subtitle Highlight
Custom Link 1
Custom Link 2
Input Field
Button
Mono Spaced Text
Script Block
xx-small
x-small
small
medium
large
x-large
xx-large | 
Kaboodle Tutorial - Two simple methods to create links in large documents
