如何在 Shopify 布鲁克林主题的主页上安装产品轮播？

问题描述

我正在尝试将 Shopify 主页上的特色产品更改为轮播 - 布鲁克林主题。我在这里遵循了一些应该适用于布鲁克林主题的说明：https://www.youtube.com/watch?v=r7I3T4wB2cQ

然而，当我安装它时，旋转木马是垂直的。这是我的商店：http://sacredcoffeeco.com -- 轮播位于页面底部。

有谁知道如何使滑块水平？

谢谢！

解决方法

您似乎没有将滑块 JS 初始化为新创建的 HTML，您需要将代码添加到您的 theme.js.liquid 中，并且还需要对 CSS 代码进行一些更改以达到设计目的。

$('ul.slick').slick({
  dots: true,infinite: false,speed: 300,slidesToShow: 3,slidesToScroll: 3,responsive: [
    {
      breakpoint: 1024,settings: {
        slidesToShow: 3,infinite: true,dots: true
      }
    },{
      breakpoint: 600,settings: {
        slidesToShow: 2,slidesToScroll: 2
      }
    },{
      breakpoint: 480,settings: {
        slidesToShow: 1,slidesToScroll: 1
      }
    }    
  ]
});