Question

我已经在我自己的静态html代码中完成了此功能，该功能可以通过使用CDN来实现，如下所示，但是我对如何将其放置在我创建的子主题中感到困惑（我将Divi主题用于Wordpress。如果有人可以向我展示使以下功能在我的子主题中正常工作的正确方法，那将是很棒的……现在，我仅创建了一个“ functions.php”和“ style.css”以使其正常工作。谢谢！

在我的头部...

<!-- Owl Carousel css -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.carousel.min.css">
<!-- Owl Carousel theme -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.theme.default.min.css">

在我的身体标签关闭之前...

<script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js"></script>

//owl carousel used for scrolling image gallery
<script>
      $('.clients').owlCarousel({
        loop: true,
        dots: false,
        margin: 10,
        autoplay: true,
        autoplayTimeout: 1000,
        autoplayHoverPause: true,
        responsive: {
            768: {
                items: 5
            }
        }
    });
</script>

和我用来使其工作的html示例...

 <div class="clients owl-carousel owl-theme">
        <div class="thumbnail">
            <img src="img/holoBos.png" alt="Nature">
        </div>

        <div class="thumbnail">
            <img src="img/holoAns.png" alt="Nature">
        </div>
 //more images will be inserted here for as many as needed....
</div>

如何将Owl Carousel滑块添加到Divi子主题

0 个答案: