Loop de carousel bootstrap

Olá, estou tentando fazer com que meu slide seja semelhante a esse> http://www.bootply.com/wXSCqoA51s mas eu não estou sabendo fazer o loop de forma correta, fiz funcionar com 1 imagem por vez, mas eu gostaria que fossem igual ao link acima, meu código atual é esse:

<?php
$per_page = 5;
$n=0;
$args = array( 'post_type' => 'meusprodutos', 'posts_per_page' => $per_page );
$loop = new WP_Query( $args );
if($loop->have_posts()):
  ?>
<div class="carousel-loja">

   <div id="shopCarousel" class="carousel slide">
    <div class="ponteiros">
      <ol class="carousel-indicators">
        <?php  while($loop->have_posts()): $loop->the_post(); ?>
          <li data-target="#shopCarousel" data-slide-to="<?php echo $n++; ?>"></li>
        <?php endwhile; ?>
      </ol>
    </div><!--ponteiros-->

    <!-- Carousel items -->
    <div class="carousel-inner">

     <div class="row">

      <?php  while($loop->have_posts()): $loop->the_post(); ?>

      	<div class="col-md-4">
      <div class="item <?php if (0 == $n) {echo "active";} ?>">

            <h4><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h4>

      </div><?php $n++ ?>
      </div>
    <?php endwhile; ?>

    </div>

  </div>

</div>
</div>
<?php
endif;
wp_reset_query();
?>

Alguem sabe me dizer onde estou errando?