(New page: == CustomStyles == The CustomStles feature will allow you to add your own Styles into the "Styles" Context Menu. You may define as many styles as you want due to your needs. Adding a new ...) |
|||
| Line 4: | Line 4: | ||
Example: you want to create a new style called: "MY STYLE 1" which will have the following attributes: | Example: you want to create a new style called: "MY STYLE 1" which will have the following attributes: | ||
| + | |||
* the style should apply to the 'Heading 2' (h2) format | * the style should apply to the 'Heading 2' (h2) format | ||
* the font color is 'Blue' | * the font color is 'Blue' | ||
| Line 9: | Line 10: | ||
To add your custom style "MY STYLE 1" add the below code to the fckconfig.js file: | To add your custom style "MY STYLE 1" add the below code to the fckconfig.js file: | ||
| − | <pre> | + | <pre>FCKConfig.CustomStyles = |
| − | FCKConfig.CustomStyles = | ||
{ | { | ||
| − | + | 'Red Title' : { Element : 'h3', Styles : { 'color' : 'Red' } }, | |
| − | + | 'MY STYLE 1' : {Element :'h2', Styles : {'color' : 'Blue' , 'background-color' : 'Red' } } | |
}; | }; | ||
| − | </pre> | + | </pre> |
| + | As you may see the syntax of the function is very easy: | ||
| − | + | * in ' ' apostrophe you type the name of your style | |
| − | * | + | * after the colon you type in the definition of your style inside the curly brackets { } |
| + | * '''Element''' points to the element you want your style to apply to e.g. h1,h2,h3 | ||
| + | * '''Style''' defines the attributes of your own unique style e.g. color, background-color,font-family | ||
Revision as of 13:30, 15 January 2008
CustomStyles
The CustomStles feature will allow you to add your own Styles into the "Styles" Context Menu. You may define as many styles as you want due to your needs. Adding a new style is very easy. An example will show you how to do it properly:
Example: you want to create a new style called: "MY STYLE 1" which will have the following attributes:
- the style should apply to the 'Heading 2' (h2) format
- the font color is 'Blue'
- the background color is 'Red'
To add your custom style "MY STYLE 1" add the below code to the fckconfig.js file:
FCKConfig.CustomStyles =
{
'Red Title' : { Element : 'h3', Styles : { 'color' : 'Red' } },
'MY STYLE 1' : {Element :'h2', Styles : {'color' : 'Blue' , 'background-color' : 'Red' } }
};
As you may see the syntax of the function is very easy:
- in ' ' apostrophe you type the name of your style
- after the colon you type in the definition of your style inside the curly brackets { }
- Element points to the element you want your style to apply to e.g. h1,h2,h3
- Style defines the attributes of your own unique style e.g. color, background-color,font-family