我目前正在开发一个定制的WordPress模板。在这个模板中，我试图展示特定类别（类似产品类别，没有销售或其他）的所有文章。所以我现在展示的是所有文章的图片和标题，并通过ACF的设置动态地进行样式和过滤。
我想要达到的效果是：使用Bootstrap时每行有4列，但当有多于4篇文章（例如同一类别的第二或第三行），创建折叠功能以显示第5篇及以后的文章。
因此，经过一些尝试，我得出结论最好的方法是创建一个循环，结合过滤，这将创建我想要创建的视图。不幸的是，尝试了一些不同的方法后，我有点卡住了。下面是代码：
我想要达到的效果是：使用Bootstrap时每行有4列，但当有多于4篇文章（例如同一类别的第二或第三行），创建折叠功能以显示第5篇及以后的文章。
因此，经过一些尝试，我得出结论最好的方法是创建一个循环，结合过滤，这将创建我想要创建的视图。不幸的是，尝试了一些不同的方法后，我有点卡住了。下面是代码：
<div id="items">
<?php
if (have_rows('products_category')) {
while (have_rows('products_category')) : the_row();
// Your loop code
$title = get_sub_field('product_category_name');
$slug = get_sub_field('product_category_slug');
/* Start the filter categpries segment */
$category = get_category_by_slug($slug);
$filter_id = $category->term_id;
$filters = array();
var_dump($filters);
array_push($filters, $filter_id);
var_dump($filters);
array_push($filters, 7);
var_dump($filters);
?>
<div id="items" class="row products margin-0 justify-content-between">
<div class=" <?php echo $filter_id ?> ">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 padding-0 padding-b-10">
<h2><?php echo $title ?></h2>
</div>
<div class="col-lg-12 padding-0">
<div id="products" class="row products margin-0 justify-content-between">
<?php $argsNew = array(
'offset' => 0,
'category' => $filters,
'orderby' => 'date',
'order' => 'DESC',
'include' => '',
'exclude' => '',
'meta_key' => '',
'meta_value' => '',
'post_type' => 'post',
'post_mime_type' => '',
'post_parent' => '',
'author' => '',
'author_name' => '',
'post_status' => 'publish',
'posts_per_page' => -1,
'suppress_filters' => false,
'connected_items' => get_queried_object(),
);
$posts_array = get_posts($argsNew);
$number_posts = count($posts_array);
echo $number_posts;
$i = 0;
foreach ($posts_array as $post) : setup_postdata($post);
$i++;
if($i <= 4) {
?>
<div class="col-lg-3 col-md-6 col-sm-6 col-xs-12 margin-fix padding-s-15 padding-b-30 image_filter">
<?php echo get_the_post_thumbnail($post->ID, '', array('class' => 'img-responsive big_image products_image img_small')); ?>
<?php the_title(sprintf('<h2 class="text-center big_image_product_text products_text"><a href="%s" rel="bookmark">', esc_url(get_permalink())),
'</a></h2>'); ?>
<?php
?>
</div>
<?php
}
else if($i > 4) {
?>
</div>
<div class="row">
<button data-toggle="collapse" class="btn-collapse" data-target="#products_collapse_<?php echo $filter_id ?>">Show more</button>
</div>
<div id="products_collapse_<?php echo $filter_id ?>" class="row products collapse margin-0 justify-content-between">
<div class="col-lg-3 col-md-6 col-sm-6 col-xs-12 margin-fix padding-s-15 padding-b-30 image_filter">
<?php echo get_the_post_thumbnail($post->ID, '', array('class' => 'img-responsive big_image products_image img_small')); ?>
<?php the_title(sprintf('<h2 class="text-center big_image_product_text products_text"><a href="%s" rel="bookmark">', esc_url(get_permalink())),
'</a></h2>'); ?>
</div>
</div>
<?php
}
endforeach;
wp_reset_postdata(); ?>
</div>
</div>
</div>
<?php
endwhile;
}
else {
// no rows found
echo "nothing found!";
}
?>
</div>
更新
我曾尝试使用$number_posts和计数方法创建循环，但遗憾的是，视图会被严重破坏。所以我的问题是：
- 创建一个循环/计数器来计算每个类别中显示的帖子数量。
- 针对这些结果指定视图：
for -> 项目1、2、3、4。将它们放在一排中（1 1 1 1）。 if（超过4项）。将超过5项的项目置于折叠块下。
例如：
3个项目：
Normal view:
1 1 1.
7个条目：
查看+折叠（
1 1 1 1
-collapse button-
1 1 1
(more items)
有人能指导我正确的方向或帮我解决这个问题吗？提前感谢！
PS：如有任何问题，请在下面的评论中提问。
$specified_cats = get_field( "products_category" );- Ali_k