Theming Your WordPress Gallery

Last week I wrote about using the WordPress Gallery and EXIF features, introduced in WordPress 2.5. This week I want to explain how to create your large photo theme file.

Last week (if you’ve not read last week’s post, I do recommend it before proceeding!) you may remember that I mentioned that when you click one of the thumbnails it will display the medium sized photo, and that you should be able to create a theme name image.php to control this display, otherwise the single.php file would be used. However, at the time I duplicated single.php to image.php and the image didn’t display.

Well, after a bit of research I’ve found the tags required to get these images displaying. Again, lack of information on the web didn’t help! I actually found this information in the image.php file in the default theme (somewhere I don’t tend to look as it’s not coded very well!), so it may be useful to open that file up and have a look yourself, but I’ll explain the tags here. Note, none of these are echoed out by default.

get_permalink($post->post_parent)
This returns the link to the gallery post that contains that photo.
get_the_title($post->post_parent)
Returns the title of the gallery post that contains the photo.
wp_get_attachment_url($post->ID)
This will get the link to the original image (useful if the originally uploaded image is a lot larger than can fit on the single image display page).
wp_get_attachment_image( $post->ID, ‘medium’ )
This returns the full image tag with the source as the medium sized image. You can change the ‘medium’ parameter to be ‘full’ if you want to display the original, unresized image
the_excerpt()
This will print the caption given to the photo
the_content()
This will print out the full description given to the photo
previous_image_link()
This will echo out a link to the previous image in the gallery as a linked thumbnail
next_image_link()
This will echo out a link to the next image in the gallery as a linked thumbnail

For the last two options, only the previous and next thumbnails are displayed and linked to. Not something I’d personally want to have. Luckily a plugin to create plain text links is available from Full Throttle Development.

So with these tags, plus the EXIF data, you can create a more customised single image page. Remember, these tags need to be kept within the loop, so if you take your single.php theme file as a guide, and alter what you need to in that, then you should be fine. Putting this into practice should give you final code of:

[sourcecode language=”php”]< ?php if (have_posts()) : while (have_posts()) : the_post(); ?>

post_parent); ?>” rev=”attachment”>< ?php echo get_the_title($post->post_parent); ?>
< ?php echo wp_get_attachment_image( $post->ID, ‘full’ );
the_content();
$meta = wp_get_attachment_metadata( $id );

echo “

    \n”;
    echo “
  • Dimensions: ” . $meta[‘width’].” x “.$meta[‘height’].”
  • \n”;
    echo “

  • Aperture: f/” . $meta[‘image_meta’][‘aperture’].”
  • \n”;
    echo “

  • Camera: ” . $meta[‘image_meta’][‘camera’].”
  • \n”;
    echo “

  • Date Taken: ” . date(“d/m/Y H:i”, $meta[‘image_meta’][‘created_timestamp’]).”
  • \n”;
    echo “

  • Copyright: ” . $meta[‘image_meta’][‘copyright’].”
  • \n”;
    echo “

  • Focal Length: ” . $meta[‘image_meta’][‘focal_length’].”mm
  • \n”;
    echo “

  • ISO: ” . $meta[‘image_meta’][‘iso’].”
  • \n”;
    echo “

  • Shutter Speed: ” . number_format($meta[‘image_meta’][‘shutter_speed’],3).” seconds
  • \n”;
    echo “

“;
?>

< ?php comments_template(); endwhile; else: ?>

Sorry, no attachments matched your criteria.

< ?php endif; ?>[/sourcecode]

This puts your full size image above your description and EXIF data, with next and previous thumbnail links and the comment form at the bottom.

Next week I’ll explain how you can modify your index theme file to list your gallery and normal blog posts together, neatly.

(Code not working? Be sure to remove the additional space between the <? and php. It’s added by the code plugin unfortunately)

Disclosure: In full disclosure, it is safe to assume that the site owner is benefiting financially or otherwise from everything you click on, read, or look at while on my website. This is not to say that is the case with all content, as all publications on the site are original and written to provide value and references to our audience.

8 Comments

  1. John Young | We Have July 28, 2008
  2. Sarah July 28, 2008
  3. Elaine July 29, 2008
  4. Elaine July 29, 2008
  5. Elaine July 29, 2008
  6. Sarah July 29, 2008
  7. Elaine July 29, 2008
  8. Sarah July 29, 2008