3

I have created a widget. I am trying to show product image in widget. I have successfully got product name, product url and image url using object manager. But the Image is not loaded (404 - not found).

public function getCollection()
{
    $objectManager = \Magento\Framework\App\ObjectManager::getInstance();
    $productCollection = $objectManager->create('Magento\Catalog\Model\ResourceModel\Product\CollectionFactory');
    $collection = $productCollection->create()->setPageSize(1)
        ->addAttributeToSelect('*')
        ->load();

    return $collection;
}

public function getPImage()
{
 $col=$this->getCollection();
 foreach ($col as $product)
 {
    echo $product->getImage();
 }  
}

getPImage() method returns string "/m/b/mb01-blue-0.jpg"

I use this string in img src

<img style="height:100%;width:100%;" src="<?php echo $this->getViewFileUrl('images/m/b/mb01-blue-0.jpg'); ?>" />

or without images prefix

<img style="height:100%;width:100%;" src="<?php echo $this->getViewFileUrl('/m/b/mb01-blue-0.jpg'); ?>" />

Yet the image not found, broken image URL path. LumaChange is my custom theme.

http://magentodev.gworks.mobi/magento2/pub/static/frontend/LumaChange/Color/en_US/m/b/mb01-blue-0.jpg

when I found specific product by search store, image url look like below(valid)

http://magentodev.gworks.mobi/magento2/pub/media/catalog/product/cache/1/small_image/240x300/beff4985b56e3afdbeabfc89641a4582/m/b/mb01-blue-0.jpg

Page widget div tag looks like below

easy for your reference

Any suggestion to overcome this issue?

1 Answer 1

1

try:

define image size in app\design\frontend\MyPackage\mytheme\etc\view.xml as

<image id="my_widget_image_size" type="small_image">
    <width>240</width>
    <height>360</height>
</image>

then your function:

public function getPImage()
    {
     $col=$this->getCollection();
     $image = 'my_widget_image_size';
     foreach ($col as $product)
     {
        $productImage = $block->getImage($product, $image);
        echo $productImage ->toHtml();
     }  
    }

This will give you the entire image HTML. So don't put this inside img src.

Update: Get image url:

If above method did not work for you try this one.

public function getPImage()
        {
         $col=$this->getCollection();
         $image = 'my_widget_image_size';
         foreach ($col as $product)
         {
            $productImage = $block->getImage($product, $image);
            $_imagehelper = $this->helper('Magento\Catalog\Helper\Image');
            $productImage = $_imagehelper->init($product, $image)->constrainOnly(FALSE)->keepAspectRatio(TRUE)->keepFrame(FALSE)->resize(400)->getUrl();
            echo $productImage;
         }  
        }
6
  • Thank you for the reply. I am working with your answer. after while come back to you Mar 24, 2016 at 7:43
  • I try this, not work. it shows unrelevant error in page "We're sorry, an error has occurred while generating this email." . here $block refers what php class? Mar 24, 2016 at 9:12
  • \Magento\Catalog\Block\Product\AbstractProduct Mar 24, 2016 at 9:23
  • I use this " **\Magento\Catalog\Block\Product\AbstractProduct::getImage($product, $image); ** " instead of " ** $block->getImage($product, $image); ** " but still I get same error. Where could you refer this, please share the link if you have Mar 24, 2016 at 9:48
  • I have updated my answer. Please check. Mar 25, 2016 at 9:32

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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