Как изменить размеры изображений товара по умолчанию на Magento 2?

В magento 1.xx мы могли бы изменять стандартные изображения по умолчанию в админке:

Система> Конфигурация> Каталог

Но в 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 использует файл view.xml для измерения размера изображения в каталоге vendor / magento / theme-frontend-luma / etc / 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/