get-images-attached-to-post

Find all Images (Except the Featured Image) Attached to a WordPress Post or Page

I recently had the need to return all images that were imported into a WordPress post or page (except the featured image). Since my specific use will likely be of no use to you, I’ve reproduced some generic examples here of how the feature might be used.

Return an Array of Attached Images to a Post

The following function will return an array of all image URLs (except the featured image) attached to a post. The post ID can be the current post, or any other.

An Example Shortcode Function

The following shortcode function is pretty basic and is unlikely to serve any noble purpose. It’ll simply render all the attached images (from any post) on your page.

For example, to display all the images from this post, we would use [postimagestest id="1234"] (where 1234 is your post ID). The result:

http://www.internoetics.com/wp-content/uploads/2015/11/twitter-single-cat.jpg
http://www.internoetics.com/wp-content/uploads/2015/11/three-twitter-images.jpg
http://www.internoetics.com/wp-content/uploads/2015/11/twitter-images-local.jpg
http://www.internoetics.com/wp-content/uploads/2015/11/twitter-four-images.jpg
http://www.internoetics.com/wp-content/uploads/2015/11/images-to-twitter.jpg

From this list you could then iterate over the results and create a gallery, an image index… or whatever.

In some cases, and assuming you had a need to print URLs to your post (why?), they may overlap and look messy. To mitigate this, you might consider WordPress’ url_shorten function that’ll simply truncate the URL. All it does is strip the http://www and truncates the remaining URL to 35 characters, including ‘…’. Personally, I don’t like it – all URLs will look the same. I’d prefer to use our own function which strips the middle of the string – meaning that the image reference is preserved.

If displaying URLs, consider truncating. Image from Twenty Fifteen.

Alternatively, use something like a substr function and then, depending upon the length of your domain name, split the URL into a chunked array and use a defined start and end length. I’ve used the substr approach in the example shortcode function below.

http://www.internoetics.com/wp-cont...itter-single-cat.jpg
http://www.internoetics.com/wp-cont...e-twitter-images.jpg
http://www.internoetics.com/wp-cont...ter-images-local.jpg
http://www.internoetics.com/wp-cont...tter-four-images.jpg
http://www.internoetics.com/wp-cont...mages-to-twitter.jpg

The sample shortcode function is as follows (not for real world use):

Using the same function we can start to demonstrate how you might use it to create a gallery. Of course, you would select or create an appropriate image size and then align them in responsive rows. We’re just outputting the thumbnail image (that’s automatically created) in a tower. The shortcode: [postimages parent="3325" url="0"].

Again, it’s not a real-world example, just a proof that you can use to build your own stuff.

Considerations

  • You can get the image title (since you have the ID) with the code of $attachmenttitle = get_the_title($id);. This might come in handy if you were creating an image “index”. In fact, you could loop through all your published posts and generate a paginated index with nice scaled thumbnails. If the image had a title, you could display it and use it as an alt tag.
  • Need to search for all PDF documents attached to a page? Use 'post_mime_type' => 'application/pdf' in your query. This should work for any file type you can upload through WP’s media library.
  • If you wanted to print a summary of images attached to a post in a page index or similar (something I’ll be doing in an upcoming project) you might consider getting image meta data with the following function (or similar):

If you wanted to test the function, use the following shortcode function so you know what kind of data the function returns:

(Close the pre tags… I’ve removed them for formatting).

In my case, [attachmentdatatest id="3890"] returns the following array:

Array
(
    [alt] => Overlapping URLs look dirty. Consider truncating them.
    [caption] => Overlapping URLs look dirty. Consider truncating them.
    [description] => Overlapping URLs look dirty. Consider truncating them.
    [href] => http://www.internoetics.com/2016/07/03/return-images-except-featured-attached-wordpress-post-page/overlapping-url/
    [src] => http://www.internoetics.com/wp-content/uploads/2016/07/overlapping-url.jpg
    [title] => Overlapping URLs
)
  • Alternatively (to the above function, or in addition to) consider retrieving attached meta data with WP’s wp_get_attachment_metadata function (particularly if you’re interested in the image_meta data, that, in part, returns camera type, timestamp, and shutter speed).
  • If uploading images that aren’t attached to a parent post and you would like to emulate what we’ve described above, you could perhaps explode a string of comma separated IDs and then loop over them individually.

Conclusion

As you can see, working with image (and other) attachments doesn’t have to be difficult. If you’re after a specific feature, send a message through and I’ll provide some examples.

Shortt URL for this post:

Leave a Reply

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