Display div after every three posts in a slick slider

I have a slick slider displaying some posts. I use the code bellow to achieve this:

    <div class="col-sm-3 news-scroller">
  <div class="slick-slider pin-news-ticker">
        <?php if (have_posts()) : $counter = 1; while (have_posts()) : the_post();

          if( $counter >= 4 ) { ?>

            <!-- Carousel items -->
            <div class="slide">
                <div class="entry entry-smallest-list">
                      <a class="entry-thumb-wrapper" href="<?php the_permalink(); ?>">
                        <div class="entry-thumb">
                          <a href="<?php the_permalink(); ?>">
                            <div class="thumb-wrapper">
                              <?php the_post_thumbnail( 'post-small-rectangle-pin' );?>
                            </div>
                          </a>
                        </div>
                      </a>
                    <div class="entry-details">
                      <div class="entry-date">
                        <small><?php echo get_the_date('M jS, Y'); ?></small>
                      </div>
                      <h4 class="entry-title">
                        <a href="<?php the_permalink(); ?>">
                          <?php echo mnr_shorten_title(get_the_title()); ?>
                        </a>
                      </h4>
                    </div>
                    <div class="clearfix"></div>
                </div> <!-- end .entry-small-list -->
              </div><!--/ .slide-->
            <!--/carousel-inner-->
        <?php }
        $counter++;
        endif;
           endwhile;
        endif;
        ?>

  </div>
</div><!-- end .col-sm-3 -->

I now wish to add a div displaying certain content after every third post in this slider. How could I achieve that?

Read more here: Display div after every three posts in a slick slider

Leave a Reply

Your email address will not be published. Required fields are marked *