Hello,
Please try this code:
(function($) {
if ( 'undefined' !== typeof ($.fn.owlCarousel)) {
var $this = $('.instagram-slider');
var $owl = $this.find('.owl-carousel');
if (!$owl.length) {
return;
}
if ($owl.hasClass('owl-loaded')) {
$owl.trigger('destroy.owl.carousel');
}
$owl.owlCarousel({
rtl: false,
items: $this.data('desktop') ? $this.data('desktop') : 1,
responsive: {
1025: {
items: $this.data('desktop') ? $this.data('desktop') : 1
},
769 : {
items: $this.data('tablet_landscape') ? $this.data('tablet_landscape') : 1
},
577 : {
items: $this.data('tablet') ? $this.data('tablet') : 1
},
0 : {
items: $this.data('mobile') ? $this.data('mobile') : 1
}
},
autoplay : $this.data('autoplay') === 'yes',
autoplayHoverPause: $this.data('autoplay') === 'yes',
autoplayTimeout : $this.data('speed') ? $this.data('speed') : 5000,
dots : $this.data('hide_pagination_control') !== 'yes',
nav : $this.data('hide_prev_next_buttons') !== 'yes',
autoHeight : $this.data('autoheight') === 'yes',
slideBy : typeof $this.data('scroll_per_page') !== 'undefined' ? 1 : 'page',
navText : false,
navClass : ['owl-prev wd-btn-arrow', 'owl-next wd-btn-arrow'],
center : $this.data('center_mode') === 'yes',
loop : $this.data('wrap') === 'yes',
dragEndSpeed : $this.data('dragendspeed') ? $this.data('dragendspeed') : 200
});
}
})(jQuery);
Please add the code to the Theme Settings > Custom JS > On document ready.
Best Regards
.
