php - 创建用于显示动态数据的 for 循环

Question

我目前正在开发自定义 WordPress 模板。在此模板中，我试图显示特定类别的所有帖子，将其视为一种产品分割(无销售或任何东西)。所以我现在得到的是通过 ACF 的设置动态显示所有帖子图像和标题以及所有样式和过滤.

我想要实现的是以下结果:(使用 Bootstrap )。

每行 4 列，但当有超过 4 个帖子时。 (因此当特定类别需要第二行或第三行时)，创建折叠功能以显示帖子 5 >。

因此，经过一番尝试后，我得出的结论是，最好的方法是创建一个 for 循环，结合过滤，这将创建我正在尝试创建的 View 。可悲的是，在尝试了一些不同的方法之后，我有点卡住了。代码如下所示:

<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 循环，但遗憾的是 View 已严重损坏。所以我的问题是:

1. 创建一个 for 循环/计数器来计算显示的每个类别的帖子数。
2. 指定对这些结果的看法:

对于 -> 项目 1、2、3、4。将它们排成一排。 (1 1 1 1)。如果(超过 4 个项目)。放置项目 > 5(依此类推)。在折叠 block 下。

例如

3 项:

Normal view: 

1 1 1.

7 项:

查看 + 折叠 (

 1 1 1 1 
 -collapse button-
 1 1 1 
(more items)

)

谁能告诉我正确的方向或者帮助我解决这个问题？提前致谢!

PS:如果你有任何问题，请在下面的评论中提问

Answer 1

假设字段 products_category 返回所选类别 ID 的数组: 这将起作用:

<div id="items">
<?php
    // Retrieve all product categories
    $terms = get_terms( 'product_cat' );
    // Retrieve chosen categories to display 
    $specified_cats = get_field( "products_category" );

    // Loop though product cats
    foreach ( $terms as $term ) {

        $filter_id = $term->term_id;
        // If the current product category id is not in the array 'specified_cats' just to the next iteration
        if(!in_array($filter_id, $specified_cats)){
            continue;
        }

        $title = $term->name;
        $slug = $term->slug;


       ?>
        <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,
                            'orderby' => 'date',
                            'order' => 'DESC',
                            'post_type' => 'product',
                            'post_status' => 'publish',
                            'posts_per_page' => -1,
                            'product_cat'=> $term->name
                        ); 

                        $posts_array = get_posts($argsNew);
                        $number_posts = count($posts_array);
                        $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 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 class="clearfix"></div>
                    </div>
                    <div class="clearfix"></div>
                </div>
            </div>
        </div>
        <?php
    }

?>
</div>

代码已经过测试并且可以正常工作。我什至包含了 Bootstrap 以确保一切正常运行:

<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">

<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>