A life in the day

I’ve created my first WordPress plugin. It allows you to add your own stylesheets independent of the chosen theme. You can download it at http://scott.sauyet.com/php/wp-plugins/stylesheets/. Install is the standard, unzip, drop it in the plugins directory, and activate. It adds a panel to the managment page.

The genesis of this plugin was a little itch I had to scratch: I’ve been playing with themes for my blog. Someday I’ll get around to writing my own, but for now I’m working with many of the beautiful options available online. The trouble is that I kept having to patch the stylesheets with a little extra CSS that I was using on my site. I have some health issues that I’m tracking with markup that looks like this:

    I’m at <strong class="good reading">78</strong>, which is in the
    target range of below <strong class="target reading">100</strong>.

which in this blog looks like:

I’m at 78, which is in the target range of below 100.

and of course sometimes there’s a "class='bad reading'" too. To go along with this, I’d been adding a tiny bit of CSS to the stylesheet for each theme I tested. This is tedious and error-prone, and seems to be against the spirit of WordPress.

So when I started to understand the plugin architecture, I created a tiny plugin that added the necessary CSS to the head of the document. Then I switched to an extenal call to the stylesheet. After that, I arranged for the call to the stylesheet to call through the plugin itself. At this point I realized that these techniques could be useful to others. So I’ve generalized it quite a bit, and tried to reasonably bulletproof it.

I think it’s straightforward to use, and self-documenting. It allows you to create as many separate stylesheets as you like, each one including as much CSS as you choose, linked or imported (maybe later I’ll add the option to include the CSS directly in the head), and associated with whatever collection of media you wish. You can also choose to hide any of these stylesheets.

I’m pretty happy with the results, but so far I am the only user. I would love to hear feedback from WordPress users.

I would also love to hear from others who know more about building WordPress plugins about whether anything I’m doing is considered somehow incorrect. I really would prefer to make this a more OO design, but my PHP skills are only so-so, and I don’t know much about how to convert it. I’ve created my own namespace by prefixing all variables and functions with “stylesheets_” but that’s clearly not an ideal option. Beyond that, are there better ways to accomplish what I’ve done here? Please let me know. It’s also quite possible that WP has some technique built-in that I don’t know to accomplish the same thing.

To the user of the web site, all they will get is additional calls in the document head for something like either

    <link rel="stylesheet" type="text/css" media="screen, projection"
          href="http://my-blog.com/wp-content/plugins/stylesheets.php/my-styles.css" />

or

    <style type="text/css">
        @import url(http://my-blog.com/wp-content/plugins/stylesheets.php/my-styles.css) screen, projection;
    </style>

The stylesheets are stored in the options table, along with meta information including their names and the media to which they apply. This means that there is no need to add a table to the database to support the plugin. I don’t know if that is in keeping with the normal use of the options table. Perhaps not.

In the management page, you can edit an existing stylesheet and its meta information, add a new stylesheet, or delete one.

The code is entirely undocumented. It’s clear enough to me, but I don’t know how others would see it. I’m more than willing to answer any questions.

Comments are welcome either as responses to this post or via email, at scott AT sauyet DOT com.