How to plug in my own CSS-style to TextEditor?

33 Posts

andreww Reply #1, 20 years ago

I want to develop my own CSS style for site content. One file, where I will describe the font size, font face and alignment for <p>, <a>, for UL and UL > LI, and etc.

Question: How to plug-in this style to existed rich-text editor (FCK Editor by default)?

1,039 Posts

MadeMyDay Reply #2, 20 years ago

Hi,

go to assets/plugins/fckeditor and open the file: fckstyles.xml. Here you can add custom styles (the existing styles are self-explanatory I think). The common settings you can define in:

assets/plugins/fckeditor/editor/css/fck_editorarea.css

MODx deutsch | Webdesign Karlsruhe | Ressourcen für Webdesign

33 Posts

andreww Reply #3, 20 years ago

Thanks. But as I see it is usually used one CSS file for front-end of site and one for text-editor. Why? I have configured CSS for text editor (this: assets/plugins/fckeditor/editor/css/fck_editorarea.css) and plugged it to my template:

<head>
<link rel="stylesheet" href="/assets/plugins/fckeditor/editor/css/fck_editorarea.css" type="text/css"/>
</head>

As I think, it is 100% guarantee that what I see is what I’ll get. Or I’m wrong?

1,039 Posts

MadeMyDay Reply #4, 20 years ago

As I think, it is 100% guarantee that what I see is what I’ll get. Or I’m wrong?

Well, you have to imagine the text area as an own "site" with an extra stylesheet. FCK gets this stylesheet an displays its own area. Out of my experience you´ll never get a 1:1 display, but a relatively good one if you put in the important styles. You don´t need to fill all styles, only the ones that are responsible for your text, such as <p>, general body, lists and so on.

edit: You don´t have to plug the stylesheet to your template, FCK gets it anyway. And the edit textarea doesn´t care of the general site stylesheet or other additionally plugged in ones.

MODx deutsch | Webdesign Karlsruhe | Ressourcen für Webdesign