How to Create a Custom Single Attachments Template in WordPress

In the process of creating a total gallery display in WordPress powered by Custom Post Types, we have shared the code for how to get all post attachments in WordPress except for Featured Image. We have also showed you how to add additional fields to the WordPress Media uploader. In this article, we will show you how to use the additional fields in the media uploader and display them in a custom single attachments template.

Before we start, it is important that you understand how the template hierarchy works for attachments. You can either specify it like mime_type.php. Mime type examples (image.php, video.php, application.php etc). For specifying it just for a certain image type, you can say image_gif.php. If the mime_type.php is not found, then it looks for attachment.php, then single-attachment.php, then single.php, then index.php.

It depends on how custom of a project you are working for, you may not need to create image_gif.php. You can simply suffice for image.php or even attachment.php.

All you have to do is open a blank file and copy all of your single.php content in there. You can save it as single-attachment.php or any other mime_type that you want. Then replace the loop code with something like this:

  <?php  if ( have_posts() ) : while ( have_posts() ) : the_post();  $photographer = get_post_meta($post->ID, 'be_photographer_name', true);  $photographerurl = get_post_meta($post->ID, 'be_photographer_url', true);  ?>    <h1><?php the_title(); ?></h1>    <div class="photometa"><span class="photographername"><?php echo $photographer; ?></span> // <a href="<?php echo $photographerurl ?>" target="_blank" class="photographerurl"><?php echo $photographerurl ?></a></div>                            <div class="entry-attachment">  <?php if ( wp_attachment_is_image( $post->id ) ) : $att_image = wp_get_attachment_image_src( $post->id, "full"); ?>                          <p class="attachment"><a href="<?php echo wp_get_attachment_url($post->id); ?>" title="<?php the_title(); ?>" rel="attachment"><img src="<?php echo $att_image[0];?>" width="<?php echo $att_image[1];?>" height="<?php echo $att_image[2];?>"  class="attachment-medium" alt="<?php $post->post_excerpt; ?>" /></a>                          </p>  <?php else : ?>                          <a href="<?php echo wp_get_attachment_url($post->ID) ?>" title="<?php echo wp_specialchars( get_the_title($post->ID), 1 ) ?>" rel="attachment"><?php echo basename($post->guid) ?></a>  <?php endif; ?>                          </div>    <?php endwhile; ?>    <?php endif; ?>    

The code above simply displays the Image Title. Below it, it will display Author’s name and URL which we added as additional fields in our previous article. Then it looks for the image and displays the full size. You can customize it to show any other size if you have additional image sizes.

Final Outcome:

Now that we have covered all three main aspects of this gallery that we were going to create, in the next article, we will show you how it looks when all things are pieced together. This way, you can use WordPress’s built-in mechanism to create a full-featured gallery with albums. No extra plugins required.

Resource:
Template Hierarchy Codex