Information Popup

[HarryCornelius]

Hi Everyone

Following on from some suggestions about my online store I need some pointers please.

I currently use the 'Extended Information' tab on products to provide an Artist Biography. This is rather clumsy as it needs to be added to each product.

I would also like to have images clickable so a larger image is displayed, so I would need to 'display by clicking on product image'.

So my question is - how can I have artist biographies available on each page, opening in a popup window, as well as having my images open in a new window?

I hope I've explained this OK. Shop link below.
Thanks in advance for any pointers.
http://www.mulberrytreegallery.co.uk...talogBody.html

[gabrielcrowe]

well... rether ugly hack, would be to use the popup to store both pieces of information. Using links to scroll the page down when clicked, very much like the product anchors do when clicked in search results.

this would require that you type the biog in the extended popup bit, and modify the template that holds the popup.

something like this (bear in mind i ahve no idea what the template looks like):

<a name="imagelink">Product image</a>
<img>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<a name="textlink">Bios</a>
Bios tex goes here...

then make a link like this:

a href="popup.html#imagelink"
a href="popup.html#textlink"

to scroll the window to the correct location

um. if it does not work, then, err, i just guessed off the top of my head, but you get the idea? right?

[HarryCornelius]

Thanks for the input.

I've just noticed a shop built using V8 can do this exact thing...

Guess I need to upgrade..

[RuralWeb]

I've just noticed a shop built using V8 can do this exact thing

Yes - V8 can have multiple popups.

[NormanRouxel]

V7 Can be tweaked to do this.

Splitting the Extended Info into separate Popup Image and a Popup Text windows. You will get one popup for the Extended Info Text and another for the Extended Info Image.

Put the following into actiniccore.js (at the very end)

// BEGIN Additional Popup image 
var popimg;

function ImgPopUp(sUrl, nWidth, nHeight)
  	{  
	window.open(sUrl, 'ImgPopup', 'width=' + nWidth + ',height=' + nHeight + ',scrollbars, resizable');
	if (!bPageIsLoaded)
		{
		window.location.reload(true);
		}
	}

function popimage(){
if ( popimg != '' ) document.write('<a href="javascript:ImgPopUp(\'' + popimg + '\',500,600)">');
}

function popend(){
if ( popimg != '' ) document.write('</a>');
}
// END Additional Popup image

Replace Act_ProductImage.html with

<!-- ProductImage HTML begin -->
<!-- This file is used to build the product image markup. -->
<script type="text/javascript">
<!--
popimage();
// -->
</script>
<IMG SRC="NETQUOTEVAR:IMAGEFILE"
	  ALT="NETQUOTEVAR:ALTERNATETEXT"
	  BORDER=0
	  NETQUOTEVAR:IMAGEHEIGHT
	  NETQUOTEVAR:IMAGEWIDTH
	  NETQUOTEVAR:OTHERIMAGEMARKUP>
<script type="text/javascript">
<!--
popend();
// -->
</script>
<!-- This file is used to build the product image markup. -->
<!-- ProductImage HTML end -->

Put the following code into Act_ProductLine.html (and all Product Templates you use for your Products) just after the NETQUOTEVAR:PRODUCTFORMBEGIN line.

<script type="text/javascript">
<!--
popimg = "NETQUOTEVAR:INFOIMAGE";
// -->
</script>

Edit Act_ExtendedInfo.html (or whatever Template you use for Extended Info Pages.
Look for the line

<IMG SRC="NETQUOTEVAR:INFOIMAGE" WIDTH=NETQUOTEVAR:INFOIMAGEWIDTH HEIGHT=NETQUOTEVAR:INFOIMAGEHEIGHT>

Replace it with

<!-- <IMG SRC="NETQUOTEVAR:INFOIMAGE" WIDTH=NETQUOTEVAR:INFOIMAGEWIDTH HEIGHT=NETQUOTEVAR:INFOIMAGEHEIGHT> -->

Use the Display By: Button or Text link. Don't check the Display By: Image option.

The Extended Info image will now open a separate popup.

[HarryCornelius]

Many thanks, i shall give that a try.

Cheers,
Harry