Styleset for ckeditor

[Dorien]

Hi!

I've been trying to add my custom stylesSet in the CKeditor. I have found that the ckeditor is configured in the file app/view/js/bolt.js. There i have added this piece of code to the 'CKEDITOR.editorConfig'

Code: Select all

var randomnumber=Math.floor(Math.random()*11);

CKEDITOR.stylesSet.add( 'team2win-' + randomnumber, [
        // Block-level styles.
        { name: 'Blue Title', element: 'h2', styles: { color: 'Blue' } },
        { name: 'Red Title',  element: 'h3', styles: { color: 'Red' } },

        // Inline styles.
        { name: 'CSS Style', element: 'span', attributes: { 'class': 'my_style' } },
        { name: 'Marker: Yellow', element: 'span', styles: { 'background-color': 'Yellow' } }
    ]);

config.stylesSet = 'team2win-' + randomnumber;

The random number is needed because it gives error when two ck editors are being generated. Guess a randomnumber is not really the best way to do it but i'm not that good of a scripter and also I could not find a id of the ck editor instance. Ok so good so far, but now comes the strange part. When change this:

Code: Select all

{ name: 'styles', items: [ 'Format'] },

Into this:

Code: Select all

{ name: 'styles', items: [ 'Styles', 'Format'] },

I don't get a styles bar even if i comment my stylesset. Is something in de code of Bolt preventing the styles dropdown?

~ Dorien

[streeff]

Not sure what you're trying to achieve. What you are doing is brilliant, but looks complicated to me - and may get overwritten with the next time Bolt is updated.

If it's about having more Wysiwyg functionality, I'd consider using your contenttypes.yml by adding a postfix/prefix somewhere like this:

Code: Select all

postfix: "<link rel="stylesheet" href="/theme/path_to_yourtheme/css/backendstylesheet.css" />"

Tried it (in Firebug) and it seems to work. Much easier! You can also put instructions for the editor in a postfix/prefix.

[Dorien]

I need a bit more than the styling in the editor. When the style dropdown box in CK editor is activated i can add spans with a class to pieces of text, thats my goal

[streeff]

Hm, I think I see.

And how about opening a tailormade HTML popup via a prefix or postfix where users can copy-paste stuff from?