Magento – Magento 2 Get Media Gallery in productlist

gallerymagento2mediaproduct-images

In Magento 1 I've always used

$_product->getMediaGallery('images')

But in the source from Magento 2 I see

$productImage = $block->getImage($_product, $image);
echo $productImage->toHtml();

It's only getting the first product image. How do I get the second or third image (not only the base one)?

GetMediaGallery function doesn't exists?

$_product->getMediaGalleryImages() throws NULL in a var_dump

and

for getMediaGallery and getMediaGalleryEntries I get the same notice error:

Undefined property: Magento\Catalog\Model\Product\Interceptor::$getMediaGallery

Best Answer

create helper for example :

<?php
/**
 * Copyright © 2015 Magento. All rights reserved.
 * See COPYING.txt for license details.
 */
namespace Ibnab\Common\Helper;
use Magento\Catalog\Model\Product\Gallery\ReadHandler as GalleryReadHandler;
class Data extends \Magento\Framework\App\Helper\AbstractHelper {
  protected $galleryReadHandler;
    /**
     * Catalog Image Helper
     *
     * @var \Magento\Catalog\Helper\Image
     */
    protected $imageHelper;
    public function __construct(
    GalleryReadHandler $galleryReadHandler,  \Magento\Framework\App\Helper\Context $context,\Magento\Catalog\Helper\Image $imageHelper)
    {
        $this->imageHelper = $imageHelper;
        $this->galleryReadHandler = $galleryReadHandler;
        parent::__construct($context);
    }
   /** Add image gallery to $product */
    public function addGallery($product) {
        $this->galleryReadHandler->execute($product);
    }
    public function getGalleryImages(\Magento\Catalog\Api\Data\ProductInterface $product)
    {
        $images = $product->getMediaGalleryImages();
        if ($images instanceof \Magento\Framework\Data\Collection) {
            foreach ($images as $image) {
                /** @var $image \Magento\Catalog\Model\Product\Image */
                $image->setData(
                    'small_image_url',
                    $this->imageHelper->init($product, 'product_page_image_small')
                        ->setImageFile($image->getFile())
                        ->getUrl()
                );
                $image->setData(
                    'medium_image_url',
                    $this->imageHelper->init($product, 'product_page_image_medium')
                        ->constrainOnly(true)->keepAspectRatio(true)->keepFrame(false)
                        ->setImageFile($image->getFile())
                        ->getUrl()
                );
                $image->setData(
                    'large_image_url',
                    $this->imageHelper->init($product, 'product_page_image_large')
                        ->constrainOnly(true)->keepAspectRatio(true)->keepFrame(false)
                        ->setImageFile($image->getFile())
                        ->getUrl()
                );
            }
        }
        return $images;
    }
}

call and use inside your list.phtml : $_helperGallery = $this->helper('Ibnab\Common\Helper\Data'); now you can use with current called product inside for each (with you technique):

  <a href="<?php echo $_product->getProductUrl() ?>">
                            <ul class="product-item-wrapper">
                                <?php
                                $_helperGallery->addGallery($_product);
                                $images = $_helperGallery->getGalleryImages($_product);
                                if ($images instanceof \Magento\Framework\Data\Collection) {
                                    $i = 1;
                                    foreach ($images as $image) {
                                        $item = $image->getData();
                                        if (isset($item['media_type']) && $item['media_type'] == 'image'):
                                            ?>
                                            <?php if ($i == 1): ?>
                                                <li class="selected">
                                                <?php else: ?>
                                                <li >
                                                <?php endif; ?>
                                                <img src="<?php echo isset($item['medium_image_url']) ? $item['medium_image_url'] : null; ?>" alt="Preview image">
                                            </li>
                                            <?php
                                            $i++;
                                        endif;
                                    }
                                }
                                ?>
                            </ul>
                        </a>

the complete source of course

Related Solutions

Magento – Fixing Duplicate Images Issue in Media Gallery

Most likely its because you are saving the product after every addImagetoMediaGallery moving it out of the loop of both images should suffice.

Untested but like this perhaps?

foreach ($skuImageMap as $sku => $images) {
    $ourProduct = Mage::getModel('catalog/product')->loadByAttribute('sku', $sku);
    $saveFlag = true;
    if ($ourProduct) {
        foreach ($images as $index => $imagePath) {
            if (file_exists($imagePath)) {
                try {
                    $ourProduct->addImageToMediaGallery($imagePath, null, false, false);
                    $imageCount++;
                } catch (Exception $e) {
                    $saveFlag = false;
                    echo "There was an issue saving image $imagePath to $sku :" . $e->getMessage() . "\n";
                }
            } else {
                $saveFlag = false;
                echo "The image $imagePath does not exist.\n";
            }
        }

        if($saveFlag) {
            try {
                $ourProduct->save();
                echo "The image $imagePath was added to $sku successfully : $imageCount \n";
            } catch (Exception $e) {
                zend_debug::dump($e->getMessage());
            }
        }

    } else {
        echo "The product $sku does not exist \n";
    }
}

Magento – Magento 2 Get all product images in on product list page

Category loading has changed in 2.1, so this may only be relevant from 2.1 onwards:

The image gallery is added to the product via an extension interface defined via di.xml. The upshot is that we can manually create an instance of the gallery ReadHandler class and pass a product to load all its gallery images.

As usual in Magento 2 the best way to instantiate a class is via the __construct() method, so here is a stub block class:

use Magento\Catalog\Model\Product\Gallery\ReadHandler as GalleryReadHandler;

class Gallery
{
    protected $galleryReadHandler;

    public function __construct(
        GalleryReadHandler $galleryReadHandler
    )
    {
        $this->galleryReadHandler = $galleryReadHandler;
    }

    /** Add image gallery to $product */
    public function addGallery($product)
    {
        $this->galleryReadHandler->execute($product);
    }
}

In your template, assuming you have $product loaded via a product collection, you would be able to call:

$block->addGallery($product);
$images = $product->getMediaGalleryImages();
foreach ($images as $image) {
    ...
}

Best Answer

Related Solutions

Magento – Fixing Duplicate Images Issue in Media Gallery

Magento – Magento 2 Get all product images in on product list page

Related Topic