创建for循环以显示动态数据

时间:2018-03-30 08:39:47

标签: php wordpress function for-loop

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

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

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

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

<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和count方法创建for循环但遗憾的是视图严重损坏。所以我的问题是:

  1. 创建一个for循环/计数器,以计算所显示类别的帖子数。
  2. 指定这些结果的视图:
  3. for - &gt;项目1,2,3,4。将它们排成一排。 (1 1 1 1)。 如果(超过4项)。放置物品&gt; 5(依此类推)。在崩溃的情况下。

    e.g。

    3项:

    Normal view: 
    
    1 1 1.
    

    7项:

    查看+崩溃(

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

    有人能告诉我正确的方向,还是帮助我解决这个问题? 提前谢谢!

    PS:如果您有任何疑问,请在下面的评论中询问他们

1 个答案:

答案 0 :(得分:2)

假设字段products_category返回所选类别ID的数组: enter image description here 这将有效:

<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>