Customising slick carousel code

vitamentltd
Tourist
17 0 1

I have created my own slick carousel. Please see on frontpage of website (special offers) www.vitament.co.uk 

How can i customise this carousel to use the following code, it is the centre highlight code for slick:


$('.center').slick({
centerMode: true,
centerPadding: '60px',
slidesToShow: 3,
responsive: [
{
breakpoint: 768,
settings: {
arrows: false,
centerMode: true,
centerPadding: '40px',
slidesToShow: 3
}
},
{
breakpoint: 480,
settings: {
arrows: false,
centerMode: true,
centerPadding: '40px',
slidesToShow: 1
}
}
]
});

 

My current code is

theme.scss
.collection-slider
{
.slick-track{
display:flex;
}
.product-card{width:100%;
}

 

Javascript:

$('.collection-slider').each(function(){
var num_slides=2
if ($(window).width() <= 750
{
var num_slides=$(this).data('slides');
}
$(this).slick({slidesToShow:num_slides});

});

});

0 Likes