OC 2.0.1.1 - 2 column product thumb on mobile (responsive)

Quote

Post by onlinemarketer » Fri Jan 23, 2015 3:50 am

Does anyone know the CSS for having featured module or categories to show products in 2 columns instead of 1 columns when screen width is mobile size?
onlinemarketer
Active Member
Posts
158
Joined
Sat May 14, 2011 8:21 pm
Top

Re: OC 2.0.1.1 - 2 column product thumb on mobile (responsiv

Quote

Post by nudylady » Fri Jul 24, 2015 4:45 pm

anyone suggestion for 2 column on mobile?
nudylady
New member
Posts
75
Joined
Sun Feb 19, 2012 12:14 am
Top

Re: OC 2.0.1.1 - 2 column product thumb on mobile (responsiv

Quote

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

Most of well developed shops are using 2 column. this is zappos screen shot
Image
nudylady
New member
Posts
75
Joined
Sun Feb 19, 2012 12:14 am
Top

Re: OC 2.0.1.1 - 2 column product thumb on mobile (responsiv

Quote

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

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

Code: Select all

col-xs-12
and replace with

Code: Select all

col-xs-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
viethemes
Active Member
Posts
1964
Joined
Thu Jan 08, 2015 12:17 pm
Top

Re: OC 2.0.1.1 - 2 column product thumb on mobile (responsiv

Quote

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

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

Code: Select all

col-xs-12
and replace with

Code: Select all

col-xs-6
thank you for your input
I would like this for the whole website. Not just for featured products. Products are displayed in 2 column under any category. your help is great.
nudylady
New member
Posts
75
Joined
Sun Feb 19, 2012 12:14 am
Top

Re: OC 2.0.1.1 - 2 column product thumb on mobile (responsiv

Quote

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

To do that, you can open file catalog\view\javascript\common.js
find

Code: Select all

$('#content .product-layout').attr('class', 'product-layout product-grid col-lg-4 col-md-4 col-sm-6 col-xs-12');
and replace with

Code: Select all

$('#content .product-layout').attr('class', 'product-layout product-grid col-lg-4 col-md-4 col-sm-6 col-xs-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
viethemes
Active Member
Posts
1964
Joined
Thu Jan 08, 2015 12:17 pm
Top

Re: OC 2.0.1.1 - 2 column product thumb on mobile (responsiv

Quote

Post by ju5t4fun » Thu Oct 01, 2015 12:21 pm

Thanks Viethemes. It worked but a small issue here. Some of the product box is longer and thus some can't display 2 products. how to standardise the box size (grip)?
ju5t4fun
Newbie
Posts
7
Joined
Tue Feb 17, 2015 12:04 am
Top

Re: OC 2.0.1.1 - 2 column product thumb on mobile (responsive)

Quote

Post by Gabrielito80 » Thu May 18, 2017 6:21 am

Hi,

Please OpenCart 2.3.0.2 - 2 column product thumb on mobile?
Gabrielito80
Newbie
Posts
5
Joined
Thu May 18, 2017 5:24 am
Top
Post Reply
Return to “General Support”
Who is online

Users browsing this forum: No registered users and 10 guests