0

I'm trying to set the height and width of the gallery thumbnails based on whether or not a CSS class is present on the body.

My current implementation looks like this:

require(['jquery', 'mage/gallery/gallery'], function($, gallery)
{
    if ($("body").hasClass("puma")) 
    {
        $('[data-gallery-role=gallery-placeholder]').on('gallery:loaded', function () 
        {
            jQuery('[data-gallery-role=gallery-placeholder').data('gallery').fotorama.setOptions({thumbheight: 88, thumbwidth: 110});
        });
    }
});

Running just the line jQuery('[data-gallery-role=gallery-placeholder').data('gallery').fotorama.setOptions({thumbheight: 88, thumbwidth: 110}); after the page has loaded does size the thumbnails correctly, but as soon as the fullscreen is opened or any other action happens with the gallery, it is reset to the size specified in view.xml.

Is there a way to override the Magento sizes as well?

Edit: I found the updateOptions API method but that doesn't do anything besides resetting the gallery, like how opening and closing fullscreen does...

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.