Question

 <div class="row weOffer">
            <div class="col-12">
                <div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
                  <ol class="carousel-indicators">
                    <li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
                    I want this to be come from loop 
                    <li data-target="#carouselExampleIndicators" data-slide-to="1" class=""></li>
                  </ol>
                  <div class="carousel-inner">
                     <!-- active class -->
                    <div class="carousel-item active">
                      <div class="row">
                        <div class="col-12 col-lg-3">
                            <div class="card mb-4 box-shadow">
                            <span class="layer">image</span>
                            <div class="d-flex justify-content-between align-items-center position-relative">
                                <strong class="text-white">$150</strong>
                              </div>
                            <div class="card-body">                
                              <h5>heading</h5>
                              <p class="card-text">this id dummy text</p>                  
                            </div>
                          </div>
                        </div>
                       there are 3 more div of same 
                      </div>
                    </div>
                    <!-- inactive class -->
                    <div class="carousel-item">
                      <div class="row">
                        <div class="col-12 col-lg-3">
                            <div class="card mb-4 box-shadow">
                            <span class="layer">image</span>
                            <div class="d-flex justify-content-between align-items-center position-relative">
                                <strong class="text-white">$150</strong>
                              </div>
                            <div class="card-body">                
                              <h5>heading</h5>
                              <p class="card-text">this id dummy text</p>                  
                            </div>
                          </div>
                        </div>
                       there are 3 more div of same 
                      </div>
                    </div>
                    <!-- inactive class -->

            </div>

            </div>
        </div>
    </div>

我已经添加了HTML结构，请检查适用于现役班和现役班我希望所有人都循环工作我在轮播中有帖子，我希望在每4篇帖子中添加一个onw指示符后，在该轮播中显示4个帖子指示器

Answer 1

添加以下代码，则它可能同时适用于active和inactive以及indicators

<div class="row weOffer">
    <div class="col-12">
        <div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
            <?php $post_args = array
                        (
                            'post_type' => 'your_post_type_name',
                            'post_status' => 'publish',
                            'posts_per_page' => -1
                        );
                $post_query = new WP_Query($post_args);
                if($post_query->have_posts())
                { 
                    $count = 0;
                    while($post_query()->have_posts()) : $post_query->the_post();
                    {
              if($count%4==0){?>
            <ol class="carousel-indicators">
              <li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
              I want this to be come from loop 
              <li data-target="#carouselExampleIndicators" data-slide-to="1" class=""></li>
            </ol>
            <div class="carousel-inner">
            <?php }?>
                    <div class="carousel-item <?php if($count < 4){?>active <?php }?>">
                      <div class="row">
                        <div class="col-12 col-lg-3">
                            <div class="card mb-4 box-shadow">
                            <span class="layer">image</span>
                            <div class="d-flex justify-content-between align-items-center position-relative">
                                <strong class="text-white">$150</strong>
                              </div>
                            <div class="card-body">                
                              <h5>heading</h5>
                              <p class="card-text">this id dummy text</p>                  
                            </div>
                          </div>
                        </div>
                       there are 3 more div of same 
                      </div>
                    </div>  
             if($count%4==0){ </div> <?php } ?>
             <?php $count++; } } wp_reset_query();?>
        </div>
    </div>
</div>

在Wordpress中发布轮播无法正常工作

1 个答案: