Page 1 of 1

How to hide carousel and slideshow banners in mobile view

Posted: Fri Feb 17, 2017 10:19 pm
by cleve
I would really appreciate if someone could kindly help me step by step on how to hide or disable mobile view of carousel and slideshows like the left column. I would like them to display on tabs but not on smartphones. I have seen in many discussion that it has got to do with editing the @media thing however am not sure where and what to input that in the css file. Kindly help! I am using opencart 2.2. Thank you so much.

Re: How to hide carousel and slideshow banners in mobile view

Posted: Sat Feb 18, 2017 1:34 am
by uksitebuilder
You can try editing the .tpl files

catalog/view/theme/default/template/module/carousel.tpl
catalog/view/theme/default/template/module/slideshow.tpl

Find:

Code: Select all

class="owl-carousel"
Change To:

Code: Select all

class="hidden-sm owl-carousel"

Re: How to hide carousel and slideshow banners in mobile view

Posted: Sat Feb 18, 2017 4:37 pm
by cleve
uksitebuilder wrote:
Sat Feb 18, 2017 1:34 am
You can try editing the .tpl files

catalog/view/theme/default/template/module/carousel.tpl
catalog/view/theme/default/template/module/slideshow.tpl

Find:

Code: Select all

class="owl-carousel"
Change To:

Code: Select all

class="hidden-sm owl-carousel"
uksitebuilder, Just tried this however its still the same. The carousel banners and slideshows are still displaying on mobile view. I am using the default theme btw.

Thanks

Re: How to hide carousel and slideshow banners in mobile view

Posted: Sun Feb 19, 2017 1:06 am
by uksitebuilder
Apologies, you are right. Looks like own_carousel overrides default bootstrap hidden classes.

Re: How to hide carousel and slideshow banners in mobile view

Posted: Thu Jul 27, 2017 8:17 pm
by aymeric
Works for me (smartphones are XS size not SM) :
<div id="slideshow<?php echo $module; ?>" class="owl-carousel hidden-xs">

using : opencart 2.3.0.2