Dynamic slide counter

You need Smart Slider 3 version 3.2.12 or greater to use these codes.

With this, you can display the current slide number and the slide count in your slider.

Put this code into your slider's Slider Settings → Developer tab → JavaScript callbacks:

if(!this.isAdmin){
this.ready($.proxy(function() {
        n2('.n2-ss-static-slide span.n2-ss-counter-current').text(this.currentRealSlide.index+1);
        n2('.n2-ss-static-slide span.n2-ss-counter-all').text(this.slides.length);
    }, this));
this.sliderElement.on('mainAnimationComplete',
    $.proxy(function(e, animation, previousSlideIndex, currentSlideIndex) {
        n2('.n2-ss-static-slide span.n2-ss-counter-current').text(currentSlideIndex+1);
        n2('.n2-ss-static-slide span.n2-ss-counter-all').text(this.slides.length);
    }, this));
}

Then create a static slide so it will appear on all of your slides, and put down a text layer, and put this codes inside:

<span class="n2-ss-counter-current">1</span> of <span class="n2-ss-counter-all">2</span>

You are free to add any texts and custom content outside of the span tags, and you can customize them using our font and style manager.

If you would like to have different fonts or styles to the numbers, you can put the <span> tags into different text layers.

See it in action