Alternative way to add panel CSS

The CMS Solutions
1

Most of us probably know about the most common way to add a CSS file to the panel:

https://getkirby.com/docs/developer-guide/panel/css

c::set(‘panel.stylesheet’, ‘assets/css/panel.css’);

I needed to add multiple CSS files to my panel, one from a plugin and one from another plugin. I’m already using the set feature so it felt natural to use it here as well.

The result

In a plugin I added this:

kirby()->set('option', 'panel.stylesheet', array(
	'assets/plugins/my-plugin/css/panel.css',
	'assets/css/panel.css'
));
  • Using kirby()->set() to register the panel.stylesheet.
  • Adding an array with file urls.

I was surpriced that both changes work, especially multiple CSS files as I did not find any info about it in the docs.

Why multiple CSS files

Let’s say there are two great plugins out there that both has a panel.css file. You don’t want to hack the core any these plugins. Instead you can make the third plugin that just set the panel css files. The benefit is when the other two plugins are updated. If they are updated with new CSS code it will just work.

Maybe not everyone will have this case, but I did and it’s great that it just works! :slight_smile:

3 Likes
2

Hi !

This could be very helpful for my project, so I put those code lines in config.php .

And I get this error message in the console :

Resource interpreted as Stylesheet but transferred with MIME type text/html: "http://localhost:8888/my_project/".

Even if I get the good css link in the header :

<link rel="stylesheet" href="http://localhost:8888/my_project/assets/css/my_css.css">

Do you have a clue for what is happening here ? Did you see that too ?

Thanks !