Adding your own Syle Sheet

http://docs.cksource.com/CKEditor_3.x/D ... ide/Styles

CKEDITOR.editorConfig = function( config ) {
   config.stylesCombo_stylesSet = 'mystyles';
};

http://docs.cksource.com/ckeditor_api/s ... ontentsCss

WebHigh,

I was looking for the same - to load elements into the Style Combo from CSS file. Couldn't find it, so I wrote my own JavaScript , as lame as it is - see attached:

Put the files from attached ZIP into your "ckeditor/" folder.

Assuming that your "ckeditor/" folder is in the same directory as the script using it:

<script src="ckeditor/CKEditor_StyleDropdown.js" type="text/javascript"></script>
<script language="javascript">
    LoadCssStyleset("ckeditor/MyStyle.css");
</script>

CSS is placed inside "ckeditor/" for demo only, note that CSS is not part of software, but your data, so your own CSS should be left where it is now and linked from that location:

..
    LoadCssStyleset("../MyPages/MyStyle.css");

Note that only styles marked with "Add-to-combobox:" in the comment next to style name will be added to the combo box.

P /* Add-to-combobox: */ {
   font-size : 11px;
   font-family : verdana;
}

You can also change the display name using the "name=" parameter:

P /* Add-to-combobox: name='Paragraph' */ {
   font-size : 11px;
   font-family : verdana;
}

in case if generic styles that may apply to any tag (those that start with the period "."), by default the tag will be SPAN, but you can change it using :

.wrapper /* Add-to-combobox: name='Wrapper' element='span' */ {
   font-size : 12px;
   font-family : verdana;
}

The keyword that this script is looking for is set in "CKEditor_StyleDropdown.js":
line 11: CKEDITOR.config.stylesCombo_stylesSet = GenerateStyleSet(txtFile.responseText, 'Add-to-combobox:');

If you want to use other keyword than 'Add-to-combobox:' change it aas you wish, or leave it blank to load ALL styles to the combo-box.

Hi ILikeFreeCode,

thanks for sharing your script(s), that looks promising.

Could you please post a bit more details on:

1. Where have the .js to be placed
2. Where has the "call" to be placed

for a less code knower. I use CKEditor with WebYep and FreewayPro, will mean, that I have to handle all within the CKEditor files and folders.

Another point is:

It is your script. Is it allowed to spread it in the world? A lot of people would like to thank you `cause if it works (as I suspect) it could help a lot and I wouldn`t miss to give the credits to you.

Thanks in advance

Hopsing

ILikeFreeCode wrote:WebHigh,

I get you, I was looking for the same - to load elements into the Style Combo from CSS file. Couldn't find it, so I wrote my own JavaScript , as lame as it is - see attached. This how I to call it, doesn't have to be OnLoad:

window.onload = function OnLoad()
{
   LoadCssStyleset(UrlPath() + "templatemb.css");
}