WordPress.org

Ready to get started?Download WordPress

Forums

Whole Thumbnail Clickable (17 posts)

  1. da1k
    Member
    Posted 1 year ago #

    Hello,

    How to make whole thumbnail clickable not only down-right corner? It will be easier to read rest of the post.

    best regards,

  2. Andrew
    Forum moderator
    Posted 1 year ago #

    lol.. Remember that we don't know which theme you're using and can't see what you're talking about.

  3. da1k
    Member
    Posted 1 year ago #

    Yeah, you are right :)

    I am using myGrid2 theme :) I found that I should change something here:

    <h2><a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title_attribute(); ?>"><?php the_title(); ?></a></h2>
    				<div class="postinn bags"><span>
    				<div class="ger"><i><?php the_time('j M Y') ?></i> &bull; <?php the_excerpt(); ?></div>
    				<span><a href="<?php the_permalink(); ?>">More +</a></span></div>
  4. Andrew
    Forum moderator
    Posted 1 year ago #

    Maybe;

    <a href="<?php the_permalink(); ?>">
     <h2>
      <a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title_attribute(); ?>">
      <?php the_title(); ?></a>
     </h2>
     <div class="postinn bags"><span>
      <div class="ger"><i><?php the_time('j M Y') ?></i> • <?php the_excerpt(); ?></div>
      <span>More +</span>
     </div>
    </a>

    I don't know what effect that will have on your title bookmark link.

    You're using a Child Theme?

  5. da1k
    Member
    Posted 1 year ago #

    No it is not working, but it gave me some ideas so I will test it and I will let you know. Thanks

  6. Anton
    Member
    Posted 1 year ago #

    Hello da1k,

    if you found a solution, please post it here. I rally want the full thumbnail to be clickable.
    Thanks in advance.

  7. drobonagon
    Member
    Posted 1 year ago #

    Finally got it

    <?php while (have_posts()) : the_post(); ?>
    
    			<li class="bags <?php echo $firstClass; $firstClass = ""; ?>" id="post-<?php the_ID(); ?>">
    
        			<div class="thumb">
                    <a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title_attribute(); ?>"><?php if ( has_post_thumbnail() ) { the_post_thumbnail( 'homepage-thumb' ); } ?></a>
                    </div>
    				<a href="<?php the_permalink(); ?>">
    
    <h2><a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title_attribute(); ?>">
      <?php the_title(); ?></a></h2>
     <a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title_attribute(); ?>"><div class="postinn bags">
      <div class="ger"><?php the_excerpt(); ?></a></div>
      <span>Read More +</span>
     </div>
  8. Anton
    Member
    Posted 1 year ago #

    Hi drobonagon,

    thanks for your advise.
    It results an error:
    Parse error: syntax error, unexpected 'else' (T_ELSE) in public_html/wp-content/themes/mygrid2/index.php on line 44

    Could you please help me out?
    Thanks!

  9. drobonagon
    Member
    Posted 1 year ago #

    Hmm not sure, if you post your index.php code I'll take a look

  10. Andrew
    Forum moderator
    Posted 1 year ago #

    @drobonagon, you can check your syntax here http://www.piliapp.com/php-syntax-check/

  11. drobonagon
    Member
    Posted 1 year ago #

    Thanks, No syntax errors in CODE reported

  12. Andrew
    Forum moderator
    Posted 1 year ago #

    @Anton perhaps you're missing an endwhile?

  13. Anton
    Member
    Posted 1 year ago #

    Thanks for your help, guys. Please find my code below, drobonagon.

    <?php get_header();?>
    <?php
    $pov_disthumb = get_option('pov_disthumb');
    ?>
    <div class="box">
    <ul id="latestpost">
    <?php $firstClass = 'firstpost'; ?>
    <?php if (have_posts()) : ?>

    <?php while (have_posts()) : the_post(); ?>

    <li class="bags <?php echo $firstClass; $firstClass = ""; ?>" id="post-<?php the_ID(); ?>">

    <div class="thumb">
    " rel="bookmark" title="<?php the_title_attribute(); ?>"><?php if ( has_post_thumbnail() ) { the_post_thumbnail( 'homepage-thumb' ); } ?>
    </div>
    ">

    <h2>" rel="bookmark" title="<?php the_title_attribute(); ?>">
    <?php the_title(); ?>
    </h2>
    " rel="bookmark" title="<?php the_title_attribute(); ?>"><div class="postinn bags">
    <div class="ger"><?php the_excerpt(); ?>
    </div>
    <span>Read More +</span>
    </div>

    <?php endwhile; ?><?php else : ?>

    <div class="post">
    <h2>Bummer!</h2>
    <p class="center">Hier is niets te zien. Probeer anders ff te zoeken hieronder of ga naar de homepage.</p>
    <?php get_search_form(); ?>
    </div>

    <?php endif; ?>

    <div class="clear"></div>
    <div class="navigation ger">
    <div class="nav-previous fl"><?php next_posts_link( __( '<span class="meta-nav">←</span> Older posts' ) ); ?></div>
    <div class="nav-next fr"><?php previous_posts_link( __( 'Newer posts <span class="meta-nav">→</span>' ) ); ?></div>
    </div>

    <div class="hrlineB"></div>

    <h1 class="title"><?php bloginfo('description'); ?></h1>

    <?php get_footer(); ?>

  14. drobonagon
    Member
    Posted 1 year ago #

    Try this

    <?php get_header();?>
    <?php
    $pov_disthumb = get_option('pov_disthumb');
    ?>
    <div class="box">
    <ul id="latestpost">
    <?php $firstClass = 'firstpost'; ?>
    <?php if (have_posts()) : ?>
    
    <?php while (have_posts()) : the_post(); ?>
    
    <li class="bags <?php echo $firstClass; $firstClass = ""; ?>" id="post-<?php the_ID(); ?>">
    
    <div class="thumb">
    
    <a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title_attribute(); ?>"><?php if ( has_post_thumbnail() ) { the_post_thumbnail( 'homepage-thumb' ); } ?></a>
    </div>
    
    <h2><a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title_attribute(); ?>">
    <?php the_title(); ?></a></h2>
    <a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title_attribute(); ?>"><div class="postinn bags"></a>
    
      <a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title_attribute(); ?>"><div class="ger"><?php the_excerpt(); ?></div></a>
    
    <span><a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title_attribute(); ?>">Read More+</a></span>
    
     </div>
    
    </li>
    
    <?php endwhile; ?><?php else : ?>
    
    <div class="post">
    <h2>Bummer!</h2>
    <p class="center">Hier is niets te zien. Probeer anders ff te zoeken hieronder of ga naar de homepage.</p>
    <?php get_search_form(); ?>
    </div>
    
    <?php endif; ?>
    
    <div class="clear"></div>
    <div class="navigation ger">
    <div class="nav-previous fl"><?php next_posts_link( __( '<span class="meta-nav">←</span> Older posts' ) ); ?></div>
    <div class="nav-next fr"><?php previous_posts_link( __( 'Newer posts <span class="meta-nav">→</span>' ) ); ?></div>
    </div>
    
    <div class="hrlineB"></div>
    
    <h1 class="title"><?php bloginfo('description'); ?></h1>
    
    <?php get_footer(); ?>
  15. Anton
    Member
    Posted 1 year ago #

    Thanks for your help (again).
    The image is now clickable, however the image of the featured post is smaller and has a lot of whitespace on the right. It does not look very nice, unfortunately.

  16. drobonagon
    Member
    Posted 1 year ago #

    Try to edit your CSS as follows

    #latestpost li img{
    	margin:0;
    	padding:5px;
    	float:left;
    	width:100%; /* was 260px */
    	height:100%; /* was auto */
    	}
  17. Anton
    Member
    Posted 1 year ago #

    Hi,

    great! That did the trick. However, it caused a new issue.
    The caption now ends with [&hellip
    If you go to http://www.misat.nl you can see what I mean.

    Cheers

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags