Hacking wordpress to support per-post banner images

post-bannersI seem to be spending a lot of time with wordpress at the moment. It’s become so ubiquitous that it often makes far more sense to set it up and integrate with an existing app than to set up some other blogging system and re-train users. As a result I’ve been writing a few wordpress plugins. Most of them are too specialised to be worth sharing, but one seemed worth opening up…

Implementing a (not quite public yet) design recently I had need of a way to specify a banner image for each post. While wp has pretty good support for adding various media into the body of posts, this needed to sit outside the post body.

I whipped together a quick plugin to handle uploading a banner and storing its details in the metadata for the post. It was a simple process, nicely self-contained, except that the post edit form doesn’t have the appropriate enctype=”multipart/form-data”. I looked around for any hooks that would allow me to cleanly add attributes to the form tag, but in the end resorted to editing wp-admin/edit-form-advanced.php to add it.

I’d hoped that there’d be time to find a cleaner way to do all this before telling people about it—perhaps some javascript that hooks into the existing media selector but allows it to populate a custom data field?—but it hasn’t, so I’m throwing it out there to the wider world as-is. The code is at github. Feel free to take it and use it as-is, to fork it and update it to be a better wordpress citizen, to email me patches to apply to my copy, or even to employ me to spend more time cleaning it up! Either way, it deserves to be out in the open and hopefully it’ll be of us to somebody besides me.

Tags: , , , ,

4 comments

  1. hey!
    this is exactly what i’m looking for! onfortunately i don’t fully understand where i need to put the provided code snippets. Could you maybe explain?
    I was all excited about using wordpress instead of building a custom cms myself but i get the feeling that sometimes it lacks some basic features in favour of very sophisticated ones..

  2. @gardene – the majority of the code can just be dropped in as a plugin, but you’ll also need to edit wp-admin/edit-form-advanced.php to make the form have an enctype of multipart/form-data

  3. hey, managed to get it working! thanks! would it be complicated to implement this for pages as well? would i have to rewrite the whole plugin?

  4. managed to activate this for pages by changing the following parts:

    in post-banners.php, function post_banners_add_custom_box(), add:
    add_meta_box(‘post_banners_input’, __(‘Post Banner Image’), ‘post_banners_input’, ‘page’, ‘normal’, ‘high’);

    in wp-admin/edit-page-form.php, add the above mentioned enctype=”multipart/form-data”

    then retrieve the image in your theme with: echo get_post_meta($post->ID, “post_banner_image”, true);

    thanks!