By webcomm on

I was able to get the styles menu to appear by editing fckeditor.config.js and adding 'Style' to the DrupalFull toolbar set.

I can't seem to get the styles from my fckstyles.xml to show up in the styles menu, though. I have uploaded fckstyles.xml to my theme. I set the Predefined styles dropdown in my super admin profile to "use theme fckstyles.xml". I cleared my template cache, cleared my browser cache, and restarted my browser, and the styles still do not appear in my styles menu.

Any ideas?

-Ryan

⋅ Categories: Drupal 6.x

Comments

webcomm’s picture

webcomm commented

bump.

Anyone have any experience with this problem?

thanks!
Ryan

webcomm’s picture

webcomm commented

I found my answer.

The styles for the dropdown need to be defined in /modules/fckeditor/fckeditor.config.js

Doing so overrides the FCKConfig.CustomStyles setting in /modules/fckeditor/fckeditor/fckconfig.js

Sample...

FCKConfig.CustomStyles =
{

'Red Title' : {
Element : 'h3',
Styles : { 'color' : 'Red', 'font-size' : '14px' }
},

'Audio' : {
Element : 'div',
Attributes : { class : 'audio' }
}

};

That's a little bit of what can be done. The commas, single quotes and braces drive me nuts, but so it goes. Clear your browser cache after every change to fckeditor.config.js.

twiik’s picture

twiik commented

Thanks for the tip about adding 'style' to get the style dropdown to show, but I didn't experience any of the other problems you noted.

I just moved the .xml-file to my theme folder and edited it. It all works perfectly now, all my custom styles show up in the dropdown.

Øyvind Strømsvik
Tech lead | Frontkom AS
https://frontkom.com/

dummwiam’s picture

dummwiam commented

Thanx for the tip! It worked

soodgniit’s picture

soodgniit commented

Thanks dear,

its really works. I think what ever changes we has to apply in FCKEditor we have to do changes in fckeditor.config.js file.

thanks,

Anirudh Sood

pfini’s picture

pfini commented

I have a very similar issue but I do not want to edit the FCK editor core module files.

I have moved the fckeditor.config.js and fckstyles.xml to my themes folder.
I have customized the fckeditor.config.js to display the Style dropdown menu. Under Admin > Site Configuration > FCK Editor > Advanced I created the admin user profile and I have set the Advanced Options to from False to True to "Load fckeditor.config.js from theme path".
That works fine. I can see the Style dropdown Menu in the FCK Editor.

Now, when I try to add the custom style sheet (fckstyles.xml) which I have uploaded to my theme, then select Admin > Site Configuration > FCK Editor > Advanced > Edit > CSS and then change the Predefined styles to anything other than FCK Editor Default, I do not get any dropdowns at all and in fact, the FCK Editor doesn't work at all. It doesn't work when I select, 'Use Theme fckstyles.xml' or when I 'Define path to fckstyles.xml' then define the path in the field below.

It seems like it should work but it doesn't . I'm stuck on this and any help would be great!

SchwebDesign’s picture

SchwebDesign commented

I found this not to work as well because i was using the WYSIWYG module with the FCKeditor installed in the sites/all/libraries folder. Thus the custom configuration information was coming from /sites/all/modules/wysiwyg/editors/js/fckeditor.config.js which i edited in accordance with webcomm's post above.

Although it would be nice to have this overridden from the themes/theme_name/js folder. Anyone else have any input?

-Cameron
Web Designer & Developer
Website Design and Development

Diegen’s picture

Diegen commented

To get my own custom styles and setup working for fck

Predefined styles:

CSS >
Predefined styles path:
define path to fckstyles.xml
[%hsites/all/themes/nasmus/fckstyles.xml]

and set

Advanced Options >
Load fckeditor.config.js from theme path:
[True]

Then after not having my styles show in fck, I clear cache, refresh, close and re-open but all to no avail. This worked well in my case, I open the xml directly in browser and refreshed it till I saw my styles applied.

http://www.mydomainname.co.za/sites/all/themes/nasmus/fckstyles.xml

bailey86’s picture

bailey86 commented

Hi,

Bashed head against this for 4 hours.

I have WYSIWYG installed and have added fckeditor into the /sites/all/libraries directory

Then added to 

sites/all/libraries/fckeditor/fckstyles.xml

a couple of extra styles as

        <Style name="Image on Left" element="img">
                <Attribute name="style" value="padding: 5px; margin-right: 5px" />
                <Attribute name="border" value="2" />
                <Attribute name="align" value="left" />
        </Style>
        <Style name="Image on Right" element="img">
                <Attribute name="style" value="padding: 5px; margin-left: 5px" />
                <Attribute name="border" value="2" />
                <Attribute name="align" value="right" />
        </Style>
        <Style name="Image on Left - no gap" element="img">
                <Attribute name="style" value="padding: 5px 5px 5px 0; margin-right: 5px" />
                <Attribute name="border" value="2" />
                <Attribute name="align" value="left" />
        </Style>
        <Style name="Image on Right - no gap" element="img">
                <Attribute name="style" value="padding: 5px 0 5px 5px; margin-left: 5px" />
                <Attribute name="border" value="2" />
                <Attribute name="align" value="right" />
        </Style>

On Internet Explorer the extra values in the dropdown list appear and can be assigned - provided you've selected an img element. It doesn't work perfectly - the style doesn't get applied and the attribute names get set to uppercase - but it seems to work when viewing the page.

THIS IS THE IMPORTANT BIT!!!!!

In Firefox make sure you clear the cache and the old style sheet will still be used and the items will not appear in the dropdown list!!!!!

AAAAARRRRGHHHHHH!!!!!! I didn't really need to waste the DAY it's taken to sort that out! :o(