Thumbnail to external link AND Thumbnail to post

2 Views

Here is what I’d like to accomplish

Goal A: I want to hyperlink each thumbnail in index.php to their post.
Goal B: I want to define a hyperlink for each thumbnail in single.php to an external website.

Read More

You may ask why am I using thumbnails for single.php? The reason is because I want this layout:

enter image description here

And so far I understand that there are 3 methods to display images:

  1. Insert image into the editor area along with the text, but the problem is I cannot float the image and text differently because all items within a post are assigned a p tag – am I wrong?
  2. Custom fields should get the job done but it doesn’t seem the most efficient way – or am I wrong?
  3. Post Thumbnails should be the easiest way but see my problem below

I have the code to accomplish Goal A and B but they only work separately.
In other words, “Code 1” does not work if “Code 2” is present.
How can I resolve this issue? Or is there a better method accomplish my goal?

Code 1: Link thumbnails to external websites using custom field (single.php) 

<?php $name = get_post_meta($post->ID, 'externalurl', true);
if( $name ) { ?>
<a href="<?php echo $name; ?>"><?php the_post_thumbnail(); ?></a>
<?php } else {
the_post_thumbnail();
} ?>

Code 2: Link thumbnails to the post (functions.php) 

add_filter( 'post_thumbnail_html', 'my_post_image_html', 10, 3 );

function my_post_image_html( $html, $post_id, $post_image_id ) {
$html = '<a href="' . get_permalink( $post_id ) . '" title="' . esc_attr( get_the_title( $post_id ) ) . '">' . $html . '</a>';
return $html;
}
Post Views: 2

Related posts

Leave a Reply

1 comment

  1. is_single() function will help you achieve what you need. Try below code in functions.php and remove the additional code from single.php

    function my_post_image_html( $html, $post_id, $post_image_id ) { 
if ( is_single()) { 
    $name = get_post_meta($post_id, 'externalurl', true);
    if( $name ) {           
        $html = '<a href="'.$name.'" title="' . esc_attr( get_the_title( $post_id ) ) . '">' . $html . '</a>';
    }
    return $html;
}
else 
{
    $html = '<a href="' . get_permalink( $post_id ) . '" title="' . esc_attr( get_the_title( $post_id ) ) . '">' . $html . '</a>';
    return $html;
}
}

add_filter( 'post_thumbnail_html', 'my_post_image_html', 10, 3 );