Support » Fixing WordPress » Thumbnail links to post permalink

  • Hi,
    I would like to link the thumbnail to the post link. Here is my site http://thisweekin.net/malibu/ and as you can see you can’t click on the thumbnail to go into the post.

    I have this code to show the thumbnail:
    <?php the_post_thumbnail(array(300, 9999), array('class' => 'alignleft post_thumbnail', 'alt' => 'alttext', 'title' => 'titletext', 'align' => 'left', 'hspace'=>10)); ?>

    I tried to add <a href="<?php the_permalink() ?>"> before it and close the <a> after but it doesn’ work.

    I appreciate any helps.

    Thanks

Viewing 15 replies - 1 through 15 (of 17 total)
  • I believe you have to go the “get” route for retrieving both the thumb and the permalink. Try using get_the_post_thumbnail instead. So, e.g.:

    <?php $img = get_the_post_thumbnail($post->ID, $optional_size, $optional_attr);
    $perm = get_permalink($post->ID); ?>
    
    <a href="<?php echo($perm); ?>" title="Whatever"><?php echo($img); ?></a>

    Obviously you could trim this down by just calling the functions inside the echoes but the above is a bit easier to see.

    Does this work for you?

    John

    Hi,
    thanks!
    I’m not so expert and I have a question. Can I keep the options in the array (like: size, align–>left, hspace–>10) and how the code should be with this options?

    Thanks

    Also in the theme-options file I have this code
    add_theme_support( 'post-thumbnails', array( 'post' ) ); // Add it for posts

    Should I edit anything?

    Thanks

    Hi SpankMarvin,
    I tried your code and it works! Thanks!
    I can set up the class=alignleft and it’s aligned well.

    The only thing I need is to keep the properties align=”left” in the function even though it doesn’t affect the website because there is already a class to align the image; but I use this properties because I scrape the home page to create a newsletter and if I don’t use align=”left” the text shows below the image in the email, also I want to avoid to manually insert this properties for each post in the email template every week.
    Is it something we can do?

    Beacause I noticed that if I insert align=left with firebug, I can’t click anymore on the image….strange!

    Thanks

    I’m not sure I follow what you’re trying to do. Which tag are you trying to apply the align=”left” attribute to, a paragraph tag?

    Actually I tried to make your code with align=left like

    <?php $img = get_the_post_thumbnail($post->ID, array(300, 9999), array('class' => 'alignleft post_thumbnail', 'alt' => 'alttext', 'title' => 'titletext', 'align' => 'left', 'hspace'=>10));
    $perm = get_permalink($post->ID); ?>
    
    <a href="<?php echo($perm); ?>" title="Whatever"><?php echo($img); ?></a>

    but the thumb is not linked. If I remove “align=left” and the “class=alignleft post_thumbnail” it works.

    Also you can see the code of the page here http://pastebin.com/JR9taKgD

    The post is in a <td> tag

    Thanks

    I don’t think ‘align’ is a valid value for the attributes in get_the_post_thumbnail. Is there any reason why you cannot stick with using class names and then style if needed?

    The reason is that since I’ll scrape the home page and I’ll use the scrape code for a newsletter template, If I keep align=left when I’ll scrape the page I’ll get align=left.
    Since my client can’t edit any code (and insert align=left later only in the email template) I need to figure out a way to get align=left automatically inserted, because I think only with inline code I can align the image in Outlook, I didn’t find any other solution with CSS.

    With the code I used before I could insert the align=left and it didn’t affect anything in the site, and I could grab it in the scrape code.

    Now that I want to use get_the_post_thumbnail I can’t insert the align=left anymore….

    Should I choose either newsletter or link image? 🙁

    Please let me know if it’s clear

    Thanks for your help

    Ok, try this:

    <?php
    $img_id = get_post_thumbnail_id($post->ID); // This gets just the ID of the img
    $image = wp_get_attachment_image_src($img_id, $optional_size); // Get URL of the image, and size can be set here too (same as with get_the_post_thumbnail, I think)
    
    $perm = get_permalink($post->ID);
    
    ?>
    
    <a href="<?php echo($perm); ?>" title="Whatever"><img src="<?php echo($image[0]); ?>" width="<?php echo($image[1] ?>" height="<?php echo($image[2] ?>" align="left" class="whatever classes" alt="alttext" /></a>

    I’m still not sure this is what you’re after, but it at least brings in the flexibility of being able to control the img tag directly, which hopefully helps…

    J

    Thanks! It looks great!
    I think it needs just a little tweak because I get this error:
    Parse error: syntax error, unexpected ‘;’ in /home/content/68/6802868/html/wp-content/themes/diarise/EmailHomePage.php on line 238

    but the meaning of your concept sounds alright.

    Thanks

    That’s because there are a few missing parentheses in the code provided above (happens to me all the time). This should do it:

    <?php
    $img_id = get_post_thumbnail_id($post->ID); // This gets just the ID of the img
    $image = wp_get_attachment_image_src($img_id, $optional_size); // Get URL of the image, and size can be set here too (same as with get_the_post_thumbnail, I think)
    
    $perm = get_permalink($post->ID);
    
    ?>
    
    <a href="<?php echo($perm); ?>" title="Whatever"><img src="<?php echo($image[0]); ?>" width="<?php echo($image[1]); ?>" height="<?php echo($image[2]); ?>" align="left" class="whatever classes" alt="alttext" /></a>

    Oh yes, sorry about that, the code seems to have got garbled there. Thanks for cleaning it up, Curtiss.

    Thank you both!!! The error disappeared.
    But unfortunately I still can not have the image link.
    I just copied and pasted your code without any edits, but nothing happens

    You can check it out here http://thisweekin.net/malibu/
    Actually now I only inserted the class.

    Hope it’s an easy fix!!! Thanks!

    Cheers,

    Juri

    Hi,
    I’m trying but no solutions. If you use that code you get the thumbnail link to full post page, but how do you align the image usually?
    If I don’t use anything I get the link but look at this http://screencast.com/t/TRQVTBxNiebE

    Please let me know your thoughts

    Thanks for all

    Cheers!

    It looks like you have the alignment working, now.

    Also, looking at the source of your page, the link is working, too. However, something in the way you have the page laid out is causing the post content container to appear overtop of the linked thumbnail, so you can’t actually click on the link.

    Try moving the code for the thumbnail/link inside of the <div class="post-copy"> rather than being before that container.

Viewing 15 replies - 1 through 15 (of 17 total)
  • The topic ‘Thumbnail links to post permalink’ is closed to new replies.