Make featured image a link?

Travelify
1

When clicking on a post’s featured image, I would like the featured image to link to the full-size version of the image (which I intend to open as an overlay using the WP Lightbox 2 plugin). How might I accomplish this? I can’t find the code mentioned in the WP codex to edit!

Thank you!

2

Hi @lindaoftx,

I hope you are well today and thanks for posting here.

You have to use the WP Lightbox 2 plugin and when you add the image in the post or page editor then just wrap the image tag img with the anchor tag which will point to the large size image as shown on the following page.

http://freewptp.com/list-of-most-popular-wordpress-magazine-themes/

Best Regards,
Movin

3

Sorry i couldn’t find my way around where to start my own thread, so i decided to use this. I am trying to add a sitemap to my websites homepage using the page-builder plugin from siteorigin but it doesn’t display on the home page. the theme is travelify. Please need help urgently

4

Hi @knowshare,

You can create a new support topic for travelify theme by using the form displayed in the bottom of the following page.

We would be more than happy to help you on your new thread.

Thanks,
Movin

5

Hi Movin, thanks for your response but I’m not sure how this applies to my question? The link you provided is a list of themes, do you mean to say what I’m wanting to do is not possible with this theme and I need a new theme? Sorry if I don’t understand your meaning!

I am wanting to make the featured image a link, not add a link to an image that has been inserted into a post. Currently, the featured image on a blog post links to the individual blog post. I want to link it to the image instead. I have been through the featured image codex on the wordpress site as well as several posts on the wordpress support forums and I’m having trouble finding the code I need to modify in this theme…

https://codex.wordpress.org/Post_Thumbnails

etc

6

Hi @lindaoftx,

Hi Movin, thanks for your response but I’m not sure how this applies to my question? The link you provided is a list of themes, do you mean to say what I’m wanting to do is not possible with this theme and I need a new theme? Sorry if I don’t understand your meaning!

The shared page URL is just to show you how the larger image will be displayed on clicking on the smaller image. You will see it by just clicking on the theme images on the shared page.

I am wanting to make the featured image a link, not add a link to an image that has been inserted into a post. Currently, the featured image on a blog post links to the individual blog post. I want to link it to the image instead. I have been through the featured image codex on the wordpress site as well as several posts on the wordpress support forums and I’m having trouble finding the code I need to modify in this theme…

To achieve this just try using the attached child theme of Travelify theme that contains custom code in the functions.php file of it.

After using the child theme on your site you will see all the featured images on the blog page will point to # so just change this # on line number 42 in the functions.php file of child theme to the large image URL.

Regards,
Movin

7

Thanks again for your response, Movin!

It sounds like you are wanting me to hard-code an image URL into the functions.php page, is this correct? This is closer to what I want, but it sounds like clicking on each blog post’s featured image would always load the same image.

For example:

Blog Post 1 has image1.png as the featured image. When you click on the large thumbnail on the Blog Post 1, I want image1.png to open full size.
Blog Post 2 has image2.png as the featured image, when clicking on the thumbnail, image2.png should open full size.

The instructions you’ve given seem to indicate I should hard code the URL for image1.png into the functions.php file, but wouldn’t that cause image1.png to load when clicking on the featured image for Blog Post 2?

I don’t want the same image to open every single time, I want the larger version of each post’s featured image to load.

Is there a way to edit this code to populate the image link based on the image location rather than having to manually hard code image links into the functions.php page?

To be clear:

Blog Post 1 > Featured image = image1.png > clicking image opens image1.png fullsize
Blog Post 2 > Featured image = image2.png > clicking image opens image2.png fullsize
Blog Post 3 > Featured image = image3.png > clicking image opens image3.png fullsize
Blog Post 4 > Featured image = image4.png > clicking image opens image4.png fullsize

I am already using a child theme, would inserting the following code into the functions.php file accomplish what I’m trying to do?

<?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();

} ?>

8

I seem to have figured it out, here’s what I did:

Using the code in the child theme attached plus information from the codex (https://codex.wordpress.org/Function_Reference/the_post_thumbnail#Post_Thumbnail_Linking_to_Large_Image_Size) I replaced lines 37-48 of functions.php with the following:

<?php 
if ( has_post_thumbnail() ) {
	$large_image_url = wp_get_attachment_image_src( get_post_thumbnail_id(), 'large' );
	echo '<a href="' . $large_image_url[0] . '" title="' . the_title_attribute( 'echo=0' ) . '">';
	the_post_thumbnail( 'thumbnail' );
	echo '</a>';
}
?>

And it’s now linking to the image itself rather than the post!

9

Hi @lindaoftx,

No i don’t wanted you to hard code URL but fetch large image URL of the post dynamically.

Awesome great to see you got that figured out.

Please advise if you have more questions.

Have a fantastic day!

Cheers,
Movin