Slick Slider Syncing Multiple | Как сделать отображение двух слайдов одновременно?

Question

[Vadim Kinev]

Приветствую! Столкнулся с проблемой. Мне нужна реализация слик-слайдера через его возможность Slider Syncing, но отображая не один slide, а два одновременно (slidesToShow: 2 - on .slider-for).

<div class="good__photo-showcase">
                                <div class="slider-for">
                                    <div class="item">
                                        <img src="img/img.jpg" alt="image"  draggable="false"/>
                                    </div>
                                    <div class="item">
                                        <img src="img/img.jpg" alt="image" draggable="false"/>
                                    </div>
                                    <div class="item">
                                        <img src="img/1.jpg" alt="image" draggable="false"/>
                                    </div>
                                    <div class="item">
                                        <img src="img/img.jpg" alt="image" draggable="false"/>
                                    </div>
                                    <div class="item">
                                        <img src="img/img.jpg" alt="image" draggable="false"/>
                                    </div>
                                </div>
                                
                                <div class="slider-nav">
                                    <div class="item">
                                        <img src="img/img.jpg" alt="image"  draggable="false"/>
                                    </div>
                                    <div class="item">
                                        <img src="img/img.jpg" alt="image" draggable="false"/>
                                    </div>
                                    <div class="item">
                                        <img src="img/1.jpg" alt="image" draggable="false"/>
                                    </div>
                                    <div class="item">
                                        <img src="img/img.jpg" alt="image" draggable="false"/>
                                    </div>
                                    <div class="item">
                                        <img src="img/img.jpg" alt="image" draggable="false"/>
                                    </div>
                                </div>

                            </div>

$('.slider-for').slick({
  slidesToShow: 1,  // здесь нужно отобразить два блока одновременно
  slidesToScroll: 1,
  arrows: false,
  fade: true,
  asNavFor: '.slider-nav',
	 autoplay: true
});
$('.slider-nav').slick({
  slidesToShow: 3,
  slidesToScroll: 1,
  asNavFor: '.slider-for',
  arrows: false,
  dots: false,
  centerMode: true,
  focusOnSelect: true,
  vertical: true

});

Задавал параметр slidesToShow: 2, но ничего не работает, слайдер ломается полностью.

Заранее благодарю за помощь.