How to show this code result in 3 column layout

  • [ Moved to the Fixing WordPress sub-forum. ]

    <div id="div1" class="count-serial-post">

<?php  $cats = get_categories('child_of='.get_query_var('cat')); 

    foreach ($cats as $cat) :

    $args = array(
    'posts_per_page' => 20, // max number of post per category
    'category__in' => array($cat->term_id)
    );
    $my_query = new WP_Query($args); 

        if ($my_query->have_posts()) : 
 echo '<br/>';
        echo '<h3>'.$cat->name.'</h3>';

        while ($my_query->have_posts()) : $my_query->the_post(); ?>     
        <?php /*general loop output; for instance: */ ?>
   <h4>

 <?php
 echo "<span style='font-size:18px;font-weight:600;color:#333;'>";
$paged = get_query_var( 'paged' );
if($paged==0) {
$paged = 1;
}

$post_count = $my_query->current_post +1 + $posts_per_page*($paged - 1);
if($post_count<10){
echo '0' . $post_count;
}
else {
echo($post_count);
}
echo "</span>";
?>.		<a>"><?php the_title(); ?></a> </h4>
<div class="clear"></div>
        <?php endwhile; ?>

        <?php else : 
        echo 'No Posts for '.$cat->name;                
        endif; 

    endforeach; ?>
					
                </div>
Viewing 1 replies (of 1 total)
  • Moderator Steven Stern (sterndata)

    (@sterndata)

    Volunteer Forum Moderator

    What I’d do is wrap each result in a div and use CSS to lay them out as a 3-across grid (where the screen is wide enough to support it). Alternatively, you could force it by adding a another div to wrap a row of three results, but that’s probably less responsive. If you’re going for three in a a row, use 21 or 18 as the posts_per_page, as it will produce a nicer result.

Viewing 1 replies (of 1 total)
  • The topic ‘How to show this code result in 3 column layout’ is closed to new replies.