How to edit Fotorama Gallery ?

[aleathorn]

Overwrite `vendor\magento\theme-frontend-luma\etc\view.xml`

I have the following, for example: `app\design\frontend\[CustomTheme]\default\etc\view.xml`

<view xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Config/etc/view.xsd">
    <media>
        <images module="Magento_Catalog">
            <image id="product_page_image_large" type="image"/>
            <image id="product_page_image_medium" type="image">
                <width>700</width>
                <height>420</height>
            </image>

            <image id="product_page_main_image" type="image">
                <width>700</width>
                <height>420</height>
            </image>

            <image id="product_page_main_image_default" type="image">
                <width>700</width>
                <height>420</height>
            </image>
        </images>
    </media>
</view>

 This will cause the `fotorama__stage` to be smaller - it adjusts based on the image size.

[Gabriel Guarino]

Hi @aleathorn,

Are you trying to override a layout XML definition?

[aleathorn]

My post was a reply to another. I'm not sure why it appears to be its own question. But yes, I am explaining how to override XML to adjust product image sizes.

[aleathorn]

I was trying to reply here (same subject)

https://community.magento.com/t5/Programming-Questions/How-to-edit-Fotorama-Gallery/td-p/35860

[richardmlaws]

Hi, do you have do anything more than flush the cache? I've changed my view.xml and the images have changed but the outer div hasn't (fotorama__stage__shaft)

Thanks

[richardmlaws]

In answer to my own question I resized '.page-layout-1column .product.media' in styles-l.less