Fotorama Navigation

[msecomm]

Is there a way to limit the number of thumbnails on the fotorama navigation? I want to either limit the number of thumbnails to lets say 5 and then if there are more photos, they can be accessed through the navigation arrows. Or another way could be to limit the height (I'm using a vertical navigation) of the navigation. I've tried several methods to limit the height, however, I was not able to find a solution to limit the height of the navigation without changing the height of the gallery.

Any solutions would be greatly appreciated!

Thank you!

[theMageComp]

Hello @msecomm 

You can use the nav option to specify the number of thumbnails you want to display. For example, to display 5 thumbnails, you would use the following code:

$('.fotorama').fotorama({
  nav: 'thumbs',
  navCount: 5
});

You can also use the navWidth option to specify the width of the navigation bar. For example, to set the width of the navigation bar to 200px, you would use the following code:

$('.fotorama').fotorama({
  nav: 'thumbs',
  navWidth: 200
});

If you want to limit the height of the navigation bar, you can use the navHeight option. For example, to set the height of the navigation bar to 100px, you would use the following code:

$('.fotorama').fotorama({
  nav: 'thumbs',
  navHeight: 100
});

Note that if you use the navWidth or navHeight options, the height or width of the navigation bar will be fixed, and the thumbnails will be resized to fit. If you want to keep the thumbnails at their original size, you can use the navFit option to set the navFit option to contain. For example, to keep the thumbnails at their original size and fit them within a 200px wide navigation bar, you would use the following code:

$('.fotorama').fotorama({
  nav: 'thumbs',
  navWidth: 200,
  navFit: 'contain'
});

[msecomm]

Hello theMageComp,

Thank you for your reply. At the moment, I'm controlling the settings of fotorama through the following files:

view.xml

lib/web/fotorama/fotorama.js (copied into my custom theme)

gallery.phtml

Where can I apply your suggestions?

Thank you

[kifaf859790be2]

How can I restrict the number of thumbnails in the fotorama navigation? I'd like to limit it to 5 thumbnails and provide navigation arrows for accessing additional photos. Alternatively, I'm considering limiting the height of the vertical navigation without affecting the gallery's height. I've tried various methods, but haven't found a solution yet. Any help would be appreciated. Thank you!