1

guys so I'm just wondering how I can change the image that is used on my product listing page.

I imported my products with a CSV import and used the Media Gallery attribute to display external images.

The images are displaying fine however on my product listing page I'd like to be able to choose which image displays as my primary product image.

Any idea how this might be done?

For example if I have 5 external images on one product I'd like the primary image to be the first URL in the string to display.

So here is my code in list.phtml:

<img id="product-collection-image-<?php echo $_product->getId(); ?>" class="defaultImage" src="<?php if($aspect_ratio):?><?php echo $this->helper('catalog/image')->init($_product, 'small_image')->constrainOnly(FALSE)->keepAspectRatio(TRUE)->keepFrame(FALSE)->resize(250);?><?php else: ?><?php echo $this->helper('catalog/image')->init($_product, 'small_image')->resize($ratio_width,$ratio_height); ?><?php endif; ?>" alt="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image'), null, true) ?>"/>
                    <img class="hoverImage" src="<?php if($aspect_ratio):?><?php echo $this->helper('catalog/image')->init($_product, 'thumbnail')->constrainOnly(FALSE)->keepAspectRatio(TRUE)->keepFrame(FALSE)->resize(250);?><?php else: ?><?php echo $this->helper('catalog/image')->init($_product, 'thumbnail')->resize($ratio_width,$ratio_height); ?><?php endif; ?>" alt="<?php echo $this->stripTags($this->getImageLabel($_product, 'thumbnail'), null, true) ?>"/>

What should I amend to achieve this?

Thanks, Nick

1 Answer 1

2

enter image description here

In Product admin go to the Image Tab, then select the "Small Image" checkbox next to the image you want to display on your product listing page.

See app/design/frontend/base/default/template/catalog/product/list.phtml

<img src="<?php echo $this->helper('catalog/image')->init($_product, 'small_image')->resize(135); ?>
3
  • Hi, so I've selected the small image now I'm looking at list.phtml and my code is different. An example is in the original question :) Feb 15, 2015 at 22:09
  • Is it working? Your code is still pulling the 'small_image' so it should work the same. Feb 15, 2015 at 22:29
  • No that code was originally added, it just shows the 3rd URL in the Media Gallery string. Feb 15, 2015 at 22:59

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.