<style>
/* Styling Carousel */
.carousel-control.left {
left: -12px;
background-image: none;
background: none repeat scroll 0 0 #222222;
border: 4px solid #FFFFFF;
border-radius: 23px 23px 23px 23px;
height: 40px;
width: 40px;
margin-top: 30px;
line-height: 28px;
}
.carousel-control.right {
right: -12px !important;
background-image: none;
background: none repeat scroll 0 0 #222222;
border: 4px solid #FFFFFF;
border-radius: 23px 23px 23px 23px;
height: 40px;
width: 40px;
margin-top: 30px;
line-height: 28px;
}
</style>
<?php
$i = 0 ;
?>
<div id="myCarousel" class="carousel slide" data-ride="carousel">
<!-- Wrapper for slides -->
<div class="carousel-inner">
<?php while ( $pique_child_pages->have_posts() ) : $pique_child_pages->the_post(); ?>
<?php
if($i == 0){
echo '<div class="item active">';
}
else if (($i % 3) == 0){
echo '<div class="item">';
//echo '<div class="row">';
}
$i++ ;
?>
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<?php
if ( has_post_thumbnail() ) :
the_post_thumbnail( 'pique-square' );
endif;
?>
<?php the_title( '<h3>' , '</h3>' ); ?>
<?php the_content(); ?>
</article>
<?php
if (($i % 3) == 0 || $i == $pique_child_pages->post_count ){
echo "</div><!-- fermuture de custom class -->";
//$i = 0 ;
}
?>
<?php endwhile; ?>
</div> <!-- END carousel-inner -->
<!-- Left and right controls -->
<a class="left carousel-control" href="#myCarousel" data-slide="prev">‹</a>
<a class="right carousel-control" href="#myCarousel" data-slide="next">›</a>
</div> <!-- myCarousel -->