Output The Featured Image in a Loop as a Linked Media Image

September 18, 2018| 2 comments

Instead of linking a featured image to a post permalink in a loop – here is how you can link to its original image of itself.

<?php
// Create the variable for the large image src link
$large_image_url = wp_get_attachment_image_src( get_post_thumbnail_id(), 'large' );
// Out the Post Title Using the post permalink for the post link - then the image which links to its large size
?>
<h3><a href="<?php the_permalink(); ?>" rel="bookmark" title="<?php the_title_attribute(); ?>"><?php the_title(); ?></a></h3>
<a class="lightboxclassname" href="<?php echo $large_image_url[0]; ?>" title="<?php the_title_attribute(); ?>" >
<?php the_post_thumbnail('medium'); ?></a>
view raw image.php hosted with ❤ by GitHub

So above, the title and featured image is output of a post – the title has a link to the post whilst the image is linked to itself via the $large_image_url which uses the first value in the array [0] which is the src value.

Further more a lightbox CSS class name can be triggered so a bunch of featured images can be viewed in an archive loop page without going to the single post page

2 comments

  • Thomas
    7 years ago Reply

    Thanks for sharing.
    Could you please elaborate on the last paragraph a little bit ? Thanks,
    “Further more a lightbox CSS class name can be triggered so a bunch of featured images can be viewed in an archive loop page without going to the single post page”

Leave your comment