after enable slider

Hello there, I can’t access your website. Wordfence is blocking me. From what you said it sounds like a CSS conflict with your theme.

Ok yes, I can see the website now. The problem is on the theme CSS.

Do you know how to add custom CSS? if you do then try this:

.woo-related-products-container .col-md-3.col-sm-4.col-xs-6 {
    width: 100%;
}

If not just let me know.
Thanks.

Glad it worked, to change the slider you’ll need to destroy and re-initiate.
You can do that by adding this function into your functions.php file

function v_woo_related_slider() { 
  if (is_product()) {?>
	<script>
	jQuery(document).ready(function($) {
	$("#woorelatedproducts").data('owlCarousel').destroy();
  	var owl = $("#woorelatedproducts");
	  owl.owlCarousel({
	      items : 4,
	      itemsDesktop : [1000,3],
	      itemsDesktopSmall : [900,3],
	      itemsTablet: [600,2],
	      autoPlay: 3500,
	      itemsMobile : false,
	  });
	  });
	</script> <?php 
	}
}
add_action( 'wp_footer', 'v_woo_related_slider' );

Please do that only if you are familiar with functions.php file edits.

That should help:

.woo-related-products-container {
    width: 98%;
    margin: 0 auto;
}

Well if it didn’t work try to use !important

.woo-related-products-container {
    width: 98%!important;
    margin: 0 auto!important;
}

• This reply was modified 7 years, 1 month ago by Vagelis.

if you want to display 6 items in carousel you ‘ll need to change items variable in the function you added on your functions.php file

owl.owlCarousel({
items : 6,
itemsDesktop : [1000,3],
itemsDesktopSmall : [900,3],
itemsTablet: [600,2],

• This reply was modified 7 years, 1 month ago by Vagelis.
• This reply was modified 7 years, 1 month ago by Vagelis.