Slider Pro вертикальные минатюры

как в слайдере Slider Pro сделать вертикальные миниатюры справа как здесь

<div class="slider-pro sp-vertical" id="my-slider">
                        <div class="sp-slides sp-slides-container">
                            <!-- Slide 1 -->
                            <div class="sp-slide">
                                <img class="sp-image" src="img/sliderp.png"/>
                            </div>
                            <!-- Slide 2 -->
                            <div class="sp-slide">
                                <img class="sp-image" src="img/sliderp.png"/>
                            </div>
                        </div>
                        <div class="sp-thumbnails sp-thumbnails-container sp-right-thumbnails sp-has-pointer sp-swiping">
                            <img class="sp-thumbnail" src="img/sliderp.png" data-src="img/sliderp.png"/>
                            <img class="sp-thumbnail" src="img/sliderp.png" data-src="img/sliderp.png"/>
                        </div>
                    </div>

пробовал так, но не работает

$(document).ready(function(){
        $( '#my-slider' ).sliderPro({
            'data-vertical': true,
        });
    });