Retweet
One of the most frequent requests we get for Magento sites is to tame what the thumbnails do on the product page. Of course there are plenty of plugins for adding a lightbox of some sort, but if you simply want to swap out the image in the zoomer window for one of the thumbnails, here’s what you’ll need to do:

  • Open app/design/frontend/yourpackage/yourtheme/template/catalog/product/view/media.phtml
  • Go down to line 71 and change: 
    <li>
<a href="#" onclick="popWin('<?php echo $this->getGalleryUrl($_image) ?>', 'gallery', 'width=300,height=300,left=50,top=50,location=no,status=yes,scrollbars=yes,resizable=yes'); return false;">
<img src="<?php echo $this->helper('catalog/image')->init($this->getProduct(), 'thumbnail', $_image->getFile())->resize(56); ?>" alt="<?php echo $this->htmlEscape($_image->getLabel()) ?>" title="<?php echo $this->htmlEscape($_image->getLabel()) ?>" />
</a>
</li>

    to

    <li>
<a href="<?php echo $this->helper('catalog/image')->init($this->getProduct(), 'image', $_image->getFile()); ?>" title="<?php echo $_product->getName();?>" onclick="$('image').src = this.href; return false;">
<img src="<?php echo $this->helper('catalog/image')->init($this->getProduct(), 'thumbnail', $_image->getFile())->resize(70, 70); ?>" alt="<?php echo $this->htmlEscape($_image->getLabel()) ?>" title="<?php echo $this->htmlEscape($_image->getLabel()) ?>"/>
</a>
</li>

And that’s it! Your product image should now swap out for whichever thumbnail you click.

Credit to Scott from http://www.magentocommerce.com/boards/viewthread/6402/#t61131

Ben
Creative Lead
MS Internet