Issue
I am trying to change the featured product to a carousel on the homepage on Shopify - Brooklyn theme. I followed some instructions here which was supposed to work on the Brooklyn theme: https://www.youtube.com/watch?v=r7I3T4wB2cQ
However the carousel came up vertical when I installed it. Here is my store: http://sacredcoffeeco.com -- the carousel is at the bottom of the page.
Does anyone know how to make the slider horizontal?
Thank you!
Solution
It seems you don't init slider JS to newly created HTML, you need to add the code to your theme.js.liquid
and also need some changes to CSS code to design purpose.
$('ul.slick').slick({
dots: true,
infinite: false,
speed: 300,
slidesToShow: 3,
slidesToScroll: 3,
responsive: [
{
breakpoint: 1024,
settings: {
slidesToShow: 3,
slidesToScroll: 3,
infinite: true,
dots: true
}
},
{
breakpoint: 600,
settings: {
slidesToShow: 2,
slidesToScroll: 2
}
},
{
breakpoint: 480,
settings: {
slidesToShow: 1,
slidesToScroll: 1
}
}
]
});
Answered By - Onkar Answer Checked By - Marilyn (PHPFixing Volunteer)
0 Comments:
Post a Comment
Note: Only a member of this blog may post a comment.