In my custom block, I get Product Collection use \Magento\Catalog\Model\ResourceModel\Product\CollectionFactory, when I output one product in it, the image, thumbnail, small_image are the same url like below, a large image(1380px x 1340px) url:

[image] => /m/b/mb04-black-0.jpg
[small_image] => /m/b/mb04-black-0.jpg
[thumbnail] => /m/b/mb04-black-0.jpg

Did I do something wrong? How do I get the real small_image or thumbnail URL from product collection?

More question description

For example, in the default luma theme category, product list always get the image like below:

<img class="product-image-photo" src="http://local.com/pub/media/catalog/product/cache/small_image/240x300/beff4985b56e3afdbeabfc89641a4582/w/t/wt09-white_main.jpg" width="240" height="300" alt="Breathe-Easy Tank">

How can I get that?

My code example

Below is my code, I remove some function for simplicity.

namespace Vendor\Template\Block;

use Magento\Framework\View\Element\Template;
use Magento\Backend\Block\Template\Context;
use Magento\Catalog\Model\ResourceModel\Product\CollectionFactory;

class Product extends Template
    protected $_productCollectionFactory;

    public function __construct(
        Context $context,
        CollectionFactory $productCollectionFactory,
        array $data = []
        $this->_productCollectionFactory = $productCollectionFactory;
        parent::__construct($context, $data);

    public function getProductCollection()
        $skus = $this->getData('products_count');
        $collection = $this->_productCollectionFactory->create();
                'sku', array('in' => $skus)
        return $collection;
  • can you provide your code that you have used. – Suman-PHP4U Sep 7 '17 at 9:22
  • @Suman-PHP4U Hi, add the code now. Thank you for any help. – Key Shang Sep 7 '17 at 9:40

Then you should use `\Magento\Catalog\Helper\Image ' resize the product image

$resizedImage = $this->_productImageHelper->init($product, 'product_small_image')
                                           ->resize(200, 300);

Magento 2 resize category & product image


|improve this answer|||||
  • Thanks first, you maybe mistake my question, I can show the image, but my problem is when get image, thumbnail, small_image, they are all the same, I always get a big image, so my question is how can I get the small image? The real small_image or thumbnail URL – Key Shang Sep 7 '17 at 9:47
  • Mean you want resize image – Amit Bera Sep 7 '17 at 9:56
  • For example, in the default luma theme category, product list always get the image like /pub/media/catalog/product/cache/small_image/240x300/beff4985b56e3afdbeabfc89641a4582/w/t/wt09-white_main.jpg, how can i get that? – Key Shang Sep 7 '17 at 10:00
  • Please check update answer – Amit Bera Sep 7 '17 at 10:08
  • Up vote, the resize is a solution, but can we directly get the small image that category page generated? Instead of generating some new size version images. – Key Shang Sep 7 '17 at 10:18

Get product image from Product in PHTML file for Magento 2

$_objectManager = \Magento\Framework\App\ObjectManager::getInstance();
$imageHelper  = $_objectManager->get('\Magento\Catalog\Helper\Image');

<?php $thumbnail_image_url = $imageHelper->init($product, 'product_thumbnail_image')->setImageFile($product->getFile())->resize($imagewidth, $imageheight)->getUrl(); ?>

<?php $small_image_url = $imageHelper->init($product, 'product_small_image')->setImageFile($product->getFile())->resize($imagewidth, $imageheight)->getUrl(); ?>

<?php $base_image_url = $imageHelper->init($product, 'product_base_image')->setImageFile($product->getFile())->resize($imagewidth, $imageheight)->getUrl(); ?>
|improve this answer|||||

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.