CSS-Styles

If the frontend view in Joomla differs significantly from the backend view, the frontend CSS styles may not be loaded, or may only be partially loaded, in the backend editor. As in most other cases, it is worth taking a look at the source code. When searching for the JavaScript variable content_css, you should find the value that corresponds to the setting that needs to be configured in the JCE component:

 

 

Under Components -> JCE Editor -> Configuration -> Formatting and Display -> Editor Style, you can specify where the editor's styles should come from. If Template CSS is selected here, you might assume that the editor reads template.css from the template directory. In reality, however, the file editor.css in the template's css directory is used (/templates/TEMPLATENAME/css/editor.css). The relevant CSS files then simply need to be included using @import, for example:

 

@import url('template.css');

 

The relative URL is resolved from the template directory, not from the css subdirectory. If editor.css is not loaded from the template folder, it may also be because the global setting is being overridden in the "Profile" settings of the JCE component. In the corresponding setting, inherit (or vererbt in the German language pack) must be selected. This should ensure that all elements are displayed correctly, apart from JavaScript-generated elements and styles added by the JCE editor itself, such as the borders around tables.