Thumbnail link directly to image - No Popup Please

[Clone42]

Hi everyone.
I've been trying to figure out this problem for a while. I've searched the forum thoroughly, and although threads exist on this topic, most are ancient and ignored.

Is there any way to have the Larger Image thumbnail on a product page link directly to the image file URL?

I want nothing to do with java pop-up windows, lightboxes, slimboxes, opening new browser windows, browser-resizes, or anything of the sort. As a user I always find these novelties annoying, as they interfere with tabbed browsing and slow me down.

Right now the image link spontaneously resizes my firefox window, which is very irritating. I'd really like just a vanilla url link.

[niccol]

You need to edit tpl_modules_main_product_image.php in your template. (Or if it doesn't exist yet create it as an override) The file looks like this:

<?php
/**
 * Module Template
 *
 * @package templateSystem
 * @copyright Copyright 2003-2005 Zen Cart Development Team
 * @copyright Portions Copyright 2003 osCommerce
 * @license http://www.zen-cart.com/license/2_0.txt GNU Public License V2.0
 * @version $Id: tpl_modules_main_product_image.php 3208 2006-03-19 16:48:57Z birdbrain $
 */
?>
<?php require(DIR_WS_MODULES . zen_get_module_directory(FILENAME_MAIN_PRODUCT_IMAGE)); ?> 
<div id="productMainImage" class="centeredContent back">
<script language="javascript" type="text/javascript"><!--
document.write('<?php echo '<a href="javascript:popupWindow(\\\'' . zen_href_link(FILENAME_POPUP_IMAGE, 'pID=' . $_GET['products_id']) . '\\\')">' . zen_image($products_image_medium, addslashes($products_name), MEDIUM_IMAGE_WIDTH, MEDIUM_IMAGE_HEIGHT) . '<br /><span class="imgLink">' . TEXT_CLICK_TO_ENLARGE . '</span></a>'; ?>');
//--></script>
<noscript>
<?php
  echo '<a href="' . zen_href_link(FILENAME_POPUP_IMAGE, 'pID=' . $_GET['products_id']) . '" target="_blank">' . zen_image($products_image_medium, $products_name, MEDIUM_IMAGE_WIDTH, MEDIUM_IMAGE_HEIGHT) . '<br /><span class="imgLink">' . TEXT_CLICK_TO_ENLARGE . '</span></a>';
?>
</noscript>
</div>

Make it like this:

<?php
/**
 * Module Template
 *
 * @package templateSystem
 * @copyright Copyright 2003-2005 Zen Cart Development Team
 * @copyright Portions Copyright 2003 osCommerce
 * @license http://www.zen-cart.com/license/2_0.txt GNU Public License V2.0
 * @version $Id: tpl_modules_main_product_image.php 3208 2006-03-19 16:48:57Z birdbrain $
 */
?>
<?php require(DIR_WS_MODULES . zen_get_module_directory(FILENAME_MAIN_PRODUCT_IMAGE)); ?> 
<div id="productMainImage" class="centeredContent back">
<?php echo '<a href="'.$products_image_large.'">' . zen_image($products_image_medium, addslashes($products_name), MEDIUM_IMAGE_WIDTH, MEDIUM_IMAGE_HEIGHT) . '<br /><span class="imgLink">' . TEXT_CLICK_TO_ENLARGE . '</span></a>'; ?
</div>

I think that should work but I am doing this of the top of my head so make sure you have backed up

[Clone42]

Thanks for the help.

Although your code didn't work out of the box copied & pasted, I did get it working.

Unfortunately the image file the URL directs to doesn't exist, if I were to guess I'd say it's due to me using image handler.

Hmm... Now I'm not sure how I can do this.

Any thoughts?

<?php
/**
 * Module Template
 *
 * @package templateSystem
 * @copyright Copyright 2003-2005 Zen Cart Development Team
 * @copyright Portions Copyright 2003 osCommerce
 * @license http://www.zen-cart.com/license/2_0.txt GNU Public License V2.0
 * @version $Id: tpl_modules_main_product_image.php 3208 2006-03-19 16:48:57Z birdbrain $
 */
?>
<?php require(DIR_WS_MODULES . zen_get_module_directory(FILENAME_MAIN_PRODUCT_IMAGE)); ?> 
<div id="productMainImage" class="centeredContent back">

<?php
  echo '<a href="' . $products_image_large . '">' . zen_image($products_image_medium, $products_name, MEDIUM_IMAGE_WIDTH, MEDIUM_IMAGE_HEIGHT) . '<br /><span class="imgLink">' . TEXT_CLICK_TO_ENLARGE . '</span></a>';
?>
</div>

[nigelt74]

What image file URL is it redirecting to?

Thanks for the help.

Although your code didn't work out of the box copied & pasted, I did get it working.

Unfortunately the image file the URL directs to doesn't exist, if I were to guess I'd say it's due to me using image handler.

Hmm... Now I'm not sure how I can do this.

Any thoughts?

<?php
/**
 * Module Template
 *
 * @package templateSystem
 * @copyright Copyright 2003-2005 Zen Cart Development Team
 * @copyright Portions Copyright 2003 osCommerce
 * @license http://www.zen-cart.com/license/2_0.txt GNU Public License V2.0
 * @version $Id: tpl_modules_main_product_image.php 3208 2006-03-19 16:48:57Z birdbrain $
 */
?>
<?php require(DIR_WS_MODULES . zen_get_module_directory(FILENAME_MAIN_PRODUCT_IMAGE)); ?> 
<div id="productMainImage" class="centeredContent back">

<?php
  echo '<a href="' . $products_image_large . '">' . zen_image($products_image_medium, $products_name, MEDIUM_IMAGE_WIDTH, MEDIUM_IMAGE_HEIGHT) . '<br /><span class="imgLink">' . TEXT_CLICK_TO_ENLARGE . '</span></a>';
?>
</div>

[niccol]

Yes, if you are using image handler it is slightly different. Basically, image handler uses a different version of the module that is called at the top of that code : main_product_image.php. So the variable $products_image_large probably doesn't work for you.

Actually, looking at the code, you could try just changing where it says '$products_image_large' to '$products_image'. Try that and if it doesn't work I'll show you the 'proper' fix.