Two WordPress Plugins: Post Notes and Post Gallery

Posted: February 08, 2009 Comments

It’s no secret that Monday By Noon is powered by WordPress. I’ve been using WordPress for such a long time, I can’t remember which version it was I used first. The application serves my purposes for Monday By Noon perfectly and I’ve been nothing but happy with it entirely.

A big part of my love for WordPress is the community behind it. The plugins written for WordPress are a big part of what makes it so popular. I’m currently using sixteen active plugins on Monday By Noon, and I depend on each one to make my publishing life easier, all while improving the experience for each reader.

I’ve also mentioned a number of times that my company has our own home brewed content management system. Our CMS does quite a bit of work, and it does the work well. There are times, however, when we’ve realized that WordPress is simply a better solution for a particular job. There are certain features that WordPress has baked in that take us time to emulate with our CMS, and we’re not scared to admit that to a client.

A recent project of mine was one of those cases. The client requested a detailed feature list, something we were terribly thankful to have up front. From the start, we felt that WordPress would be the best solution, so we went with it.

The main feature the client wanted was the ability to append little text snippets to each of their posts. For lack of a better explanation; they wanted footnotes without footnote annotations. On top of that, the client requested the ability to add any number of images on a per-post basis to act as mini galleries of sorts. No problem, we just needed to find out which plugin(s) to use.

The plugin search begins

I’m the last person to want to reinvent the wheel, and I searched high and low for a plugin that would serve the purposes I was trying to meet. There are quite a few plugins out there that aim to make WordPress even more robust than it is, even going so far as to turn it into a full fledged content management system. I tried my hands at a couple of them, there had to be something out there that did what I wanted.

The first plugin I tried was Pods. I had first discovered the plugin a couple months ago during my searches and went ahead and installed it. I had a bit of difficulty figuring out exactly how to do, well, anything. It was during that time WordPress 2.7 was hitting the shelves. As I went to reference the documentation on the Pods website, I noticed that active development was happening, and before I knew it the site was completely redesigned. The new website was definitely helpful in seeing how Pods was meant to work. I realized that it was no longer suitable for what I was trying to accomplish, and I also had some activation problems I couldn’t figure out.

The other plugin I spent a gracious amount of time with was Flutter. Flutter is an impressive piece of work. The transition from WordPress 2.6 to 2.7 seemed to cause a few bumps in the road for the Flutter team, and it seems they’re still working diligently on the development front. Flutter is a very comprehensive plugin that will handle nearly everything you throw at it. Unfortunately, it was a bit too overbearing for this particular project. I will definitely be keeping my eyes on development, as I know I could have made great use of the plugin on some past client projects. The accomplishments made by the Flutter team are nothing short of impressive, despite the seemingly endless negative comments and forum posts on the website. Keep your eye on the plugin and give the developers time to accommodate everything they’re trying to get done.

At the end of the day, I didn’t find anything that was going to work without needing some hacking or some extravagant explanation. I decided it best to dig my heels in and write my own plugin.

My first plugin: Post Notes

The CMS-type plugins for WordPress were far too comprehensive, and most of the time resulted in strange data entry that would be confusing to explain to my client. I took it upon myself to write a plugin that would meet only one need: adding WYSIWYG notes to each post.

The plugin is as simple as that. After activation, you’ll have WYSIWYG editors added to your post screen, and you can manipulate your Post Notes in any way you’d like:

Pulling Notes to the front end in your template is as easy as throwing the following in The Loop:

<?php $post_notes = post_notes_get_notes(); ?>
<?php $total_notes = sizeof($post_notes); ?>
<?php if($total_notes>0) : ?>
  <?php for ($i = 0; $i < $total_notes; $i++) : ?>
    <div class="post-note">
      <div><?php echo $post_notes[$i]['text']; ?></div>
    </div>
  <?php endfor ?>
<?php endif ?>

The plugin is meant to be as straightforward as that.

Download at the Post Notes plugin page.

My second plugin: Post Gallery

My client also wanted the ability to append images to posts as well. Until recently, I’ve been accustomed to straying completely away from the WordPress provided post/page editor. I have it disabled everywhere, and I write my articles in TextMate. The extent of my interaction with the post editor in WordPress was pasting my already formatted article and moving on.

During my plugin search, I reached out to friends to see if anyone had heard of a plugin that lets you attach images on a per-post basis in a gallery fashion. A few strange looks from Colin Devroe and P.J. Onori later, I was promptly shown that WordPress has it built in. The features were even improved upon in the recent 2.7 release. There is even a Codex page dedicated to the Gallery Shortcode. My problem was solved!

That is, until I took a step back and thought about it. While it was great that I could use the built in image management capabilities of WordPress, the result was a formatted gallery inserted into the WYSIWYG portion of the edit post page. Further, it was possible for me to extract that content and use it in any way I liked via JavaScript, but it was hacky. I didn’t want to see the confusion on the face of my client when I tried to explain that “although your images are right there next to your content, it will be different on the website”.

I wanted something more catered to the client need, and I already had Post Notes written. Why not port the functionality to use images instead of WYSIWYG editors? So I did:

Pulling images for the current post is just as easy, again using the following in The Loop:

<?php $post_images = post_gallery_get_images(); ?>
<?php $total_images = sizeof($post_images); ?>
<?php if($total_images>0) : ?>
  <div class="post_gallery">
    <ul>
      <?php for ($i = 0; $i < $total_images; $i++) : ?>
        <li>
          <div class="image_title"><?php echo $post_images[$i]['image_title']; ?></div>
          <div class="image">
            <a href="/wp-content/plugins/post-gallery/thirdparty/phpthumb/phpThumb.php?src=/wp-content/plugins/post-gallery/uploads/<?php echo $post_images[$i]['image_location']; ?>&amp;w=500&amp;h=500&amp;zc=1" id="image_<?php echo $i+1; ?>">
              <img src="/wp-content/plugins/post-gallery/thirdparty/phpthumb/phpThumb.php?src=/wp-content/plugins/post-gallery/uploads/<?php echo $post_images[$i]['image_location']; ?>&amp;w=85&amp;h=85&amp;zc=1" alt="Thumbnail" />
            </a>
          </div>
          <div class="image_caption"><?php echo $post_images[$i]['image_caption']; ?></div>
        </li>
      <?php endfor ?>
    </ul>
  </div>
<?php endif ?>

Another very straightforward plugin, and merely an adaptation of Post Notes, but it suits my (and therefor my clients) needs perfectly.

I realize the sample code is a bit overbearing, but most of that can be attributed to the paths required for the image. The plugin uses phpThumb and comes bundled with it. If you’re already using phpThumb elsewhere, and don’t want to use the version included with this plugin, please feel free to use your own file paths.

Download at the Post Gallery plugin page.

Submitting the plugins

I’m in the process of submitting these plugins to the official Plugin Directory, and they should appear sooner than later. I’ve also set up plugin home pages for each, which will remain updated as well.

Update: The plugins have been accepted into the Plugin Directory:

I am going to redirect all of the download links to that page so the latest stable version is in a central location.

Get my newsletter

Receive periodic updates right in the mail!
  • This field is for validation purposes and should be left unchanged.

Comments

  1. Nice work on the plugins. I’d like to see the ability in the Gallery plugin to select images that are already in the media folder instead of uploading. I think the plugins are great as it is, though.

  2. @Kees de Bruin: Do you mean having the ability to select multiple images from the file select dialog? While that particular feature isn’t implemented, you can add more than one photo at a time before saving your draft or publishing.

  3. I installed it and it seems to be working fine however when i upload the image nothing happens the picture never comes up

    if someone could please help me that would be greatly appreciated…

  4. Thanks for your plugins, very nice work! however, i can’t seem to get post-gallery to upload the image…

    I title an image and then upload… the loading spinner anim goes then… nothing…

    I have WP 2.7 and was uploading very small .jpg files…

    any thoughts?

    Also, is there any possibility to modify this plug in to be able to upload multiple file formats…

    example: being able to upload a set of source files (PDF, tif, eps etc) to be associated with that particular post for production…

    thanks again!

  5. I had the same problem with uploading an image… after looking in the code to figure out where the plugin wants to save the files, I created the directory uploads in the post-gallery folder, and gave that upload folder the proper permissions.

    Maybe I was just plain blind… but I just couldnt find that in the installation instructions.

    Thanks for the plugin!

  6. Everything’s working fine, but I can’t seem to get the image overlay to work when images are clicked on as Roel above does. I’ve tried both Lightbox 2 and Slimbox as options. Do you have any suggestions?

  7. I will try the post gallery plugin as it fits with many of my clients’ needs. As Sheldon, I will like to see a feature as to attach a file (pdf) to a post, this could be a better and simple way to work with files in a post as opposite of the way WordPress works (with the media uploader). Thanks for sharing!

Leave a Reply

Your email address will not be published. Required fields are marked *