How to enlarge the product images on the category page

Hi!
I’d like to be able to enlarge the product images while on the category page. Now when you click on an image on the category page you get directed to the products page and then you can enlarge the image.
It would be great to get a close up view of the product without having to go into the products page.
So on the category page you click on the image of each product and get a close up view. If you like the look of the product you can click on the text link below and then you’ll be directed to the products page.

Does anyone know how this can be done?
Highly appreciate your help!
Kind regards,
Jungfrun

1 answer

Profile photo of Saguaros 0.00 $tone January 18, 2012
Public

Dear,
You could do that.
Assume that I’m using JM Product Slider module, and I wanna click image in frontpage, it popup a close up view.
I go to dir: template\joomlart\jmproductsslider\list.phtml and find line contains:

Code:

<a class="slider-image" title="<?php echo $this->htmlEscape($_product->getName()) ?>"

Remove this:

Code:

href="<?php echo $_product->getProductUrl() ?>"

Add some code into this line and it’ll be:

Code:

<a class="slider-image" title="<?php echo $this->htmlEscape($_product->getName()) ?>" rel="ja-colorbox"	 href="<?php echo $this->helper('catalog/image')->init($_product, 'image').$_helper->productAttribute($_product, $_img, 'image')?>">

Also, put this:

Code:

<script type="text/javascript">
			jQuery(document).ready(function($){
				$("a[rel='ja-colorbox']").colorbox({});
			});
</script>

in this list.phtml file.
Hope this helps.

#1

Please login or Register to Submit Answer

Written By

Comments