I'm using the fckeditor 1.1 module with the core FCKeditor package, version 2.3.2, and Drupal 4.7.4. If I paste in some HTML code into an fckeditor-enhanced textarea that contains an inline CSS stylesheet (CSS directives between a pair of "style" tags), the resulting node looks fine and the output contains the proper styles. However, if I go back to edit that node later, the inline stylesheet is missing. It appears that fckeditor is stripping out the stylesheet. I've verified this by looking at the HTML source of the node editing page (the textarea contains the inline stylesheet) and also by disabling the fckeditor module and edit without it.

How can I configure fckeditor (or the core FCKeditor package?) to not remove these inline CSS stylesheets?

CommentFileSizeAuthor
#2 drupal-edit-section.html1005 bytesstinky1234

Comments

ontwerpwerk’s picture

ontwerpwerk commented
Status: Active » Closed (won't fix)

read the drupal manual again please: this is related to the input filter in drupal itself, drupal filters the style tags for you.

stinky1234’s picture

stinky1234 commented
Status: Closed (won't fix) » Active
StatusFileSize
new drupal-edit-section.html1005 bytes

I'm sorry. I must not have explained the problem clearly enough. I'll try again:

When I created the story node, for "input format", I chose "full HTML". Drupal should not strip inline stylesheets with the format, correct?

With the fckeditor module disabled, I can go through the steps of creating a new story node, paste in some HTML with an inline stylesheet, choose full html input format, and save it. The resulting story node looks correct, and my inline stylesheet is visible when I view the source.

With fckeditor still disabled, I can click the edit link for my new story node, and Drupal shows the HTML in the edit form's body textarea, including the inline stylesheet. I have attached a file to this comment containing a section of the edit page's HTML. It shows the textarea that contains my HTML with stylesheet. This is proof that Drupal is not removing my inline stylesheet. I could make some changes to the story if I want to, but after I save it, my inline stylesheets continue to be there. I can edit the node as many times as I want and its stylesheet will stay.

Finally, if I enable the fckeditor module in Drupal, something different happens. When I click the edit link for my story node, the fckeditor-enhanced body textarea doesn't show my story with the proper styles. That could be considered a minor problem if it was just a display problem in the editor. I thought it could be that FCKeditor just wants to show those dashed lines between table cells instead of what I like. As long as the HTML code doesn't change, I don't mind.

But when I click on the "source" button of FCKeditor, it shows that my inline stylesheet has been removed. At this point, if I ask my browser to show me the source of the edit page, I see my stylesheet in the edit textarea! The only logical conclusion is that fckeditor (or maybe the FCKeditor core package) has removed my inline stylesheet when it loaded and enhanced the textarea.

So, to break my original question into two parts:

1. Is the fckeditor module or the FCKeditor core package removing my inline stylesheets?

2. Whichever part is responsible, how can I configure it to not remove the stylesheets?

Thank you for your help!

ontwerpwerk’s picture

ontwerpwerk commented
Status: Active » Closed (won't fix)

in that case the FCKeditor component had removed the stylesheet.. the fckeditor.module does not change anything in the content of textareas

maybe the solution to your problem is in the fckeditor support forum on sourceforge

grafsl’s picture

grafsl commented

I see the same behaviour on 6.x-1.3-rc6. Inline css removed by Drupal. In two words: when fckeditor switch textarea to editor it's make ajax request to page "fckeditor/xss" and transmit to it text from textarea. In page callback function text is processed by filters and recived back to editor.
To avoid this it's needed to add new input filter which allows enter anything (or only what you want, but i use editor for myself only), add to form "Input format" elements (by calling filter_form() func.) and select new format by default for this form.
I think it's not the best solution but it works.

wwalc’s picture

wwalc commented

@grafsl - which input format was assigned to a field where CSS styles were stripped by fckeditor/xss?
I suppose that you were editing a filed with "Filtered HTML" input format assigned. In such case, even if FCKeditor would leave those inline styles, it would be stripped by Drupal before displaying it. Try editing a field with "Full HTML" or "HTML purifier" input format, FCKeditor will not strip inline styles in such case.

mrugesh_drupal’s picture

mrugesh_drupal commented
Status: Closed (won't fix) » Fixed

Hi Friends,

I also suffering from the same problem which you (ontwerpwerk, lsloan) described. But I got the solution. so, I am writing my solution here.

1. You need to set your input format must be full html

2. Then, Please check in coding any hook_form_alter() whether you are unset(['body_field']['format']) or not. If you are doing this than 100% problem is here. Here the code unset the input format variable and default it will strips the sytle and javascript attributes from you input content in FCKEditor.

In place of unset(['body_field']['format']) this you can use $form['body_field']['format']['#attributes'] = array('style' => 'visibility: hidden;'); this code.

It will remain the input format variable as it is. And you will get the output exactly as you want.

I think it would be helpful to you.

Please let me know.

Regards,
Mrugesh Panchal

visionquest’s picture

visionquest commented

@panchal_drupal Where is your solution in 2. implemented?

> In place of unset(['body_field']['format']) this you can use $form['body_field']['format']['#attributes'] = array('style' => 'visibility: hidden;');

Cheers,
Noel

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.

mrugesh_drupal’s picture

mrugesh_drupal commented

Don't worry, you still have at least three ways of dealing with it:

1. Allow trusted users to use Full HTML and accept that other users will have limited functionality, e.g. assign to their profile a different, simpler toolbar

2. Modify fckeditor.config.js so that FCKeditor used the old-fashion way of applying styles - using tag... remember it's your choice ;)
so if you really want to do this, add these lines at the end of fckeditor.config.js:
FCKConfig.CoreStyles['FontFace'] =
{
Element : 'font',
Attributes : { 'face' : '#("Font")' }
};
FCKConfig.CoreStyles['Size'] =
{
Element : 'font',
Attributes : { 'size' : '#("Size","fontSize")' }
};
FCKConfig.CoreStyles['Color'] =
{
Element : 'font',
Attributes : { 'color' : '#("Color","color")' }
};
FCKConfig.FontSizes = '1/xx-small;2/x-small;3/small;4/medium;5/large;6/x-large;7/xx-large' ;

with this code, you are able to use 'FontFormat','FontName','FontSize','TextColor' buttons/combo boxes even with Filtered HTML.

3. Instead of using 4 buttons for formatting text: 'FontFormat','FontName','FontSize','TextColor' use only one 'Style' button with predefined styles in fckstyles.xml.

Thanks
Mrugesh Panchal

nhoeller’s picture

nhoeller commented

Is there a way to update fckeditor.config.js so that FCKEditor will use width="295" height="243" instead of style="width: 295px; height: 243px" when resizing images by dragging the image handles?
Thanks, Norbert

marcopanichi’s picture

marcopanichi commented

I (Drupal 7) had the same problem, and the crucial point was always the functions i used to render the field:

  • don't use filter_xss_admin ("Allows all tags that can be used inside an HTML body, save for scripts and styles.")
  • use field_view_field paying attention to the $display / $type | $settings argument