Building a photoblog off of a weblog

August 01, 2006

Update (2): While the previous update intimated that I wouldn't have to modify anything in the WordPress source should I choose to go the route outlined in this post, I've come to think that isn't possible. It looks like I'm going to have to modify both functions so that they return only the actual URI and nothing else. The changes themselves are very simple, but it's just one more thing to keep track of when upgrading next time around.

Update (1): The possible issue I mentioned at the bottom of this post is not an issue it all. Turns out that WordPress has arguments built into the next_post_link() and previous_post_link() functions that "indicate whether the next/previous post links must be in the same category/categories as [the current post]." Yay, one less plugin to write if I end up taking this approach.

All this talk about getting the photoblog up and running has really sent my mind into overdrive trying to come up with a simple solution that would allow me to use the same backend (and subsequently the same posts) to power two completely separate sites (i.e., the weblog and the photoblog), instead of using an "external" photoblog application. More to the point, I want to continue posting pictures to the weblog as I've been doing for a while, but I also want to use those same posts as entries into a separate photoblog, which will use the various elements of the posts differently than the weblog.

The benefits of such a sysem are two-fold. First of all, it would ultimately be less work for me once it's all up and running (i.e., I would just post once as normal and the rest would be handled automatically). Second of all, if there comes a time in the future when I don't want to have a separate photoblog anymore, I can just discontinue it without losing everything that went into it (i.e., it will all be saved as just a regular part of the weblog).

I think I may have come up with a solution and am going to throw it out there to see what kind of response it gets. To me, this seems like the most elegant way to go about it and it minimizes the probability of future problems (e.g., if you change to a different CMS) as it's as bare bones as possible and all you'll really ever need to change is the code that specifies the file size (because presumably any CMS you move to will easily map to the post elements I discuss below).

The very simple solution

To start with, let's list the various pages that will need to access and manipulate the photography posts:

  • Weblog index page
  • Weblog yearly/monthly/individual archive pages
  • Weblog RSS feed
  • Photoblog single-photo page
  • Photoblog thumbnail page
  • Photoblog RSS feed

Each of the above pages will need at least one of the photo sizes listed below:

  • Small -- 85 pixels wide (for the page of thumbnails)
  • Medium -- 500 pixels wide (for the weblog)
  • Large -- 800 pixels wide (for the single-photo pages of the photoblog)

These images will be created and uploaded to the site as filename-s.jpg, filename-m.jpg, and filename-l.jpg, which correspond to the three different sizes.

Looking at WordPress, we see that it gives us just three [post] variables to work with, namely title, content, and excerpt. We'll use these variables in the following way:

  • Title -- as you would expect
  • Content -- description of/thoughts on the photo
  • Excerpt -- the filename of the photo without the suffix

So, the excerpt will contain the filename of the photo, but will not specify any particular size. However, we can use PHP (or whatever) to append the correct size (i.e., -s, -m, or -l) to the filename, and we will know the correct size because this can be hard-coded depending on which template we're using (e.g., weblog index).

Walk-through

When the system is fully functional and all the code is in place, it should work something like this when publishing a new picture:

  • Work some Photoshop magic on the next picture we want to put up.
  • Save the image to a temp directory.
  • Run a shell script that will create three images from the original: one 500 pixels wide (constrain proportions), one 800 pixels wide (constrain proportions), and one 85 pixels wide as per my earlier request for help.
  • The above script will name the files based on the original filename (e.g., if the file was originally saved as filename.jpg, it will create filename-s.jpg, etc.)
  • Upload these files to our webserver.
  • Create a new post in WordPress. Remember, in the excerpt field we're going to want to put the filename without the extension or size identifier.
  • Be sure to put the post into a "photos" (or similar) category so that we can separate these posts from non-photo posts.
  • That's it! The various templates will add the needed file paths and will use the correct filename depending on the page being generated.

If you can shoot any holes in this approach please e-mail me and let me know. The only thing I haven't given too much thought to is how I'm going to create the next/previous links needed for the photoblog. This could be a bit tricky because the links will have to be confined only to those posts categorized as "photos" (or whatever). I haven't looked yet, but perhaps this functionality is built into WordPress. If not, I could probably write a plugin, but I'd rather stay away from non-standard band-aids if at all possible.

You should follow me on Twitter here