Bagaimana saya bisa mengubah ukuran gambar produk default di Magento 2?

Di magento 1.xx , kita dapat mengubah gambar mini standar di admin:

Sistem> Konfigurasi> Katalog

Tetapi di Magento 2.0 , bagaimana saya bisa mengubah nilai tesis ini Saya tidak bisa menemukan konfigurasi untuk memperbolehkan ini? Masalahnya adalah gambar produk saya ditampilkan dengan garis-garis putih besar dan saya ingin mencegahnya.

Magento menggunakan file yang disebut view.xmlyang dikelola di tingkat tema aplikasi.

Jadi misalnya, jika Anda menggunakan tema default lumaAnda harus menemukan di view.xmlbawahnyavendor/magento/theme-frontend-luma/etc/view.xml

Dalam file ini, Anda akan melihat <images/>simpul di dalam <media>simpul tersebut.

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

Dimensi gambar dipertahankan di sini di bawah <image/>simpul.

Nilai idatribut dari <image/>simpul dirujuk dalam basis kode.

Sebagai contoh:

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

Nilai id digunakan dalam file tampilan 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;

Di sini $imagemengacu pada nilai ukuran gambar di sini:

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

Jika tema tidak memiliki view.xml, maka mungkin menggunakan tema fallback (tema induk) yang memiliki view.xmlfile.

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

Inilah Magento/blanktema induknya.

Dalam hal mengubah / menimpa nilai-nilai view.xmlfile Anda perlu menyalin seluruh view.xmlfile ke tema kustom Anda dan mengubah nilai-nilai.

view.xmltidak memiliki sistem fallback nilai simpul, berarti jika nilai simpul tidak ada di tema Anda, view.xml itu tidak akan mundur ke nilai view.xml tema induknya, itu sebabnya seluruh file perlu disalin.

Setelah perubahan nilai telah dilakukan, Anda harus menjalankannya

php bin/magento catalog:images:resize

Ini akan membuat ulang ukuran gambar baru.

• Arsitektur frontend Magento 2
• Membuat Tema Khusus

Produk Magento menggunakan file view.xml untuk dimensi ukuran gambar di jalur vendor / magento / theme-frontend-luma / etc / view.xml

Di sini Anda akan menemukan simpul di dalam simpul.

Salin file view.xml dan letakkan di jalur tema Anda dan buat perubahan, katakan aplikasi / desain / antarmuka / 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>

Bersihkan cache dan muat halaman daftar kategori. Perubahan Anda akan tercermin.

Anda juga dapat menentukan dimensi gambar secara langsung dalam file template seperti ini:

<?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" />';
}

Lebih banyak sampel di sini - https://nwdthemes.com/2017/12/19/magento-2-product-image-size/