You can add an Carousel on any Page using the Code below:
<div class="owl-carousel image-carousel carousel-widget" data-margin="20" data-nav="true" data-pagi="false" data-items-xs="2" data-items-sm="3" data-items-md="4" data-items-lg="5">
<div class="oc-item">
<a href="#"><img src="images.jpg" alt="Image 1"></a>
</div>
<div class="oc-item">
<a href="#"><img src="images.jpg" alt="Image 2"></a>
</div>
<div class="oc-item">
<a href="#"><img src="images.jpg" alt="Image 3"></a>
</div>
<div class="oc-item">
<a href="#"><img src="images.jpg" alt="Image 4"></a>
</div>
<div class="oc-item">
<a href="#"><img src="images.jpg" alt="Image 5"></a>
</div>
<div class="oc-item">
<a href="#"><img src="images.jpg" alt="Image 6"></a>
</div>
<div class="oc-item">
<a href="#"><img src="images1.jpg" alt="Image 7"></a>
</div>
</div>
You must be logged in with your Envato Account for Free in order to view this Content.
Login with EnvatoOwl Carousels are initialized using the Standard Functionality by default, but there might instances when you would have to Create a Custom Functionality. To use this you can simply add the .customjs
Class to .carousel-widget
Container as this will stop it from using the Default Functionality and allow you to extend the Owl Carousel with your own Custom Functionality.
You can find more Owl Carousel related Settings for Custom JS Initialization here.
Last Modified: May 31, 2020