Question

我设置了页面，以便连续显示3个帖子。然后在4列帖子（12个帖子）之后显示 ajax加载更多按钮。问题是在我的代码中我最初只有一个col-md-4但它只显示了一个帖子连续。所以我又添加了两个col-md-4。它现在连续显示3个帖子，但每行重复相同的3个帖子。有人有解决方案吗？

<?php
get_header();
get_template_part ('inc/carousel-food');

$the_query = new WP_Query( array(
    'posts_per_page' => 12,
    'paged' => get_query_var('paged', 1),
    'cat' => 10,
 ));

if ( $the_query->have_posts() ) {

    // display #ajax wrapper only if we have posts
    echo '<div id="ajax">';

    while($the_query->have_posts()) {
          $the_query->the_post(); ?>

        <article <?php post_class(); ?>>    
            <div class="row">
                <div class="col-md-4"><?php the_post_thumbnail('medium-thumbnail'); ?>
                    <h2><a class="post-title" href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
                    <p class="post-excerpt"><?php echo get_the_excerpt(); ?></p>
                    <?php get_template_part( 'share-buttons' ); ?>
                    <a class="moretext" href="<?php the_permalink(); ?>">Read more</a>
                    <?php comments_popup_link ('No Comments', '1 Comment', '% Comments', 'comment-count', 'none'); ?>
                </div>
                 <div class="col-md-4"><?php the_post_thumbnail('medium-thumbnail'); ?>
                    <h2><a class="post-title" href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
                    <p class="post-excerpt"><?php echo get_the_excerpt(); ?></p>
                    <?php get_template_part( 'share-buttons' ); ?>
                    <a class="moretext" href="<?php the_permalink(); ?>">Read more</a>
                    <?php comments_popup_link ('No Comments', '1 Comment', '% Comments', 'comment-count', 'none'); ?>
                </div>
                 <div class="col-md-4"><?php the_post_thumbnail('medium-thumbnail'); ?>
                    <h2><a class="post-title" href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
                    <p class="post-excerpt"><?php echo get_the_excerpt(); ?></p>
                    <?php get_template_part( 'share-buttons' ); ?>
                    <a class="moretext" href="<?php the_permalink(); ?>">Read more</a>
                    <?php comments_popup_link ('No Comments', '1 Comment', '% Comments', 'comment-count', 'none'); ?>
                </div>
            </div>
        </article>

    <?php }//end while

    echo '</div>'; // close the #ajax wrapper after the post list

    if(get_query_var('paged') < $the_query->max_num_pages) {
        load_more_button();
    }


} else { // if there are no posts

    echo '<p>Sorry, no posts matched your criteria.</p>';

}//end if

get_footer();
?>

Answer 1

我想你想做这样的事情：

echo '<div class="row">';
$i = 0;
while($the_query->have_posts()) {
    $the_query->the_post();
    if($i % 3 == 0){ 
        echo '</div><div class="row">'
    } 
    <div class="col-md-4">
    ...
    </div>
     $i++;
}
echo '</div>';

Answer 2

在下一个div显示之前使用wp_query的next_post（）成员函数，将进入下一个帖子。

＆＃13;

<?php
get_header();
get_template_part ('inc/carousel-food');

$the_query = new WP_Query( array(
    'posts_per_page' => 12,
    'paged' => get_query_var('paged', 1),
    'cat' => 10,
 ));

if ( $the_query->have_posts() ) {

    // display #ajax wrapper only if we have posts
    echo '<div id="ajax">';

    while($the_query->have_posts()) {
          $the_query->the_post(); ?>

        <article <?php post_class(); ?>>    
            <div class="row">
                <div class="col-md-4"><?php the_post_thumbnail('medium-thumbnail'); ?>
                    <h2><a class="post-title" href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
                    <p class="post-excerpt"><?php echo get_the_excerpt(); ?></p>
                    <?php get_template_part( 'share-buttons' ); ?>
                    <a class="moretext" href="<?php the_permalink(); ?>">Read more</a>
                    <?php comments_popup_link ('No Comments', '1 Comment', '% Comments', 'comment-count', 'none'); ?>
                </div>
                <?php $the_query->next_post(); // advances to next post ?>
                 <div class="col-md-4"><?php the_post_thumbnail('medium-thumbnail'); ?>
                    <h2><a class="post-title" href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
                    <p class="post-excerpt"><?php echo get_the_excerpt(); ?></p>
                    <?php get_template_part( 'share-buttons' ); ?>
                    <a class="moretext" href="<?php the_permalink(); ?>">Read more</a>
                    <?php comments_popup_link ('No Comments', '1 Comment', '% Comments', 'comment-count', 'none'); ?>
                </div>
                <?php $the_query->next_post(); // advances to next post ?>
                 <div class="col-md-4"><?php the_post_thumbnail('medium-thumbnail'); ?>
                    <h2><a class="post-title" href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
                    <p class="post-excerpt"><?php echo get_the_excerpt(); ?></p>
                    <?php get_template_part( 'share-buttons' ); ?>
                    <a class="moretext" href="<?php the_permalink(); ?>">Read more</a>
                    <?php comments_popup_link ('No Comments', '1 Comment', '% Comments', 'comment-count', 'none'); ?>
                </div>
            </div>
        </article>

    <?php }//end while

    echo '</div>'; // close the #ajax wrapper after the post list

    if(get_query_var('paged') < $the_query->max_num_pages) {
        load_more_button();
    }


} else { // if there are no posts

    echo '<p>Sorry, no posts matched your criteria.</p>';

}//end if

get_footer();
?>

＆＃13;

post loop重复相同的帖子

2 个答案: