cancel
Showing results for 
Search instead for 
Did you mean: 

Photorama: display thumbnails in multiple rows instead of sliding thorugh them

Photorama: display thumbnails in multiple rows instead of sliding thorugh them

I'm trying to merge a M1 site to M2, which means rebuilding the entire theme in M2.

 

In our current M1 theme, thumbnails image on the product page are being display in multiple rows of 3 images. On the new M2 theme, Photorama only allows to slide through the thumbnails.

 

How would I change the behavior of Photorama to display the product images in multiple rows, instead of the only possiblity being to scroll through them?

2 REPLIES

Re: Photorama: display thumbnails in multiple rows instead of sliding thorugh them

not sure if it's possible to turn slide effect off for thumb images. But you can try to override it with css something like this (not the best solution but it works): 

.fotorama__nav__shaft {
	height: auto;
}
.fotorama__nav--thumbs.fotorama__nav {
	height: auto !important;
}
.fotorama__nav__frame {
	float: left;
}
.fotorama__thumb__arr {
	display: none !important;
}

Re: Photorama: display thumbnails in multiple rows instead of sliding thorugh them

This does in fact show the images without the scrollers, but the frame doesn't move to the images displayed in the second row. So it's just a partial fix.