如何在Shopify中的主页以外的页面上显示猫头鹰轮播

Question

我目前有一个猫头鹰旋转木马，我已添加到我的shopify商店的主页上，这一切都很好。我想要找到的是我添加了显示文本的页面，但在这个底部，我想显示另一个轮播滑块，但不知道我怎么称呼它。

目前，我的主题中有以下内容。

液体档案：

<script>


$(document).ready(function () {
    var carousel = $("#owl-demo");
    carousel.owlCarousel({
    items: 3,
    margin:10,
    navigation:true,
    autoHeight : true,
    autoPlay : 3000,
    navigationText: [
      "<i class='icon-chevron-left icon-white'><</i>",
      "<i class='icon-chevron-right icon-white'>></i>"
      ],
  });
});
</script>

我的index.liquid文件包含以下内容：

<div class="carousel-bg">

    <div class="wrapper-with-margin">
      <div id="owl-demo" class="owl-carousel">
        <div><img src="{{ 'carousel-slider1.jpg' | asset_url }}" alt="{{ shop.name }}"></div>
        <div><img src="{{ 'carousel-slider2.jpg' | asset_url }}" alt="{{ shop.name }}"></div>
        <div><img src="{{ 'carousel-slider3.jpg' | asset_url }}" alt="{{ shop.name }}"></div>
      </div>
    </div>   

  </div>

我在页面代码中添加了相同的代码，但没有显示任何内容。

如果有人可以取悦我是否正确，我会非常感激。

提前致谢。