Equal Height Recent Posts…Tables?

  • I’m designing a custom theme where I’d like to display the recent posts on the home page horizontally, two columns per row, equal height. Like this:

    https://www.numenfilm.com/preview/ten-things.php

    Though I shy away from using tables for anything structural, they still have their advantages and I used them to create the equal heights achieved in the example above.

    I’d like to apply the same equal-height technique to the recent posts on the home page of my blog but can’t figure out how to integrate the table, tr, and td tags in my index.php file. All will use ‘read more…’ so they’re not too long.

    Here’s the code from index.php:

    <?php else : /* show post contents */ ?>
    <div class=”post” id=”post-<?php the_ID(); ?>”>
    <div class=”postcontents”>
    <?php if (!is_single()) : ?>
    <h2>“><?php the_title(); ?></h2>
    <?php else : ?>
    <h1><?php the_title(); ?></h1>
    <?php endif; ?>
    <div class=”posted”>Posted <?php the_time(‘F jS, Y’) ?> by <?php the_author_link(); ?> </div>
    <?php the_content(‘Read more →’); ?>
    <p><?php wp_link_pages(‘next_or_number=number&pagelink=page %’); ?></p>
    </div>
    <?php if(is_single) comments_template(); ?>
    </div>
    <?php endif; /* end if page or post */ ?>

    Any suggestions?

Viewing 2 replies - 1 through 2 (of 2 total)
  • Thread Starter dadra

    (@dadra)

    To clarify, I’d like my index.php file to kick out code like this:

    <table>
    <tr>
      <td>
        post contents here
      </td>
      <td>
        post contents here
      </td>
    </tr>
    <tr>
      <td>
        post contents here
      </td>
      <td>
        post contents here
      </td>
    </tr>
</table>

    The table and td tags are easy. The problem I’ve having is getting the tr tags to wrap around the posts in groups of two.

    I’m thinking this might not be possible, but I’d love to be proved wrong. Thanks!

    This should get you started:

    if (have_posts()) { ?>
   <table>
   <?php while (have_posts()) {
      the_post();
      if ((++$post_count) % 2) echo "\t<tr>\n";
      echo "\t\t<td style='width: 40%'>\n";
      the_title();
      the_excerpt();
      echo "\t\t</td>\n";
      if (($post_count % 2) == 0) echo "\t</tr>\n";
   }
   if ($post_count % 2) echo "\t\t<td></td>\n\t</tr>\n";
   echo "</table>\n";
} else {
   // No posts found
}
Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Equal Height Recent Posts…Tables?’ is closed to new replies.