0

get thumbnail image in product collection magento 2.3 but base image get how to get thumbnail image

phtml file

          <?php 
            $ProductImageUrl = $block->getUrl('pub/media/catalog').'product'.$product->getImage();
        ?>
        <a class="productlinks" href="" title=""><img src="<?php echo $ProductImageUrl; ?>" width="210" height="210">
        </a>

Block File

protected $_productCollectionFactory;

public function __construct(
   \Magento\Catalog\Block\Product\Context $context, 
   \Magento\Catalog\Model\ResourceModel\Product\CollectionFactory $productCollectionFactory,
array $data = []
)
{    
       $this->_productCollectionFactory = $productCollectionFactory;    
       parent::__construct($context, $data);
}

public function getProductCollection()
{
    $porIds=array(1,2,3);
    $collection = $this->_productCollectionFactory->create();
    $collection->addAttributeToSelect('*');
    $collection->addFieldToFilter('entity_id', array('in' => $porIds));
     
    return $collection;
}
2
0

1.add below in phtml file, it is based on the \Magento\Catalog\Block\Product\ListProduct

$imageDisplayArea = 'your_custom_img_id';
$productImage = $block->getImage($product, $imageDisplayArea);
//$position = 'left:' . $productImage->getWidth() . 'px;'. 'top:' . $productImage->getHeight() . 'px;';

<a href="<?= $escaper->escapeUrl($product->getProductUrl()) ?>"
        class="product photo product-item-photo"
        tabindex="-1">
        <?= $productImage->toHtml() ?>
</a>
  1. Go to theme file app/design/frontname/Namespace/ThemeName/etc/view.xml

add any custom image id under <images module="Magento_Catalog"> something like below with type = thumbnail with own width and height:

<view ......>
    <media>
        <images module="Magento_Catalog">
            .......                
<image id="your_custom_img_id" type="thumbnail">
        <width>140</width>
        <height>140</height>
</image>
           
        

make sure <image id="your_custom_img_id" and $imageDisplayArea = 'your_custom_img_id'; both should have same value.

if changes are not reflected then you resize images using php bin/magento catalog:images:resize

0

Use Magento\Catalog\Helper\Image in your block to get the thumbnail image of product

public function getImageUrl($product) {
    $this->imageHelper->init($product, 'product_thumbnail_image')->getUrl();
}
0

phtml File

  <?php
  $ProductImageUrl = $block->getUrl('pub/media/catalog').'product'.$product->getData('thumbnail');
  ?>

 <a class="productlinks" href="#" title=""><img src="<?php echo $ProductImageUrl; ?>" width="210" height="210">
 </a>

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.