Question

我想要一个包含我食品类别的所有存档帖子的页面（类别ID为10）。我正在尝试使用col-md-4进行设置，所以我会在一行中有三个帖子。我想我在php文件中添加了所有必要的元素，我现在还不知道如何设置它。我尝试设置它以便有3个帖子中有4个帖子（所以12个帖子）然后在每12个帖子后它会加载ajax加载更多按钮。任何人都可以帮我解决这个问题。提前谢谢。

更新它还没有正确循环播放帖子 - 它只显示一个帖子

＆＃13;

<?php
get_header();
get_template_part ('inc/carousel-food');

$the_query = new WP_Query( [
    'posts_per_page' => 12,
    'paged' => get_query_var('paged', 1)
] );

if ( $the_query->have_posts() ) { ?>
    <div id="ajax">                                     
<article class="post">    
<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>
    
</article>
 </div>
    <?php if(get_query_var('paged') < $the_query->max_num_pages) {
       load_more_button();
    }
}
elseif (!get_query_var('paged') || get_query_var('paged') == '1') {
    echo '<p>Sorry, no posts matched your criteria.</p>';
}
wp_reset_postdata();
get_footer();

＆＃13;

Answer 1

您在每次循环迭代中开始一个新行。您可以通过将行放在循环外来更改代码：

<div class="row">
while ( $the_query->have_posts() ) { $the_query->the_post();

<article class="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>
</article>
}
</div>

<?php if(get_query_var('paged') < $the_query->max_num_pages) {
   load_more_button();
}

另外我想你可能想把你的ajax选项移到循环之外？

使用bootstrap制作存档页面网格布局

1 个答案: