Question is for Magento ver. 2.4.3 with custom Theme.
I try to do two things with the fotorama gallery:
- Set the nav to thumbs and navdir to horizontal (“max-width”:”1024px”)
- The same as (1.) and set the thumbwidth / thumbheight to 60px (“max-width”:”550px”)
Unfortunately if I use the view.xml for the breakpoints there are always some errors / issues.
With multiple breakpoints, the thumbnail size and if the thumbsize is working the main image gets scaled to 0px(and other stuff).
A working solution seem to be to set the beakpoint in
…/frontend/templates/product/view/gallery.phtml
But it will not work with two breakpoints without some issues
I found this post: Fotorama gallery multiple breakpoints
But none of the workarounds/fixes work in my case.
I set the breakpoints in gallery.phtml like follows:
"breakpoints":{"mobile":{"conditions":{"max-width":"550px"},"options":{"options":{"nav":"thumbs","navdir":"horizontal","thumbwidth":60,"thumbheight":60}}},"tablet":{"conditions":{"min-width":"551px","max-width":"1024px"},"options":{"options": "nav":"thumbs","navdir":"horizontal"}}}}
Thanks for any advice.