Why is the ploneCustom.css Stylesheet not loaded?

Question

I am new to Plone and I'm just learning how to change stylesheets. I successfully changed the ploneCustom.css in /Plone/portal_skins/custom/ and saved it. But when I tried to take a look at the site, I realised that the ploneCustom.css stylesheet isn't even loaded. According to my research a template is broken... But what do I do with that information? Where do I fix it and how?

Thanks for your help in advance!

Answer 1

50 ways of styling Plone, four of them explained:

1.) Customize ploneCustom.css

A relict of the skin-folder-times, by now it is recommended to use browser-based resources, instead. The reason is, when you have a lot of resources registered, it's hard to keep a correct order of the skin-layers and that can lead to unwanted overrides. Nevertheless, if you don't have a complex setup, or for quick testing, it is feasible to use skin-layers and ploneCustom.css, the exact steps are:

• Go to "http://yourhost.net:8080/yourPloneSiteId/portal_skins/sunburst_styles/ploneCustom.css/manage_main".
• Click on "customize".
• Enter some style for testing, e.g. "body { background: red }", save.
• Make sure, CSS-debug-mode is on at "http://yourhost.net:8080/yourPloneSiteId/portal_css/manage_cssForm" also make sure that ploneCustom.css is actually on the list and enabled, meaning the checkbox on the left is checked. It should be the last entry in order to override all other stylesheets.

2.) Use a site's page as style-source

Alternatively you can have a look at "adi.ttw_styles" (disclaimer: I'm the author), which provides you with a stylesheet living in the site as an ordinary item of type "Page" and is registered as a browser-based resource, so naming-conflicts are impossible. Still, the stylesheet lives in the site then, which wouldn't be suitable for cases, where you want to have a reproducable theme.

3.) Include browser-based resources in your addon (f.k.a. "Product")

Well documented. An addon-generator, which allows you to create an addon holding a browser-based stylesheet and javascript, is "adi.devgen" (disclaiming again: I'm the author), after installation simply execute devgen addBrowserSkel your.addonname of the commandline.

4.) Diazo

The widely promoted state-of-the-art-way-of-theming. Well documented, have fun learning XLST :-)