WordPress.org

Support

Support » How-To and Troubleshooting » [Resolved] Latest post in home with different style

[Resolved] Latest post in home with different style

  • Hi.
    I have latest 4 posts in home page.
    Each post has a thumbnail. I wish that the thumbnails float left in the first post, float right in the second post, float left in the third post and float right in the fourth post.
    How?
    Thanks…

Viewing 5 replies - 1 through 5 (of 5 total)
  • Moderator Michael

    @alchymyth

    Forum Moderator

    assuming your theme is using a default loop and post_class() in the post div, you can try and add a filter to functions.php of your theme, to add alternating css classes to the posts on the front page;
    http://codex.wordpress.org/Function_Reference/post_class
    http://codex.wordpress.org/Function_Reference/post_class#Add_Classes_By_Filters

    example:

    add_filter('post_class','alternating_post_css_class');
    function alternating_post_css_class($classes) {
      if( is_home() ) {
       global $wp_query;
       $classes[] = ($wp_query->current_post%2)?'even-post':'odd-post';
      }
    return $classes;
    }

    and in style.css, add for example:

    .odd-post .wp-post-image { float:left; margin-right:1em; }
    .even-post .wp-post-image { float:right; margin-left:1em; }

    details might depend on the used theme.

    Hi alchymyth.
    When I add that code in functions.php, the home page become blank, so it dowsn’t work.

    I have this code in home page:

    <?php $myposts = get_posts('numberposts=4&category=3');
    foreach($myposts as $post) : ?>
    <?php the_post_thumbnail('thumbnail'); ?>
    <?php the_excerpt(); ?>
    <?php setup_postdata($post); ?>
    <?php endforeach; ?>
    Moderator Michael

    @alchymyth

    Forum Moderator

    there was an error in my code 🙁

    corrected in the reply above.

    anyway, it would not work with get_posts();

    try using a counter variable;

    <?php $myposts = get_posts('numberposts=4&category=3');
    $counter = 1;
    foreach($myposts as $post) : ?>
    <?php $lr = ($counter++%2)?'left':'right'; //check if counter is odd or even and set alignment accordingly ?>
    <?php the_post_thumbnail('thumbnail',array('class' => 'align'.$lr.' attachment-thumbnail')); ?>
    <?php the_excerpt(); ?>
    <?php setup_postdata($post); ?>
    <?php endforeach; ?>

    http://codex.wordpress.org/Function_Reference/the_post_thumbnail

    So, I edit home’s code and changed your code:

    <?php if (have_posts()) : ?><?php while (have_posts()) : the_post(); ?>
    
    <a href="<?php the_permalink(); ?>" rel="bookmark" title="<?php the_title(); ?>"><?php the_post_thumbnail('thumbnail'); ?><br/><?php the_title(); ?></a>
    
    <?php endwhile; endif; ?>

    but still doesn’t work… Now the home page isn’t blank, but the thumbanils aren’t alignment…

    EDIT.

    Sorry, your last code is correct and now it works.
    Thanks.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘[Resolved] Latest post in home with different style’ is closed to new replies.