Snippet CSS autoloading

Kirby 3 Questions 🤔
1

I am wondering if it would be possible to autoload snippet CSS files?

The documentation has a section about autoloading template CSS files. Something convenient like this would be good for snippets too: css() | Kirby CMS

This forum post mentions a workaround: CSS splitting with blocks & snippets

Should I make a feature request for that? I only found some requests for blocks and/or plugins in Nolt. Or is there a “hack” without using output buffering? Sounds a bit slow to me, especially with many snippets.

2

I’ve tried to alter the page object and register snippets inside the snippet() helper. But realized later, that snippets are executed too late. :sweat_smile:

The linked workaround with output buffering doesn’t work either, unfortunately. The callback function doesn’t do anything. Weird.

Putting the css() helper inside the snippet template works, of course, but is it suitable? I have searched the web for downsides of placing link tags inside body and only found issues if these styles affect HTML elements before the link tag. The newest HTML5 specification seems to allow that.

Is there anything that speaks against this approach?

3

Putting the the styles and potential scripts inline should probably work most of the time. But you will end up with duplicates if you use the snippet more than once (probably only problematic for scripts).

I have modified a little plugin from an old project of mine. Perhaps this helps as a starting point for a plugin of your own for this specific project.

As the resolving logic for assets is highly dependent on your tech stack and how your build styles and scripts (SCSS, TypeScript, Vite, Webpack …) it is not a one fits all solution.

4

That’s brilliant, thank you very much.

I don’t quite understand what’s going on, but it’s a good starting point!