如何在Magento 2上更改默认产品图像尺寸？

在magento 1.xx中，我们可以在admin中更改默认缩略图：

系统>配置>目录

但是在magento 2.0中，如何更改这些值？我似乎找不到任何配置来允许此操作？问题是我的产品图像显示有大的白色条纹，我想避免这种情况。

Magento使用名为的文件view.xml，该文件在应用程序的主题级别维护。

因此，例如，如果您使用的是默认主题luma，则应view.xml在vendor/magento/theme-frontend-luma/etc/view.xml

在此文件中，您将看到<images/>节点内部的<media>节点。

<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="bundled_product_customization_page" type="thumbnail">
                <width>140</width>
                <height>140</height>
            </image>
            <image id="cart_cross_sell_products" type="thumbnail">
                <width>200</width>
                <height>248</height>
            </image>
            <image id="cart_page_product_thumbnail" type="small_image">
                <width>165</width>
                <height>165</height>
            </image>
            ........
        </images>
    </media>
    ......
</view>

图像的尺寸在此处保持在<image/>节点下。

节点的id属性值<image/>在代码库中引用。

例如：

<image id="related_products_list" type="small_image">
    <width>152</width>
    <height>190</height>
</image>

id值用于视图文件中 vendor/magento/module-catalog/view/frontend/templates/product/list/items.phtml

case 'related':
    /** @var \Magento\Catalog\Block\Product\ProductList\Related $block */
    if ($exist = $block->getItems()->getSize()) {
        $type = 'related';
        $class = $type;

        $image = 'related_products_list';
        $title = __('Related Products');
        $items = $block->getItems();
        $limit = 0;
        $shuffle = 0;
        $canItemsAddToCart = $block->canItemsAddToCart();

        $showWishlist = true;
        $showCompare = true;
        $showCart = false;
        $templateType = null;
        $description = false;
    }
break;

这里的$image指的是此处图像尺寸的值：

<?php echo $block->getImage($_item, $image)->toHtml(); ?>

如果主题没有view.xml，则可能使用了具有view.xml文件的后备主题（父主题）。

<theme xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Config/etc/theme.xsd">
    <title>Magento Luma</title>
    <parent>Magento/blank</parent>
    .....
</theme>

这Magento/blank是父主题。

如果更改/覆盖view.xml文件的值，则需要将整个view.xml文件完全复制到自定义主题并更改值。

view.xml没有节点值回退系统，这意味着如果自定义主题中不存在节点的值，view.xml 则不会回退到其父主题的view.xml值，这就是为什么需要复制整个文件的原因。

值更改完成后，您将必须运行

php bin/magento catalog:images:resize

这将重新生成新的图像尺寸。

• Magento 2前端架构
• 创建自定义主题

Magento产品在路径vendor / magento / theme-frontend-luma / etc / view.xml中将view.xml文件用于图像尺寸标注

在这里，您将找到节点内的节点。

复制文件view.xml并将其放在主题路径中并进行更改，例如app / design / frontend / MyThemePackage / MyTheme / 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="category_page_list" type="small_image">
             <width>270</width>
             <height>450</height>
        </image>
        ........
    </images>
</media>
......
</view>

清除缓存并加载类别列表页面。您的更改将得到反映。

您还可以像这样直接在模板文件中指定图像尺寸：

<?php
/**
* @var $block \Magento\Catalog\Block\Product\Widget\NewWidget
*/
$image = 'new_products_content_widget_grid';
$items = $block->getProductCollection()->getItems();
$width = 100;
$height = 100;
foreach ($items as $_item) {
    $resizedUrl = $block->resizeImage($_item, $image , $width, $height)->getUrl();
    echo '<img src="'.$resizedUrl .'" alt="alt text" />';
}

此处有更多示例-https: //nwdthemes.com/2017/12/19/magento-2-product-image-size/