Link Featured Image WordPress
- SOLVED
Im in the process of developing a WP site and each post uses a featured image for a flyer. On the single.php page I want the featured image to be linked to the full sized image. I need it to be linked because these flyers have lots of info on them and need to be seen in full size to be read.
I currently have the following code to display the featured image but I don't know how to go about linking it to the full sized image...any help?
<?php if (has_post_thumbnail() ) {
the_post_thumbnail('large');
} else {
echo '<img src="'.get_bloginfo("template_url").'/images/flyer-default.png" alt="" />';
} ?>
Answers (3)
Jens Filipsson answers:
Do you want to link the thumbnail to the large image? Anyhow you need to get the attachment src, like the example below. This should work:
<?php
$args = array(
'order' => 'ASC',
'orderby' => 'menu_order',
'post_type' => 'attachment',
'post_parent' => $post->ID,
'post_mime_type' => 'image',
'post_status' => null,
'numberposts' => -1,
);
$attachments = get_posts($args);
if ($attachments) { ?>
<div class="something">
<?php
foreach ($attachments as $attachment) {
$imageTitle = $attachment->post_title;
$imageSrc = wp_get_attachment_image_src($attachment->ID, 'large'); ?>
<a href="<?=$imageSrc[0]?>" title="<?=$imageTitle?>" alt="<?=$imageTitle?>"><?php echo wp_get_attachment_image($attachment->ID, 'thumbnail', false); ?></a>
<?php
} ?>
</div>
<?php
} ?>
Jens Filipsson comments:
Comparing mine and idt:s answer, I came up with a solution combining those two, which I think would be the best. I haven't tried this out though, but I think it will work.
<?php if (has_post_thumbnail() ) {
$id = get_post_thumbnail_id();
$imageSrc = wp_get_attachment_image_src($id, 'large'); ?>
<a href="<?=$imageSrc[0]?>" title="<?=$imageTitle?>" alt="<?=$imageTitle?>"><?php the_post_thumbnail(); ?></a>
} else {
echo '<img src="'.get_bloginfo("template_url").'/images/flyer-default.png" alt="" />';
} ?>
Jens Filipsson comments:
Sorry, had a small typo, here is the working code:
<?php if (has_post_thumbnail() ) {
$id = get_post_thumbnail_id();
$imageSrc = wp_get_attachment_image_src($id, 'large'); ?>
<a href="<?=$imageSrc[0]?>" title="<?=$imageTitle?>" alt="<?=$imageTitle?>"><?php the_post_thumbnail(); ?></a>
<?php
} else {
echo '<img src="'.get_bloginfo("template_url").'/images/flyer-default.png" alt="" />';
} ?>
Matthew Martin comments:
I want the "large" thumbnail to be displayed & have it linked to the full sized image/attachment.
Your code seems to be close but its not displaying for me. It wont event display the fallback image.
Jens Filipsson comments:
Hmm, ok, try this! I think this should work!
<?php if (has_post_thumbnail() ) {
$imageID = get_post_thumbnail_id();
$imageSrc = wp_get_attachment_image_src($imageID, 'full'); ?>
<a href="<?=$imageSrc[0]?>"><?php the_post_thumbnail('large'); ?></a>
<?php
} else {
echo '<img src="'.get_bloginfo("template_url").'/images/flyer-default.png" alt="" />';
} ?>
Matthew Martin comments:
Thanks Jens! works perfect!
Jens Filipsson comments:
Glad I could help!
Cosmin Popovici answers:
Are you defining the large version of your thumbnail in functions.php ?
'Cause if not, I don't think the_post_thumbnail('large') would work...
Matthew Martin comments:
Im defining it in the media settings: [[LINK href="http://cl.ly/44aj"]][[/LINK]]
Matthew Martin comments:
[[LINK href="http://cl.ly/44aj"]]Screenshot[[/LINK]]
idt answers:
You can do it like this:
<?php if (has_post_thumbnail() ) {
$id = get_post_thumbnail_id();
wp_get_attachment_link($id, 'large')
} else {
echo '<img src="'.get_bloginfo("template_url").'/images/flyer-default.png" alt="" />';
} ?>
My previous answer suggested using the_attachment_link but it seems to have been deprecated.
More reading here: [[LINK href="http://codex.wordpress.org/Template_Tags/wp_get_attachment_link"]]http://codex.wordpress.org/Template_Tags/wp_get_attachment_link[[/LINK]]