[Support request] Clickable featured image on single post/page

[Bas]

Perhaps a stupid question about something I believe is a standard feature on other themes, but I couldn’t find it in GP:

How can I make the featured images on the single posts and pages ‘clickable’ and linking to the original image?

I’m using the Photoswipe lightbox.

[David]

Hi there,

try this PHP Snippet:

add_filter( 'generate_single_featured_image_html', 'custom_add_post_thumbnail_link',25,1 );
function custom_add_post_thumbnail_link($image_html) {
    if( $image_html == '' ) {
        $image_html = $image_html;
    } else {
        $large_image_url = wp_get_attachment_image_src( get_post_thumbnail_id(), 'large');
        $linked_html = '<a href="' . $large_image_url[0] . '">' . $image_html . '</a>';
    }
    return $linked_html;
}

It will add a link to the Large image.

[Bas]

Thanks! How can it link to the full-sized image? We’re very consistent about images sizes, they’re all maximum 1920 px wide.

[David]

In this part of the code:

wp_get_attachment_image_src( get_post_thumbnail_id(), 'large');

change large to full so it becomes:

wp_get_attachment_image_src( get_post_thumbnail_id(), 'full');

[Bas]

Great!

For the people using the Photoswipe lightbox, this lightbox doesn’t work when there’s only one image in the post/image. In that case use the following code:

add_filter( 'generate_single_featured_image_html', 'custom_add_post_thumbnail_link',25,1 );
function custom_add_post_thumbnail_link($image_html) {
    if( $image_html == '' ) {
        $image_html = $image_html;
    } else {
        $large_image_url = wp_get_attachment_image_src( get_post_thumbnail_id(), 'full');
        $linked_html = '<a href="' . $large_image_url[0] . '" data-lbwps-gid=" $large_image_url[0] " >' . $image_html . '</a>';
    }
    return $linked_html;
}

[David]

You’re welcome and thanks for sharing your final method.

[ideawrights]

David this was helpful. I found the hook implementation for apply_filters( ‘generate_single_featured_image_html’, $image_html ); via grep, but it doesn’t seem to be in your hook documentation.

All I found related to featured images was
https://docs.generatepress.com/article/generate_featured_image_output/

Also a helpful hook to know about, but not what I needed. It would be helpful to add ‘generate_single_featured_image_html’ to the list here: https://docs.generatepress.com/collection/filters/

Thanks

[David]

Hi Tom,

glad you found it of use. We’re continually reviewing and updating the docs, and yes there are many filters that are not listed ( maybe because there are so many ! ) _ ill get Leo to to take at adding that one.

[Author]

Posts