Product Page Thumbnail Gallery

Developers Frontend
1

Hello

i want to make the thumbs to com closer because in mobile shows only one .

Screenshot_2.png

2

If you want to show 2 items on mobile screen, you should do the following:

1- Clone responsive theme (if you haven't done so yet).

2- Copy the file scroller_init.tpl from /responsive/templates/common to /your_theme_name/templates/commmon

3- On line 29 replace 

mobile = [479, 1];

with

mobile = [479, 2];

Clear cache and you should get two items on mobile screen.

3

If you want to show 2 items on mobile screen, you should do the following:

1- Clone responsive theme (if you haven't done so yet).

2- Copy the file scroller_init.tpl from /responsive/templates/common to /your_theme_name/templates/commmon

3- On line 29 replace 

mobile = [479, 1];

with

mobile = [479, 2];

Clear cache and you should get two items on mobile screen.

i have make this change for store front allready . i need it for thumbnails inside product page under main image .

4

Then, you should change the margin/padding of the gallery. This depends on your theme. But try to add the below CSS in your theme CSS files (or in Custom CSS area in Theme Designer). 

.ty-product-thumbnails__item {
    margin: 10px !important;
}

Not tested.

5

Then, you should change the margin/padding of the gallery. This depends on your theme. But try to add the below CSS in your theme CSS files (or in Custom CSS area in Theme Designer). 

.ty-product-thumbnails__item {
    margin: 10px !important;
}

Not tested.

it moves all gallery , not the gap between them

6

Hello

i want to make the thumbs to com closer because in mobile shows only one .

Please share or PM me URL of your website

7

Please share or PM me URL of your website

www.cleverbuynow.com

8

Looks like you fixed the issue. Please confirm

9

thanks for your help , life saver ...