異なる列にワードプレスの投稿を表示する

Question

私はブログページにワードプレスの投稿を別の列で表示しようとします。 例：最初の2つの行が2つの行にあり、残りの行が2つの列に1つずつ添付されています。

どのように投稿を同じように表示できますか？

ありがとうございました！

そして、ここに私のコードです。

<div class="container"> 
<div class="row"> 
    <div class="col-xs-12 col-sm-6"> 
       <?php 
       $news_args = array(
        'cat' => 3, 
        'paged' => get_query_var('paged'), 
        'posts_per_page' => 4, 
        'orderby' => 'post_date', 
        'order' => 'DESC', 
       ); 
       $news_query = new WP_Query($news_args); 
       if ($news_query->have_posts()) : 
       while ($news_query->have_posts()) : $news_query->the_post(); 
       ?> 

           <h3><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3> 
            <p><span><?php the_time('F j, Y'); ?> 
            </span> 
            <span><?php echo "By: ".get_the_author(); ?> 
            </span> 
            <span> 
            <?php 
            $commentcount = comments_number('0', '1', '%'); 
            $fulltitle = $title . ' (' . $commentcount . ' comments)'; 
            ?>Comments<?php wp_count_comments($post_id); ?> 
            </span></p> 

           <figure class="fig_rel1"> 
           <?php the_post_thumbnail(); ?> 
           </figure> 
           <p> 
           <?php 
           $content = get_the_content('',FALSE,''); 
           $content = apply_filters('the_content', $content); 
           $content = str_replace(']]>', ']]>', $content); 
           echo substr($content,0,300).'<a href="'. get_permalink($post->ID) .'">Read More &raquo; </a>'; 
           ?> 
           </p> 

       <?php 
       endwhile; 
       previous_posts_link('prev', $news_query->max_num_pages); 
       echo ' &mdash; '; 
       next_posts_link('next', $news_query->max_num_pages); 
       endif; 
       ?> 

       </div> 
       </div> 
       </div> 

Answer 1

お手伝いができます。

$news_args = array(
    'cat' => 3, 
    'paged' => get_query_var('paged'), 
    'posts_per_page' => 4, 
    'orderby' => 'post_date', 
    'order' => 'DESC', 
); 

$news_query = new WP_Query($news_args); 

$count = 0; 

if ($news_query->have_posts()) : 
while ($news_query->have_posts()) : $news_query->the_post(); 

    if ($count < 2) { 
     //code to populate first two post 
     $count++; 
    }else 
     //code to populate remaining posts 
     $count++; 
    } 

endwhile; 

Answer 2

次の方法を実装してください。

$count = 0; 

while (have_posts()) : the_post(); 

    if ($count < 2) { 
     //code to populate first two post 
     $count++; 
    }else 
     //code to populate remaining posts 
     $count++; 
    } 

endwhile; 

Answer 3

そして最後に、私は条件ならば、「DIV」タグを分割する列に配置されたソリューションを、得ました。

ここに最終的な解決策があります。

<div class="container"> 
<div class="row"> 
    <div class="col-xs-12 col-sm-8"> 
     <div class="container-fluid"> 
      <div class="row"> 
       <div class="col-xs-12 col-sm-12"> 
       <div class="row"> 
       <div class="ka-justcontent"> 
       <?php 
       $news_args = array(
        'cat' => 3, 
        'paged' => get_query_var('paged'), 
        'posts_per_page' => 4, 
        'orderby' => 'post_date', 
        'order' => 'DESC', 
       ); 
       $news_query = new WP_Query($news_args); 
       $i = 0; 
       if ($news_query->have_posts()) : 
       while ($news_query->have_posts()) : $news_query->the_post(); 
       ?> 
          <div <?php if($i<2){?> class="col-md-12" <?php } else {?> class="col-xs-12 col-sm-6 col-md-6" <?php }?> > 
          <!-- Previous Next --> 
           <div class="survey"> 
           <h3><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3> 
            <p><span><?php the_time('F j, Y'); ?> 
            </span> 
            <span><?php echo "By: ".get_the_author(); ?> 
            </span> 
            <span> 
            <?php 
            $commentcount = comments_number('0', '1', '%'); 
            $fulltitle = $title . ' (' . $commentcount . ' comments)'; 
            ?>Comments<?php wp_count_comments($post_id); ?> 
            </span></p> 
           </div> 
           <figure class="fig_rel1"> 
           <?php the_post_thumbnail(); ?> 
           </figure> 
           <p> 
           <?php 
           $content = get_the_content('',FALSE,''); 
           $content = apply_filters('the_content', $content); 
           $content = str_replace(']]>', ']]>', $content); 
           echo substr($content,0,300).'<a href="'. get_permalink($post->ID) .'">Read More &raquo; </a>'; 
           ?> 
           </p> 
          </div> 
       <?php 
       $i++; 
       endwhile; 
       previous_posts_link('prev', $news_query->max_num_pages); 
       echo ' &mdash; '; 
       next_posts_link('next', $news_query->max_num_pages); 
       endif; 
       ?> 
       </div> 
       </div> 
       </div>    
      </div> 
     </div> 
    </div> 
</div>