0

I've this code on template/default/catalog/product/view/media.phtml page. I want to retrieve full size gallery images to display here in li's under ul's. The problem is that with this code, i'm getting thumbnail size media images.

<?php
    $_product = $this->getProduct();
    $_helper = $this->helper('catalog/output');
    $imgSize = 286;
?>
<ul class="rr images">
<?php $j=1; ?>
<?php foreach ($_images as $_image): ?> 
    <li class="<?php if ($j==1) echo "current"; echo ""; ?> gal-<?php echo $j?>">
      <img src="<?php echo $this->helper('catalog/image')->init($this->getProduct(), 'image', $_image->getFile())->constrainOnly(TRUE)->keepAspectRatio(TRUE)->keepFrame(FALSE)->resize($imgSize, NULL); ?>" alt="<?php echo $this->htmlEscape($_image->getLabel()) ?>"/>
    </li>
    <?php $j++; ?>
<?php endforeach; ?>
</ul>

This is what i'm getting now:

This is what i'm getting now

This is what i want to get:

This is what i want to get

Please note that the problem is not with the size of the image (thumbnail image is of good size), but the dimensions of it(thumbnail image is cropped).

1
<?php
  $_product = $this->getProduct();
  $_helper = $this->helper('catalog/output');
  $imgSize = 286;
?>
<ul class="rr images">
 <?php $j=1; ?>
  <?php foreach ($_images as $_image): ?> 
   <li class="<?php if ($j==1) echo "current"; echo ""; ?> gal-<?php echo $j?>">
    <img src="<?php echo $this->helper('catalog/image')->init($this->getProduct(), 'small_image', $_image->getFile())->constrainOnly(TRUE)->keepAspectRatio(TRUE)->keepFrame(FALSE)->resize($imgSize, NULL); ?>" alt="<?php echo $this->htmlEscape($_image->getLabel()) ?>"/>
</li>
<?php $j++; ?>

you can gve three options for the image, small_image,thumbnail based on you want.

4
  • 'image, small_image,thumbnail' none of these are giving me full size image, as shown in second image of question. $_img = '<img id="image" class="img-responsive" src="'.$this->helper('catalog/image')->init($_product, 'image')->constrainOnly(TRUE)->keepAspectRatio(TRUE)->keepFrame(FALSE)->resize($imgSize, null).'" alt="'.$this->htmlEscape($this->getImageLabel()).'" title="'.$this->htmlEscape($this->getImageLabel()).'" />'; echo $_helper->productAttribute($_product, $_img, 'image'); this gives full size image, but I'm unable to loop through all images to show them under li's – anwartheravian Jan 3 '14 at 8:49
  • hey just you have to change the echo $_helper->productAttribute($_product, $_img, 'small_image') try this – Keyul Shah Jan 3 '14 at 8:52
  • Nops... still not working. I guess the reason is that we can't iterate multiple image this way, considering the foreach loop we are using <?php foreach ($_images as $_image): ?> – anwartheravian Jan 3 '14 at 9:34
  • may be but refer the template/catalog/product/view/media.phtml file you got the proper idea how magento display image on detail page. – Keyul Shah Jan 3 '14 at 9:37

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.