How to configure the FCKEditor for WYSISYG and show the site styles
Set the site style for the editor area
In the FCK Editor active profile(s) open up the CSS section. Set the Editor CSS: pulldown to "define css" and enter your style sheet(s) into CSS path: text input field.
In many cases the body background is set to some color that will fill the outside of the content. if that's the case you want to override this by adding the following line to modules/fckeditor/fckeditor.config.js (libraries/fckeditor/fckconfig.js if using the WYSIWYG module)
FCKConfig.EditorAreaStyles = "body{background:#FFFFFF;text-align:left;}";
You can also add the above line in the Custom javascript configuration: in the "Advanced Options" section.
Add the site styles.
Make sure that your toolbar includes the Style pulldown. If not then add it to modules/fckeditor/fckeditor.config.js
...
'/',
['Style','FontFormat','FontName','FontSize'],
['TextColor','BGColor']
] ;Copy modules/fckeditor/fckeditor/fckstyles.xml to your theme directory and set the path accordingly in the CSS section.
Edit the file adding your styles and removing the unwanted ones.
- Login to post comments