워드프레스 게시물을 가로로 3열로 표시하려면 어떻게 해야 합니까?

워드프레스 게시물을 가로로 3열로 표시하려면 어떻게 해야 합니까?

저는 부트스트랩으로 제작된 제 테마를 워드프레스에 통합하고 있으며, 이제 제 게시물을 세로가 아닌 가로로 표시해야 하는 어려움에 직면해 있습니다.설계에서는 3개의 열을 사용합니다.

이 사이트(http://perishablepress.com/two-column-horizontal-sequence-wordpress-post-order/) 에 게시된 두 개의 칼럼에 대한 솔루션은 도움이 되었지만, 3개의 칼럼과 함께 사용할 때 이전에 표시된 게시물을 반복해서 게시합니다.

여기 내 코드가 있습니다.

    <div class="row">

    <?php if (have_posts()) : while(have_posts()) : $i++; if(($i % 2) == 0) : $wp_query->next_post(); else : the_post(); ?>

    <div class="col-sm-4">
    <img src="<?php the_field('home_page_slider_image'); ?>" class="img-responsive" >
    <h3><?php the_field( 'description' ); ?></h3>

    </div>

    <?php endif; endwhile; else: ?>
    <div>Alternate content</div>
    <?php endif; ?>

    <?php $i = 0; rewind_posts(); ?>

    <?php if (have_posts()) : while(have_posts()) : $i++; if(($i % 2) !== 0) : $wp_query->next_post(); else : the_post(); ?>

    <div class="col-sm-4">
    <img src="<?php the_field('home_page_slider_image'); ?>" class="img-responsive" >
    <h3><?php the_field( 'description' ); ?></h3>
    </div>

    <?php endif; endwhile; else: ?>
    <div>Alternate content</div>
    <?php endif; ?>


    <?php $i = 0; rewind_posts(); ?>

    <?php if (have_posts()) : while(have_posts()) : $i++; if(($i % 2) !== 0) : $wp_query->next_post(); else : the_post(); ?>

    <div class="col-sm-4">
    <img src="<?php the_field('home_page_slider_image'); ?>" class="img-responsive" >
    <h3><?php the_field( 'description' ); ?></h3>
    </div>

    <?php endif; endwhile; else: ?>
    <div>Alternate content</div>
    <?php endif; ?>



    </div>

어떤 도움이라도 주시면 감사하겠습니다.

감사해요.

이 예제를 보고 원하는 대로 작동하며 이 예제에 따라 코드를 배열합니다.

$i = 1;
echo "<div class='row'>\n";
while( $i <= 10 ){

    echo "  <div class='col-lg-4'></div>\n";
    if( $i % 3 == 0 ) { echo "</div>\n<div class='row'>\n"; }

    $i++;
}
echo "</div>\n";

http://codepad.org/Qesw28Cw

html 문자열을 동적 배열로 만든 다음 have_posts() 루프 후 행을 에코합니다.이것은 게시물의 개수를 4개로 나눈 후 4열로 세로로 순서를 매깁니다.다음은 제 예입니다.

$query = new WP_Query(array(
                        'post_status'   => 'publish',
                        'orderby'       => 'title',
                        'order'         => 'ASC',
                        'posts_per_page'    => -1
                        ));

$post_count = $query->post_count;
$posts_per_column = ceil($post_count / 4);      

$rows = array();                                            
$count = 0;
while ($query->have_posts())
{ $query->the_post(); 
    if($rows[$count] == ""){ $rows[$count] = '<div class="row">'; }
    $rows[$count] = $rows[$count] . '<div class="col-sm-3">' .
            '<div class="post-title">
             <a href="'.get_permalink().'">'.get_the_title().'</a></div>' .
            '<div class="post-author">by '. get_the_author() .'</div></div>';
    $count++;                           
    if ($count == $posts_per_column ) { $count = 0; }   
}

foreach ($rows as $row) { echo $row . '</div>'; }

언급URL : https://stackoverflow.com/questions/21199556/how-do-i-display-wordpress-posts-into-3-columns-horizontally