Every developer who feels lack of knowledge in Magento design fallback system is suggested to dive deep into the topic to pass the Magento exam. The questions described in the article include the fallback mechanism, ways to display templates and the number of fallback steps available. Enjoy the reading!
Magento2 uses Fotorama Plugin on a Product Page to display preview of product images. In order to change Fotorama options we should use view.xml file from app/design/frontend/Vendor/ Theme/etc. Let’s take a look at Fotorama options that are available in Magento2:
As we can see there is a variable, called “navdir”, and it has ability to change the thumbnails alignment in Fotorama:
<var name=”navdir”> horizontal</var>. So here horizontal/vertical values are available and by default it’s horizontal.
Also there is available breakpoints variable, where you can define conditions for “mobile” and define a breakpoint. In order to change thumbnails alignment on mobile version, switch it to vertical or horizontal, just by placing “navdir” variable value inside of the options:
So there is an example how it may look like. We’ve changed thumbnail alignment to vertical on a desktop and to horizontal on a mobile version: