How to integrate OSC Plus Highslide popup contribution

[Morgan^]

OSC Plus Highslide popup contribution: http://addons.oscommerce.com/info/5709

 

At this point the OSC Plus Highslide contribution makes the images on the product-listing page popup in a special way. Only it has no effect on the image of the product-info page.

Could anyone please help out to make the code available on how to make Highslide work with the image thumbnail on the product-info page? Thank you so much allready.

 

 

For the record: the code used for the intergration on the product-listing page is as follows:

 

For catalog/index.php find:

 

</head>

 

replace with:

 

	<script type="text/javascript" src="highslide/highslide.js"></script>
<script type="text/javascript" src="highslide/highslide-html.js"></script>
<script type="text/javascript">	
	hs.graphicsDir = 'highslide/graphics/';
	hs.outlineType = 'rounded-white';
	window.onload = function() {
		hs.preloadImages(5);
	}
</script>
</head>

 

 

And in catalog/includes/modules/product_listing.php find:

 

case 'PRODUCT_LIST_IMAGE':
		$lc_align = 'center';
		if (isset($HTTP_GET_VARS['manufacturers_id'])) {
		  $lc_text = '<a href="' . tep_href_link(FILENAME_PRODUCT_INFO, 'manufacturers_id=' . $HTTP_GET_VARS['manufacturers_id'] . '&products_id=' . $listing['products_id']) . '">' . tep_image(DIR_WS_IMAGES . $listing['products_image'], $listing['products_name'], SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT) . '</a>';
		} else {
		  $lc_text = ' <a href="' . tep_href_link(FILENAME_PRODUCT_INFO, ($cPath ? 'cPath=' . $cPath . '&' : '') . 'products_id=' . $listing['products_id']) . '">' . tep_image(DIR_WS_IMAGES . $listing['products_image'], $listing['products_name'], SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT) . '</a> ';
		}
		break;

 

replace with:

 

		  case 'PRODUCT_LIST_IMAGE':
		$lc_align = 'center';
		//*	© Captain FLAM - Début - Highslide Module	*//
		if ( isset( $HTTP_GET_VARS['manufacturers_id'] ) ) {
		  //$lc_text = '<a href="' . tep_href_link( FILENAME_PRODUCT_INFO, 'manufacturers_id=' . $HTTP_GET_VARS['manufacturers_id'] . '&products_id=' . $listing['products_id'] ) . '">' . tep_image( DIR_WS_IMAGES . $listing['products_image'], $listing['products_name'], SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT ) . '</a>';
		  $lc_text = '<a id="thumb' . $listing['products_id'] . '" class="highslide" onclick="return hs.expand(this);" href="' . DIR_WS_IMAGES . $listing['products_image'] . '" alt="'. $listing['products_name'] .'">' . tep_image( DIR_WS_IMAGES . $listing['products_image'], $listing['products_name'], SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT ) . '</a>';
		} else {
		  //$lc_text = ' <a href="' . tep_href_link( FILENAME_PRODUCT_INFO, ( $cPath ? 'cPath=' . $cPath . '&' : '' ) . 'products_id=' . $listing['products_id'] ) . '">' . tep_image( DIR_WS_IMAGES . $listing['products_image'], $listing['products_name'], SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT ) . '</a> ';
		  $lc_text = ' <a id="thumb' . $listing['products_id'] . '" class="highslide" onclick="return hs.expand(this);" href="' . DIR_WS_IMAGES . $listing['products_image'] . '" alt="'. $listing['products_name'] .'">' . tep_image( DIR_WS_IMAGES . $listing['products_image'], $listing['products_name'], SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT ) . '</a> ';
		}
		//*	© Captain FLAM - Fin   - Highslide Module	*//
		break;

Edited February 3, 2008 by Morgan^

[jeremiah11]

i also would love to know this. i love highslide and find it easy to integrate into a regualr html script, but putting in amongst all this confusing code would take a keen developer to figure out.

 

I hope we get some posts on this soon!

[Aceless]

Hi!

My first post in here. I have used Highslide in a regular asp/Html page, and wanted to try it out in the product_info.php allso..and it worked on my site, so I can tell you how I did it.

I cant write php, but have learned to read and alter the scripts (basic). It worked for me, and hope it will work for you too.

 

I assume you have uploaded the highslide catalogue to main folder.

NB! make a backup of product_info.php before you start :)

 

 

1. open the product_info.php

 

remove in line 27:

<script language="javascript"><!--
function popupWindow(url) {
 window.open(url,'popupWindow','toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=no,res
izable=yes,copyhistory=no,width=100,height=100,screenX=150,screenY=150,top=150,le
ft=150')
}
//--></script>

 

2. replace:

 

</head>

 

with:

<script type="text/javascript" src="highslide/highslide.js"></script>
<script type="text/javascript" src="highslide/highslide-html.js"></script>
<script type="text/javascript"> 
hs.graphicsDir = 'highslide/graphics/';
hs.outlineType = 'rounded-white';
window.onload = function() {
hs.preloadImages(5);
}
</script>
</head>

 

3. remove these lines for the picture (ca line 110):

       <?php script language="javascript"><!--
document.write('<?php echo '<a href="java script:popupWindow(\\\'' . tep_href_link(FILENAME_POPUP_IMAGE, 'pID=' . $product_info['products_id']) . '\\\')">' . tep_image(DIR_WS_IMAGES . $product_info['products_image'], addslashes($product_info['products_name']), SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, 'hspace="5" vspace="5"') . '<br>' . TEXT_CLICK_TO_ENLARGE . '</a>'; ?>');
//--></script>
<noscript>

<?php echo '<a href="' . tep_href_link(DIR_WS_IMAGES . $product_info['products_image']) . ' " target="_blank">' . tep_image(DIR_WS_IMAGES . $product_info['products_image'], $product_info['products_name'], SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, 'hspace="5" vspace="5"') . '<br>' . TEXT_CLICK_TO_ENLARGE . '</a>'; ?>

</noscript>  

replace with:

 

<?php echo '<a id="thumb'.$listing['products_id'].'" class="highslide" onclick="return hs.expand(this);" 
href="' . tep_href_link(DIR_WS_IMAGES . $product_info['products_image']) . ' ">' . tep_image(DIR_WS_IMAGES . $product_info['products_image'],
$product_info['products_name'], SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, 'hspace="5" vspace="5"') . '<br>' . TEXT_CLICK_TO_ENLARGE . '</a>'; ?>

[mathius]

Im wanting to use highslide with ultrapics,

I am able to use either one or the other, Not both.

I think the two together would be the ultimate images mod,

Is what Im asking possible?

 

the add-on Im wanting to use is the 2.04 non light box version of ultrapics Ultrapics contribution 2.04

 

and this Highslide for product_info.php

 

I can get as far as installing Ultrapics, but get stuck trying to add the highslide script into the modified product_info.php

 

here is the code im trying to add

 

3. remove these lines for the picture (ca line 110):
CODE
<?php script language="javascript"><!--
document.write('<?php echo '<a href="java script:popupWindow('' . tep_href_link(FILENAME_POPUP_IMAGE, 'pID=' . $product_info['products_id']) . '')">' . tep_image(DIR_WS_IMAGES . $product_info['products_image'], addslashes($product_info['products_name']), SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, 'hspace="5" vspace="5"') . '<br>' . TEXT_CLICK_TO_ENLARGE . '</a>'; ?>');
//--></script>
<noscript>

<?php echo '<a href="' . tep_href_link(DIR_WS_IMAGES . $product_info['products_image']) . ' " target="_blank">' . tep_image(DIR_WS_IMAGES . $product_info['products_image'], $product_info['products_name'], SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, 'hspace="5" vspace="5"') . '<br>' . TEXT_CLICK_TO_ENLARGE . '</a>'; ?>

</noscript> 



replace with:

CODE
<?php echo '<a id="thumb'.$listing['products_id'].'" class="highslide" onclick="return hs.expand(this);" 
href="' . tep_href_link(DIR_WS_IMAGES . $product_info['products_image']) . ' ">' . tep_image(DIR_WS_IMAGES . $product_info['products_image'],
$product_info['products_name'], SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, 'hspace="5" vspace="5"') . '<br>' . TEXT_CLICK_TO_ENLARGE . '</a>'; ?>

 

The modified section of product_info.php Im wanting to add the highslide code into

 

<!-- // BOF MaxiDVD: Modified For Ultimate Images Pack! //-->
<?php
if ($product_info['products_image_med']!='') {
	  $new_image = $product_info['products_image_med'];
	  $image_width = MEDIUM_IMAGE_WIDTH;
	  $image_height = MEDIUM_IMAGE_HEIGHT;
	 } else {
	  $new_image = $product_info['products_image'];
	  $image_width = SMALL_IMAGE_WIDTH;
	  $image_height = SMALL_IMAGE_HEIGHT;}?>
<script language="javascript"><!--
  document.write('<?php echo '<a href="java script:popupWindow(\\\'' . tep_href_link(FILENAME_POPUP_IMAGE, 'pID=' . $product_info['products_id'] . 'ℑ=0') . '\\\')">' . tep_image(DIR_WS_IMAGES . $new_image, addslashes($product_info['products_name']), $image_width, $image_height, 'hspace="5" vspace="5"') . '<br>' . tep_image_button('image_enlarge.gif', TEXT_CLICK_TO_ENLARGE) . '</a>'; ?>');
//--></script>
<noscript>
  <?php echo '<a href="' . tep_href_link(DIR_WS_IMAGES . $product_info['products_image_med']) . '">' . tep_image(DIR_WS_IMAGES . $new_image . 'ℑ=0', addslashes($product_info['products_name']), $image_width, $image_height, 'hspace="5" vspace="5"') . '<br>' . tep_image_button('image_enlarge.gif', TEXT_CLICK_TO_ENLARGE) . '</a>'; ?>
</noscript>
<!-- // EOF MaxiDVD: Modified For Ultimate Images Pack! //-->

 

Can anyone please help, Ive been trying for about 4 days now

Edited March 3, 2008 by mathius

[mathius]

.

[Aceless]

Hi!

 

I'm not sure how the ultrapic mod is working, but if you are looking for more than one img. for a product, and use highslide, it will work (i have done it)

 

I have used it togehteher with "extra image" mod: Extra image

My Highslide mod works together with this..

Edited March 10, 2008 by Aceless

[edmond1815]

Hello everybody,

 

I use that mod, that changes.

Works great on Firefox and Safari.

In IE 6, on image click , open a new window with the picture and say "Done with errors"

Please some help, i already search on highslide forum , with now result

 

Edmond