【问题标题】:How to install product carousel on homepage on Shopify Brooklyn Theme?如何在 Shopify 布鲁克林主题的主页上安装产品轮播?
【发布时间】:2021-01-13 06:07:09
【问题描述】:

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

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

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

谢谢!

【问题讨论】:

    标签: shopify liquid slick.js shopify-template


    【解决方案1】:

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

    $('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
          }
        }    
      ]
    });
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2018-10-18
      • 1970-01-01
      • 2016-05-15
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多