Developer plugin v1.1: Themers are developers too!

UPDATE: we regularly push updates to the developer plugin, make sure you grab the latest version here:

We’ve pushed out v1.1 of the Developer plugin, which is packed full of goodies for WordPress theme developers.

You can now indicate that you’re working on a theme for a self-hosted WordPress install to get recommendations on a number of must-have plugins as suggested by the Theme Team.

We also cleaned up a few things, fixed some bugs, added some new plugins (User Switching by John Blackbourn and Pig Latin by Nikolay Bachiyski) and some other useful resources (like the _s starter theme).

(Note: we also pushed out v1.1.1 shortly after to fix an issue with the plugin slug for the Pig Latin plugin. Thanks bobbingwide for the fix.)

As always, if you’d like to check out the code and contribute, join us on Github; pull requests, bug reports, and plugin recommendations are more than welcome.

New P2 Plugin: P2 Hovercards

We’ve released a new plugin for the P2 theme that we’re calling P2 Hovercards. Hovercards are like extra bits of information about particular links that show up when you hover the corresponding inline link or object (for example, check out our Gravatar Hovercards).

With this plugin you can add hovercards to your self-hosted P2 sites. A good example of this is core trac tickets. If you look at the Make WordPress Core blog, you’ll notice that tagged Core Trac tickets are automatically linked up. So, something like #12345 links to

With P2 Hovercards, we took this a step further. I can set it so that #12345 links to the right place, but then also show some additional information when you hover over the link. The following image is an example of what a hovercard could look like for that ticket:

You’ll notice that it gives all the necessary details about the ticket: description, recent comments, and related metadata like owner, status, and so on.

You can extend hovercards, of course, and use them for whatever service you want with a bit of code. Internally, we’re using the plugin to add details to links to support tickets, for example.

The plugin comes with a handy p2_hovercards_add_services() function for adding services:

if (function_exists( 'p2_hovercards_add_service' )
	p2_hovercards_add_service( $service, $pattern, $url, $ticket, $callback );

(Note: We recommend creating a child theme of P2 and adding the additional code to your functions.php file.)

Here’s a quick breakdown of the arguments:

  • $service is a string that is the name or slug of the service being added.
  • $pattern is a string that is the regex pattern for finding and linking up tags. For our Core Trac ticket example, you would use $pattern = '#(\d+)'
  • $url is a string that contains the regex replacement for the anchor tag that gets generated. Again, for the core trac ticket example, you would use $url = '<a href="$1">$0</a>'
  • $ticket is a string that contains the regex replacement for a ticket. Following the same example, you would use $ticket = '$1'
  • $callback is a callback function for generating the hovercard

The most basic callback looks something like this:

function core_trac_callback( $args ) {
	$id = (int) $args[ 'id' ];
	$url = esc_url( $args[ 'url' ] );
	$service = esc_attr( $args[ 'service' ] );

	// Do stuff with $id, $service, and $url

	return compact( 'title', 'subtitle', 'url', 'description', 'comments', 'meta' );

The first four things in the array ($title$subtitle$url, and $description) are just strings that will be displayed in the appropriate place on the card. The last two are a little more customizable depending what you want to do though.

Comments are stored in a 2-dimensional array with author, date, and comment fields. Meta is displayed as “Key: Value” in the black bar at the bottom of the hovercard.

More in-depth examples can be found in the examples.php file in the Github repository. As always, we invite you to join us on Github; pull requests and issues are always welcome.