// 30.May.2009

Pretty Ampersands & My First WordPress Plugin

Last night I stumbled across Dan Cederholm's article, Use the Best Available Ampersand and, for whatever reason, it struck a chord with me. I knew immediately that I would have to follow Cederholm's lead and add some ampersand loving to the Urban Mainframe.

In his article, Cederholm describes applying a CSS class to ampersands to apply a more attractive typeface to them. Great, but that means that I'd have to remember to use that class everytime I used the ampersand character and that's more effort than I want to expend. So I decided to write a WordPress plugin to automate the process.

Smart & Sexy

Pretty Ampersands takes the output from WordPress (your web page) and wraps the ampersands it finds in HTML span tags, applying a class of ampersand.

So the following HTML:
<p>The & character is really rather pretty!</p>

would become:
<p>The <span class="ampersand">&</span> character is really rather pretty!</p>

The ampersand can then be styled in CSS with something like this:
/* Pretty Ampersand */
.ampersand { font-family: Baskerville, Palatino, "Palatino Linotype", Constantia, "Book Antiqua", serif; font-style: italic; font-size: 1.1em; }

The plugin will only process ampersands that have a whitespace as both a prefix and suffix. Ampersands within title and alt attributes are ignored, as are those within <title> ... </title> tags.

Downloading & Installation

Download the Pretty Ampersands plugin (3.7KB).

  1. Unzip the archive.
  2. Upload the pretty-amp folder into your WordPress plugins directory.
  3. Activate the plugin on the WordPress Plugins page.
  4. Define your CSS.
  5. Sit back and enjoy beautiful ampersands.

Praise & Criticism

This is my first WordPress plugin and thus is a learning opportunity for me. If you use the plugin I'd appreciate your feedback. If there are edge-cases where the plugin messes things up then let me know — and I'll fix them.

If you're a plugin author, then I'd really appreciate it if you'd take a look at the plugin source code to see if I've missed anything that should be present in a well-formed WordPress plugin. I'm particularly interested in learning what I have to do to let users of the plugin be automatically notified of revisions — as I haven't yet figured that out.

Revision History

  • 30th May, 2009: Initial release (v 0.0.7)
  • 29th December, 2009: Fixed WP 2.9.1 incompatibility. Thanks to Jordan for the heads up. (v 0.0.8)

Last Revision: December 29th, 2009 at 01:30

13 Comments for “Pretty Ampersands & My First WordPress Plugin”

  1. Pretty decent. I believe other WordPress plugins are available who do the same thing, though. Also, one doesn’t generally use ampersands that much, at least in text. But never mind that.

    I believe you’re supposed to upload things to the official WordPress plugin directory, though, and then all the dudey-tastic automatic revision notifications, will be enabled, along with installation from the admin panel etc (no faffing with zips) in the latest versions.

    I’ve tried to make a WordPress plugin, one that can allow integration of the marvellous Textile “humane Web text generator” - bizarrely, the few plugins who are available are all out-of-date and don’t work. It should be easy - just download it, and do a bit of witchcraft with some kind of filter or something - but no-one’s done it. Perhaps you could do so, hint hint?

  2. Cool, will definately check this plugin out - what a good idea!

  3. Hmmm, the plugin doesn’t seem to work for me (in Wordpress 2.8). Spans simply don’t appear around the ampersands…

  4. @Josh: There are definitely other WordPress plug-ins that do this, but usually as part of some larger typography plug-in. I’m not too bothered by the duplication because: a) I wanted to learn how to write a plug-in, b) I wanted to learn how to the intercept the final output from WordPress for another project I have in mind and c) I wanted to scratch an itch!

    Thanks for the info on uploading to the WordPress plug-in repository, I suspected that might be the case. I’ll have to investigate that further when I get the time.

    I might take a look at the Textile thing at some point. It might be an interesting project and if there’s a demand for it…

    @James: Hmmm… I’m really not sure why the plug-in isn’t working for you. I’ve had it running on every WordPress version since 2.7 without modification. Perhaps there’s a conflict with another plug-in you’re using?

  5. Works like a charm! Thanks!

  6. Another satisfied customer. Cool. Cheers Matt.

  7. Doesn’t seem to be working with Wordpress 2.9.1. Nothing loads in the wp_head file.

  8. Hi Jordan. Thanks for letting me know about this. It’s not working for me in WP 2.9.1 either.

    I’ll fix it and post an update here. I’ll let you know when it’s fixed.


  9. Fixed now. The download link on this page is to the latest (fixed) release.

  10. Just wanted to come back here to say thank-you for updating the plugin for 2.9.1 Thanks a bunch

  11. No problem Jordan. Happy to be of service.

  12. This is a lovely plug-in. It’s light and does the job wonderfully, but it puts a in the meta data if you’re getting Wordpress to auto-poulate the meta from your post title/content and that content has an & in it. Wordpress then displays the meta as part of the page content I tested it running WP 2.9.1

  13. @Miles Dowsett

    I missed that one! Thanks for the heads up Miles. I’ll see if I can patch it over the next couple of days.

    Thank you for your input here, I really appreciate the feedback.