emulate Joomla template.css

shoulders commented 7 years ago

The reason I want this is that WYSIWYG editors on Joomla by default look for template.css and some will only look for this. When editors can use this file they can apply the default template styling into the editor window making thing easier to edit for the end user.

Currently Gantry does not have a template.css and as such WYSIWYG editors have no styling.

Not all WYSIWYG editors have an option to use custom CSS files and indeed other extensions (which I cant think of at the minute) could have the same issue.

For completeness I will outline both ways I can get JCE editor to have the gantry styling in the editor itself just in-case someone mentions that you can use custom CSS files as this feature request is for more than JCE editor.

Option 1

This is the template.css emulation method I would like to see.

create the file /g5_helium/css/template.css and add the following into it:

@import "../custom/css-compiled/helium_13.css";
@import "../custom/css-compiled/helium-joomla_13.css";
@import "../custom/css-compiled/custom_13.css";

This effectively loads the gantry styling into the template.css which the WYSIWYG editor can use without affecting any gantry code

Option 2

In the JCE editor component you can specify the custom css files with the following lines

templates/$template/custom/css-compiled/helium_13.css,
templates/$template/custom/css-compiled/helium-joomla_13.css,
templates/$template/custom/css-compiled/custom_13.css

the $template is change for the active template name

This also works

templates/g5_helium/custom/css-compiled/helium_13.css,
templates/g5_helium/custom/css-compiled/helium-joomla_13.css,
templates/g5_helium/custom/css-compiled/custom_13.css

Thanks

mahagr commented 7 years ago

To be honest I've totally forgotten that editors indeed do load CSS to mimic the looks of the final content.

LMKWeb commented 5 years ago

Is there a plan to incorporate this into a future release?

gantry / gantry5

emulate Joomla template.css #1695