Dynamically generating CSS using PHP

Dynamically generating CSS using PHP

by Rob Davenport -
Number of replies: 5

Hi,

How can I create CSS using PHP, where things like categoryIDs have been looked up?

Background: I'm currently upgrading a custom Theme (based on Clean, Moodle 2.7) to manage 100+ banners, based on the second level category (regardless of how deep in the hierarchy the course is). I've got this working (the hard bit basically done - looking up the category IDs, and adding them to the body classes and the basic CSS to implement them).

The relevant banner images will be inserted in a subdirectory in the theme folder, and simply named [categoryID].jpg.

To implement the 100+ banners requires 2 CSS definitions to be applied for each - so the CSS file will end up with 200+ CSS definitions, of which only 2 will ever be used at any 1 time. The only difference between the CSS definitions in each case will be the categoryID references.

For example, one of the CSS definitions looks like this:

.category-7 #left-main-row {
    background-image: url([[pix:theme|category_banners/7]]);
}

If I can use a variable in place of the 7, based on lookups and output from PHP, it will save a lot unnecessary CSS.
Or is this not possible due to caching of styles?
Or do I loose caching ability, and therefore end up much worse off?

I've tried adding a style sheet in the config that points to a PHP file instead of a CSS file with no result.

Is writing CSS in-page headers for the layouts a better option - avoiding and not affecting Theme CSS caching entirely?

Any help much appreciated as to the right approach - even if it means static CSS at the end of the day if that is the best option... That's what I need to know.

Average of ratings: -
In reply to Rob Davenport

Re: Dynamically generating CSS using PHP

by Gareth J Barnard -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers

Even using the PHP LESS compiler as used in More, Campus and Shoelace will not work because only used when a setting changes or a 'Purge all caches'.  Thus use $OUTPUT->pix_url() instead and override in the appropriate renderer.  Then you will not have to use CSS.

In reply to Rob Davenport

Re: Dynamically generating CSS using PHP

by David Scotson -
Simply using 200 lines of CSS is the best solution here. That's a drop in the ocean compared with the existing CSS and, as you say, you'd be causing extra delays and performance issues by doing it any other way.

You mention you've already written the PHP side, but I think there's a built in feature (allow category themes) that will automatically add the category ids to the page body tag. It's not clear if you're using that or not. It'll add it for every category in the hierarchy, but if you only supply CSS that targets the second level then that should be fine.
In reply to David Scotson

Re: Dynamically generating CSS using PHP

by Rob Davenport -

Thanks David (& Gareth),

I didn't realise by enabling 'allow category themes' would automatically add the category ID hierarchy to the body tag. I'm sure Moodle's core PHP would be more optimised than mine, so I'll check that out.

Cheers, Rob.

In reply to Rob Davenport

Re: Dynamically generating CSS using PHP

by Mary Evans -
Picture of Core developers Picture of Documentation writers Picture of Peer reviewers Picture of Plugin developers Picture of Testers

Hi, Rob,

The category bodyclass is added automatically without having to enable anything. I think David got that wrong!!!

To check just see the source code for any page in Moodle and the category will be present...or should be.

For example in this forum page you can see the category.

<body id="page-mod-forum-post" class="format-topics path-mod path-mod-forum gecko dir-ltr lang-en yui-skin-sam yui3-skin-sam moodle-org pagelayout-incourse course-5 context-115 cmid-46 category-3 two-column has-region-side-post used-region-side-post side-post-only jsenabled dndsupported">

Cheers

Mary