Product Thumbnail Images Question for Mobile View in Impulse Theme

Technical Q&A
1

Hello guys,

I currently use the Impulse theme and I have one problem - the product thumbnails appear in the Desktop view only and in the Mobile view, I get dots, which look ugly because I have many variants. Here are some images:

Screenshot 2022-03-31 at 15.45.58.png
Screenshot 2022-03-31 at 15.45.58.png966Ă—872 239 KB

This is the Mobile view in which I get only dots. And below is the Desktop view in which I have thumbnails on the left. I would like to have thumbnails below the main product. Mobile view. Is this possible?

Screenshot 2022-03-31 at 15.46.07.png
Screenshot 2022-03-31 at 15.46.07.png1200Ă—1020 112 KB

Any help would be appreciated,

Thanks

2

Hi @JordanM ,

Go to Assets > theme.css and paste this at the bottom of the file:

@media only screen and (max-width: 768px) {
	.product__main-photos {
		 margin-bottom: 0 !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
	}
	.product__main-photos .flickity-page-dots {
		display: none !important;
	}
	.grid--product-images--partial .flickity-slider .product-main-slide {
		width: 100% !important;
		margin-right: 0 !important;
	}
	.product__thumbs--beside {
		order: -1 !important;
		margin-left: 0 !important;
		margin-right: 15px !important;
	}
}

Hope it helps!

2 Likes
3

Hello,

I haven’t bought the theme yet, however, once I do I will try it for sure! Thanks for the help?

4

Thanks for the help*

1 Like
5

Hi @JordanM ,

If it helped you solve your issue, please mark it as a solution. Thank you and good luck.

1 Like
6

Hi @JordanM ,

I saw you liked my answer. If it helped you solve your issue, please mark it as a solution. Thank you and good luck.

7

@LitExtension

Hello, I tried adding the code to the bottom of the theme.scss, however all that happened is that the dots disappeared and I don’t have the product thumbnail images showing. Please assist.

Jordan

8

Hi @JordanM ,

Please send your site and if your site is password protected, please send me the password. I will check it.

9

Hello,

I’ve managed to solve the problem by following the instructions on this site:

https://ezfycode.com/blog/impulse-theme-thumbnails-mobile-product-page

In editing the JavaScript you need to search for “initSlider” not “initSliders:” and follow the given instructions.

10

Hi Jordan,

That is indeed outdated as the newer version does not have InitSliders: in it.

However, after trying to look for Initslider without the S and the :, I found no exact results that match.

What exactly have you done, thank you!

11

This works perfectly, but it makes the positions same as per desktop, if beside on desktop, it’ll be same on mobile, same as it is for below.

But preferred to have beside on desktop and below on mobile.

12

Hello, My site (itsmysoft.com) has the same issue. The dots disappeared but I wanna display thumbnails slider on mobile view. Could you assist me?

13

Hello it works!, thank you but now the announcement bar doesn´t have the animation, how can i get the original announcement bar with the animation, thank you!