active only One items in carsouel slider From the Dynamic COntent

3 Views
<section class="product_section">
<div class="container">
    <div id="myCarousel" class="carousel slide" data-ride="carousel" data-interval="false">
     <!-- Wrapper for slides -->
        <div class="carousel-inner" role="listbox">
            <?php $loop = new WP_Query( array( 'post_type' => 'product_theme', 'posts_per_page' => -1 ) ); ?>
            <?php while ( $loop->have_posts() ) : $loop->the_post(); ?>
            <div class="item <?php if($c==1) { ?> active<?php } ?>">
                <div class="row">
                    <div class="col-xs-12 col-sm-7 col-md-7 product_image">
                        <?php twentysixteen_post_thumbnail(); ?>
                    </div>
                    <div class="product_detail col-xs-12 col-sm-5 col-md-5">
                        <h2><?php the_title(); ?></h2>
                            <?php echo get_post_meta(get_the_ID(), 'my_custom_fields_custom-field-3', TRUE);?>/span>
                                <?php the_content(); ?>
                                <a href="<?php echo get_post_meta(get_the_ID(), 'my_custom_fields_custom-field-1', TRUE);?>" target="_blank" class="live_demo">Live Demo</a>
                                <a href="<?php echo get_post_meta(get_the_ID(), 'my_custom_fields_custom-field-2', TRUE);?>" class="buy_know">View Details</a>
                    </div><!-- product_detail col-xs-12-->
                </div><!--ROW -->
            </div><!-- itEM-->
            <?php  endwhile; $c=$c+1; wp_reset_query(); ?>
        </div><!--carousel-inner -->

        <!-- Left and right controls -->
        <a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
            <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
            <span class="sr-only">Previous</span>
        </a>
        <a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
            <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
            <span class="sr-only">Next</span>
        </a>
    </div><!--myCarousel -->
</div><!--container -->
</section>

I have tried out this code but it will active all Items NOt a single items anyone have solution for that.I want to active only first items other is in a item so,I will rotate the items.

Post Views: 3

Related posts

1 comment

  1. You can do something like this, of course this is in laravel but I’m sure you will get the idea.

    <div class="carousel-inner" role="listbox">
  @if(count($images) > 0)
  <?php $a=1;?>
    @foreach($images as $image)
        <div class="item <?php if($a==1){?>active<?php }?>">
          <img src="{{ $image->image_path }}" alt="{{ $image->caption }}" class="img-thumbnail gallery">
           <div class="carousel-caption">
              <!-- <h2>{{ $image->caption }}</h2> -->
               <p class="message">{{ $image->description }}</p>
             </div>
          </div>
  <?php $a++;?>
@endforeach
@else
   <div class="alert alert-danger"><span>No images</span></div>
@endif
</div>  <!-- end of Wrapper for slides -->

Comments are closed.