This is day 23 of my WordPress Developer Advent Calendar. Lately, there has been a lot of buzz around WordPress admin color schemes. Sarah published a post on the Tavern which gives you a few options:
- Admin Color Schemes - add 8 new color schemes to your admin.
- HS Custom Admin Theme - a plugin to create your own custom color schemes. - seems to have been pulled from the repo!
- Create a Custom WordPress Admin Color Scheme - a post by my friend Matt who walks you through creating your own color scheme.
So this got me thinking… wouldn’t it be cool if you could enter a few colors into a generator and it spits out a stand-alone WordPress plugin which contains the custom color scheme? Nothing more, nothing less. If you are a freelancer, this would be really cool, cause you can generate a personalized color scheme plugin for an individual customer. Well, I built it! And it’s a WordPress plugin too. So this plugin generates other plugins.
Admin Color Scheme Generator Plugin
I have installed it on my blog and you can test it out right here, right now! The code for the plugin is on Github, so take a look and contribute if you feel like it.
Under the Hood
I borrowed some ideas from the Admin Color Schemes plugin, in the way that is uses SASS to easily create a color scheme stylesheet from literally 5 lines of SASS code:
$base-color: #0c4da1; $highlight-color: #ed5793; $notification-color: #43db2a; $action-color: #eb853b; @import "wordpress-admin-color-scheme-generator/--/wordpress-admin-color-scheme-generator/--/admin.css";
I found a cool PHP SASS compiler, called phpscss, which I use to generate the actual stylesheet in the zip. Just include the scss.inc.php file and the rest is easy:
require_once 'includes/phpscss/scss.inc.php'; $scss = new scssc(); $css = $scss->compile( $scss_code );
I also borrowed a lot from the underscores.me generator code, but more about that in my next post.