<span class="pagingInfo"></span>
<div class="slideshow">
<div class="slide-placeholder"><p>Slide 1</p></div>
<div class="slide-placeholder"><p>Slide 2</p></div>
<div class="slide-placeholder"><p>Slide 3</p></div>
<div class="slide-placeholder"><p>Slide 4</p></div>
</div>
<script>
var $status = $('.pagingInfo');
var $slickElement = $('.slideshow');
$slickElement.on('init reInit afterChange', function (event, slick, currentSlide, nextSlide) {
var i = (currentSlide ? currentSlide : 0) + 1;
$status.text(i + '/' + slick.slideCount);
});
$slickElement.slick({
autoplay: true,
dots: true
});
</script>