Як я можу змінити розміри зображень за замовчуванням на Magento 2?


25

У magento 1.xx ми можемо змінити мініатюрні зображення за замовчуванням у адміністратора:

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

Але в magento 2.0 , як я можу змінити значення тез, я, здається, не можу знайти жодних конфігурацій, щоб це дозволити? Проблема полягає в тому, що зображення моїх виробів відображаються великими білими смужками, і я хотів би запобігти цьому.

Відповіді:


39

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

Це відновить нові розміри зображення.


Спасибі. Я б ніколи не розумів, де це породжується. +1
Енді Джонс

5
Мені сподобається, як над цим сконструйовано, та ще немає документації. Вам доведеться зазирнути в код або розкопати схему db лише для того, щоб з'ясувати ці імена.
Мігель Феліпе Гіллен Кало

Дякую за відповідь, але я втомився і виявив, що запуск останньої установки php bin/magento catalog:images:resize не потребує (це коштує багато часу) , нам просто потрібно очистити кеш, і тоді він запрацює.
Ключ Шан

@KeyShang ви праві, розміри зображень створюються під час виконання, якщо вони вже відсутні. Однак рекомендується запустити цю команду, оскільки це допомагає в продуктивності на виробництві
Atish Goswami

6

Продукт Magento використовує файл view.xml для розмірів розмірів зображення у постачальника контуру / magento / theme-frontend-luma / тощо / view.xml

Тут ви знайдете вузол всередині вузла.

Скопіюйте файл view.xml та вставте його в шлях теми та внесіть зміни, скажімо, додаток / дизайн / frontend / MyThemePackage / MyTheme / тощо / 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>

Очистіть кеш і завантажте сторінку списку категорій. Ваші зміни будуть відображені.


Варто зауважити, що розширити шлях "vendor / magento / theme-frontend-luma / etc / view.xml" також може бути "vendor / magento / topic-frontend-blank / etc / view.xml" залежно від того, який пакет тем теми за замовчуванням ти використовуєш.
Диноміт

як змінити розмір ескізів на сторінці деталей продукту?
jafar pinjar

1

Ви також можете вказати параметри зображення безпосередньо у файлі шаблону, як це:

<?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/

Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.