在 Magento 2 的产品视图页面上单击产品图像时如何调整 fotoroma 库弹出窗口的大小？答案

【问题标题】：How to Resize fotoroma library popup when clicking on product image on product view page in Magento 2?在 Magento 2 的产品视图页面上单击产品图像时如何调整 fotoroma 库弹出窗口的大小？
【发布时间】：2022-01-18 17:46:08
【问题描述】：

我想设置自定义全屏图像弹出/灯箱的高度和宽度。 怎么做....请帮忙。

【问题讨论】：

标签： javascript magento magento2 fotorama magento2.4

【解决方案1】：

您必须编辑以下文件：

app/design/vendor/Magento_Catalog/templates/product/view/gallery.phtml

您可以在此处添加您的选项：

<script type="text/x-magento-init">
{
    "[data-gallery-role=gallery-placeholder]": {
        "mage/gallery/gallery": {
            "mixins":["magnifier/magnify"],
            "magnifierOpts": <?php /* @escapeNotVerified */ echo $block->getMagnifier(); ?>,
            "data": <?php /* @escapeNotVerified */ echo $block->getGalleryImagesJson(); ?>,
            "options": {
                "maxheight": "700", // Add your value here
           }
        }
    }
}

【讨论】：

这将仅更改产品图片库部分的图像高度。不适用于全屏视图。

【解决方案2】：

检查

app/design/frontend/{package}/{theme}/template/catalog/product/view/media.phtml.

如果您的主题与默认主题有某种相似之处，您应该会发现如下内容：

<a href="#" onclick="popWin('<?php echo $this->getGalleryUrl($_image) ?>', 'gallery', 'width=300,height=300,left=0,top=0,location=no,status=yes,scrollbars=yes,resizable=yes'); return false;"title="<?php echo $this->htmlEscape($_image->getLabel()) ?>">
<img
   src="<?php echo $this->helper('catalog/image')->init($this->getProduct(), 'thumbnail', $_image->getFile())->resize(56); ?>"
   width="56"
   height="56"
   alt="<?php echo $this->htmlEscape($_image->getLabel()) ?>"
   />
</a>;

【讨论】：