CSS Issues

I work for a graphic design studio and we are using fck editor that was bundled with a cms interface, how ever I am having trouble with css in the editor, we use dreamweaver for the design of all our sites and make a css.css file for all the copy then install the editor into the finished site. And there fore want the clients to only see the css we create for the editable area's we designate. Getting support on this issue has proven highly difficult as now it is holding up a site. Below is my problems and what I wish to do. Any help on this would be extremely wonderful.

When going in using fck editor the tool bar shows styles listed in the xml file, how ever I did not modify it as I wanted to use my own. In the document Fckconfig.js I have put the css file I created in lines 22 and 23 of the code, which read this

FCKConfig.EditorAreaCSS = ['http://localhost/css/css.css'];
FCKConfig.ToolbarComboPreviewCSS = 'http://localhost/css/css.css' ;

Putting the css in the above line of code has proven pointless. I need to know what I am doing wrong, as the clients need complete control over their copy, but only need access to the styles that are created with the look and feel of their website. How do I achieve giving the clients complete control of the copy but limiting them to the appearance’s we create? Do I have to hard code all the styles into the xml file and then adjust the appearance threw the editor? Or can I just create a css file like I have and link to that?

Thanks in advance.

Wed, 02/13/2008 - 18:03

londonpete

Joined: 13/02/2008

Posts: 4

Re: CSS Issues

I want exactly the same answer. I develop sites in just this way (so do most people I think). So far all I've found is suggestions that the XML file needs to be changed to match my CSS file. This is ridiculous, unless I can generate the xml file automatically.

Regards
Pete

Thu, 02/28/2008 - 16:03

oneofmanyjakes

Joined: 28/02/2008

Posts: 1

Re: CSS Issues

Dale, I think you need to create the css choices in the Drop down inside the config file as well as add your CSS file. Look at the samples site bundled with the FCK download. Javascript example 14 defines its own custom CSS styles in the style drop down. Custom styles are also applied to core features of the editer tool bar such as Bold for example. See some snippets below. I'm trying to do exactly the same as you so these features will be key for me. Hope this helps.

FCKConfig.CoreStyles.Bold = { Element : 'span', Attributes : { 'class' : 'Bold' } } ;
FCKConfig.CoreStyles.Italic = { Element : 'span', Attributes : { 'class' : 'Italic' } } ;
FCKConfig.CoreStyles.Underline = { Element : 'span', Attributes : { 'class' : 'Underline' } } ;
FCKConfig.CoreStyles.StrikeThrough = { Element : 'span', Attributes : { 'class' : 'StrikeThrough' } } ;

FCKConfig.CustomStyles =
{
'Strong Emphasis' : { Element : 'strong' },
'Emphasis' : { Element : 'em' },

'Computer Code' : { Element : 'code' },
'Keyboard Phrase' : { Element : 'kbd' },
'Sample Text' : { Element : 'samp' },
'Variable' : { Element : 'var' },

'Deleted Text' : { Element : 'del' },
'Inserted Text' : { Element : 'ins' },

'Cited Work' : { Element : 'cite' },
'Inline Quotation' : { Element : 'q' }
} ;