This post was written by Markus Stefanko

Display Thumbnails with Pods

In WordPress you often times want to show smaller sized versions of an image, e.g. the featured image of the post. There are a few applications and methods to accomplish the display of thumbnails with Pods Framework in WordPress. Pods has an especially useful one, as it forces the creation of the thumbnails if they are missing.

Let’s say we’d like to display a smaller sized version of an image we uploaded for a ‘cars’-pod to a field called ‘picture’. The size of the thumbnail we have previously defined as ‘thumbnail’ with add_image_size('thumbnail', 100, 100, 1). See the add_image_size documentation for more info on the parameters.

( If you don’t want to use a thumbnail handler yet, since you’re testing, you can go and specify the width and height in a simple array(100,100) instead. )

Now let’s display the picture we uploaded in a 100×100 size that we defined as thumbnail, cropped with the pods_image function:

$car = pods('cars', $car_id_or_slug);

$thumbnail = pods_image( 
    $car->field( 'picture', TRUE ),
        'alt' => trim( strip_tags( $fun->field( 'name' ) ) ),
        'title' => trim( strip_tags( $fun->field( 'name' ) ) )

echo $thumbnail;

This is the equivalent of the WordPress function wp_get_attachment_image, however with one main difference : the last parameter forces the thumbnail creation, which comes in very handy while experimenting with different thumbnail sizes. In case pods_image doesn’t find the corresponding thumbnail, it will create one.

Usually when working with different thumbnail sizes, you would run a Thumbnail rebuild tool, e.g. the AJAX Thumbnail Rebuild plugin. This would fall away now with the powerful pods_image feature – which would also save you considerable disk space and files amount as it would only create the thumbnails that need to be displayed when they get requested ( or uploaded after this implementation ).

It might be worth considering to stay away from declaring the thumbnail size if you upload many images, but only show a few images in that thumbnail size. As upon media query upload WordPress would always create an image version for each particular image; while forcing the creation with pods doesn’t require you to create such at upload time.

And as a final note – If you want to have more control over how the cropped thumbnail look like due to centering and cropping, you should check out the Post Thumbnail Editor plugin for a manual retouch.

These are the methods and plugins we are using when handling Thumbnails with WordPress and Pods currently, hope this proves useful to you as well.

by Markus Stefanko