Post by platypuspuzzles » Mon May 18, 2015 11:11 pm

I have opencart 2.020 installed and have just replaced the manufactures banner slider images with png files of brands for my business. On the website it looks great, just like the demo.

On the mobile (iphone 4) the images are sitting to the left when scrolling through the banner slider, instead of center to the scroll arrows.

Not sure if this is a bug or can be corrected in admin somewhere

Active Member

Posts

Joined
Sun Jan 23, 2011 8:11 pm

Post by nudylady » Sat Jul 25, 2015 2:32 am

same problem. please help

New member

Posts

Joined
Sun Feb 19, 2012 12:14 am

Post by OpenTeam » Sat Jul 25, 2015 3:07 am

Hello,

do you have a link where we can see the bug online?

Best Regards,
OpenTeam

User avatar
Active Member

Posts

Joined
Tue May 19, 2015 2:31 am

Post by nudylady » Sat Jul 25, 2015 11:09 am

OpenTeam wrote:Hello,

do you have a link where we can see the bug online?

Best Regards,
OpenTeam
charmpandora.com
I tried Iphone 5 and chrome mobile emulation. all gave look like below

Image

New member

Posts

Joined
Sun Feb 19, 2012 12:14 am

Post by platypuspuzzles » Sat Jul 25, 2015 8:39 pm

yep, that's the same for me too.

I just had a look on the computer with firefox, and it does the same thing

Active Member

Posts

Joined
Sun Jan 23, 2011 8:11 pm

Post by viethemes » Sun Jul 26, 2015 3:18 pm

To solve this problem, you can open file catalog\view\theme\default\template\module\carousel.tpl
find

Code: Select all

items: 1,
and add code below after that line

Code: Select all

center:true,

http://www.viethemes.com - OpenCart turtorials, news, tips and stricks, extension

Our extensions:
Visual Theme Editor - Powerful tool for customizing style of any theme visually
Live Theme Editor - Customize layout, colors, backgrounds, fonts of the default theme
Theme Animation - Animation Editor for any theme

Extra Positions PRO, Custom JavaScript, Custom CSS and others


User avatar
Active Member

Posts

Joined
Thu Jan 08, 2015 12:17 pm


Post by nudylady » Sun Jul 26, 2015 4:46 pm

viethemes wrote:To solve this problem, you can open file catalog\view\theme\default\template\module\carousel.tpl
find

Code: Select all

items: 1,
and add code below after that line

Code: Select all

center:true,
I cannot find: items: 1,
this my carousel.tpl content:

Code: Select all

<div id="carousel<?php echo $module; ?>" class="owl-carousel">
  <?php foreach ($banners as $banner) { ?>
  <div class="item text-center">
    <?php if ($banner['link']) { ?>
    <a href="<?php echo $banner['link']; ?>"><img src="<?php echo $banner['image']; ?>" alt="<?php echo $banner['title']; ?>" class="img-responsive" /></a>
    <?php } else { ?>
    <img src="<?php echo $banner['image']; ?>" alt="<?php echo $banner['title']; ?>" class="img-responsive" />
    <?php } ?>
  </div>
  <?php } ?>
</div>
<script type="text/javascript"><!--
$('#carousel<?php echo $module; ?>').owlCarousel({
	items: 6,
	autoPlay: 3000,
	navigation: true,
	navigationText: ['<i class="fa fa-chevron-left fa-5x"></i>', '<i class="fa fa-chevron-right fa-5x"></i>'],
	pagination: true
});
--></script>

New member

Posts

Joined
Sun Feb 19, 2012 12:14 am

Post by viethemes » Mon Jul 27, 2015 10:07 pm

Sorry. I modified my local file.
You can insert code after

Code: Select all

items: 6,

http://www.viethemes.com - OpenCart turtorials, news, tips and stricks, extension

Our extensions:
Visual Theme Editor - Powerful tool for customizing style of any theme visually
Live Theme Editor - Customize layout, colors, backgrounds, fonts of the default theme
Theme Animation - Animation Editor for any theme

Extra Positions PRO, Custom JavaScript, Custom CSS and others


User avatar
Active Member

Posts

Joined
Thu Jan 08, 2015 12:17 pm


Post by nudylady » Wed Jul 29, 2015 1:23 am

viethemes wrote:Sorry. I modified my local file.
You can insert code after

Code: Select all

items: 6,
this code worked. thank you so much

New member

Posts

Joined
Sun Feb 19, 2012 12:14 am

Post by lui-g » Tue Oct 20, 2015 8:25 am

This is not working for me to center the images. I have 11 but only one displace on mobile.

this is the code... Please help.

Code: Select all

<div id="carousel<?php echo $module; ?>" class="owl-carousel">
  <?php foreach ($banners as $banner) { ?>
  <div class="item text-center">
    <?php if ($banner['link']) { ?>
    <a href="<?php echo $banner['link']; ?>"><img src="<?php echo $banner['image']; ?>" alt="<?php echo $banner['title']; ?>" class="img-responsive" /></a>
    <?php } else { ?>
    <img src="<?php echo $banner['image']; ?>" alt="<?php echo $banner['title']; ?>" class="img-responsive" />
    <?php } ?>
  </div>
  <?php } ?>
</div>
<script type="text/javascript"><!--
$('#carousel<?php echo $module; ?>').owlCarousel({
	items: 6,
	center: true,
	autoPlay: 3000,
	navigation: true,
	navigationText: ['<i class="fa fa-chevron-left fa-5x"></i>', '<i class="fa fa-chevron-right fa-5x"></i>'],
	pagination: true
});
--></script>

New member

Posts

Joined
Fri Jun 08, 2012 12:48 am

Post by viethemes » Wed Oct 21, 2015 12:40 am

Do you want to display 11 logos in mobile?

http://www.viethemes.com - OpenCart turtorials, news, tips and stricks, extension

Our extensions:
Visual Theme Editor - Powerful tool for customizing style of any theme visually
Live Theme Editor - Customize layout, colors, backgrounds, fonts of the default theme
Theme Animation - Animation Editor for any theme

Extra Positions PRO, Custom JavaScript, Custom CSS and others


User avatar
Active Member

Posts

Joined
Thu Jan 08, 2015 12:17 pm


Post by lui-g » Wed Oct 21, 2015 8:26 am

Yes, just one at a time. Currently, its aligned left. I wanted to display them centered and have it animate one or two at a time. Whatever the orientation and width decides it allows.

New member

Posts

Joined
Fri Jun 08, 2012 12:48 am

Post by viethemes » Wed Oct 21, 2015 10:11 pm

To fix this problem, you can install my free extension Custom CSS and add code below

Code: Select all

.owl-wrapper .img-responsive {
	display: inline-block;
}

http://www.viethemes.com - OpenCart turtorials, news, tips and stricks, extension

Our extensions:
Visual Theme Editor - Powerful tool for customizing style of any theme visually
Live Theme Editor - Customize layout, colors, backgrounds, fonts of the default theme
Theme Animation - Animation Editor for any theme

Extra Positions PRO, Custom JavaScript, Custom CSS and others


User avatar
Active Member

Posts

Joined
Thu Jan 08, 2015 12:17 pm


Post by lui-g » Sat Oct 24, 2015 6:12 am

Your help here is much appreciated. You've already helped me from reading all your other tips and tricks in regards to other post. Your extensions are time saving and generous. As soon as I financially able I will show my appreciation and purchase one. Home my site becomes lucrative.

The code worked perfect.

New member

Posts

Joined
Fri Jun 08, 2012 12:48 am

Post by viethemes » Sat Oct 24, 2015 6:37 pm

Glad to hear that you are happy with my work :)

http://www.viethemes.com - OpenCart turtorials, news, tips and stricks, extension

Our extensions:
Visual Theme Editor - Powerful tool for customizing style of any theme visually
Live Theme Editor - Customize layout, colors, backgrounds, fonts of the default theme
Theme Animation - Animation Editor for any theme

Extra Positions PRO, Custom JavaScript, Custom CSS and others


User avatar
Active Member

Posts

Joined
Thu Jan 08, 2015 12:17 pm

Who is online

Users browsing this forum: No registered users and 43 guests