To display the navigation elements "Prev"/"Next" in Owl Carousel, use the data attribute data-nav="true" for the target carousel:
<div class="owl-carousel" data-nav="true"> ... </div>
Project Manager
As a Project Manager at a small local company, I was looking for a universal solution for my company’s website.
Architect
Thanks to Novi Builder, I am now able to showcase all my works without doing any extra coding and design manipulations. Thank you!
Project Manager
As a Project Manager at a small local company, I was looking for a universal solution for my company’s website.
Architect
Thanks to Novi Builder, I am now able to showcase all my works without doing any extra coding and design manipulations. Thank you!
Project Manager
As a Project Manager at a small local company, I was looking for a universal solution for my company’s website.
Architect
Thanks to Novi Builder, I am now able to showcase all my works without doing any extra coding and design manipulations. Thank you!
To display pagination in Carousel, use data attribute data-dots="true" for the target carousel:
<div class="owl-carousel" data-dots="true"> ... </div>
To display fullwidth carousel add class .owl-carousel-style-2 and use the data attribute data-*-stage-padding="N", data-*-margin="N":
<div class="owl-carousel owl-carousel-style-2" data-items="1" data-sm-items="2" data-stage-padding="30" data-lg-stage-padding="100" data-xl-stage-padding="300" data-loop="true" data-margin="30" data-mouse-drag="true" data-autoplay="true"> ... </div>
To display centered Carousel wrap your carousel in div with class .owl-carousel-centered, add data attribute data-center='true', add a markup below and data attribute data-numbering='#owl-numbering-1' to add a custom counter:
<div class="owl-numbering owl-numbering-default" id="owl-numbering-1"> <div class="numbering-current"></div> <div class="numbering-separator"></div> <div class="numbering-count"></div> </div>
