Announcement

**jasondarby** · 16-Mar-2003, 12:41 PM

Found it

Some of the things that i thought would work didnt. In the end i added

<p><img src="CUSTOMVAR:CERT"></p>

That seems to work well, and in the file name ive added the file directly to the site.

Jason

**NormanRouxel** · 16-Mar-2003, 06:58 PM

You can also achieve the same thing by using the Extended Information Popup page. It's possible to make the main product listing very compact (and containing your thumbnail image) and move the Add to Cart button and Attribute Choices to the popup page. If you're interested in this let me know and I'll post more details.

Norman

**jasondarby** · 16-Mar-2003, 07:45 PM

Yes im interested. Anything that makes a site look more interesting without the need for someone to have a degree in graphics is great.

Im already quite happy with what ive now done, but the more ideas the better

thanks

Jason

**NormanRouxel** · 17-Mar-2003, 11:29 AM

Here are instructions on making the Extended Info popup page have the Add to Cart button. You could then use a very compact main product template with a small image us usual (no need for CustomVar's) and have the full info and Image in the popup.

Code:

V6 - Making a pop-up product info page with Add to Cart button.

Don't use on sections with "Quantity On product page"  as errors (invalid quantity, etc) 
are sent back to the calling page and in this case it would be the popup page that has
already closed it's window.


PATCHING INSTRUCTIONS

********** Edit Act_ProductBody.html (this is the only patch to an existing template)
********** and add the following just after the start:-


<script language="JavaScript">
<!--
// set the window name to unique value
Now = new Date();
var WindowName = "W" + Now.getTime();
window.name = WindowName;
//-->
</script>


********** Make a new Extended Info template CartButton_ExtendedInfo.html
**********  (if you want all your popups to work this way then save this as the 
**********  default template ExtendedInfo.html (backup your original first)


<!-- CartButton_ExtendedInfo.html -->
<HTML>
<HEAD>
<Actinic:WINDOW WIDTH="600" HEIGHT="350"/>
<TITLE>NETQUOTEVAR:PAGETITLE NETQUOTEVAR:PAGEHEADER</TITLE>
   <Actinic:BASEHREF VALUE="NETQUOTEVAR:BASEHREF"/>
   <META NAME="ACTINICTITLE" CONTENT="NETQUOTEVAR:PAGEHEADER">
   <META HTTP-EQUIV="Content-Type" content="text/html; charset=iso-8859-1">
   <LINK REL=STYLESHEET HREF="actinic.css">

<script language="JavaScript">
<!--
function doit() {
// use unique name from source window as target.
popform.target = opener.WindowName;
// look through all parent forms 'till one containing field SID
var of = opener.document.forms;
var i = of.length - 1;
for ( var j = 0; j <= i; j++){
  var k = of[j].length - 1; 
  for ( var l = 0; l <= k; l++) {
    if ( of[j].elements[l].name == 'SID' ) {
      // patch in values from calling page
      popform.SID.value = of[j].elements[l].value;
      popform.action = of[j].action;
      popform.ACTINIC_REFERRER.value = opener.location.href;
      window.close();
      return true;
      } 
    }
  }
// should never get here but...
alert('Cannot find product form');
window.close();
return false;
}
//-->
</script>

</HEAD>
<BODY NETQUOTEVAR:BGIMAGE NETQUOTEVAR:BGCOLOR text="NETQUOTEVAR:FGCOLOR" NETQUOTEVAR:LINKCOLOR NETQUOTEVAR:VLINKCOLOR NETQUOTEVAR:ALINKCOLOR>

<FORM name="popform"  onsubmit="return doit();" METHOD=POST TARGET="" ACTION="">
<INPUT TYPE=HIDDEN NAME="SID" VALUE="">
<INPUT TYPE=HIDDEN NAME="PAGE" VALUE="PRODUCT">
<INPUT TYPE=HIDDEN NAME="ACTINIC_REFERRER" VALUE="">

<TABLE BORDER=0 cellpadding="5" cellspacing="0">
  <TR> 
    <TD rowspan="3" align="center" valign="top">
     <IMG SRC="NETQUOTEVAR:INFOIMAGE" WIDTH=NETQUOTEVAR:INFOIMAGEWIDTH HEIGHT=NETQUOTEVAR:INFOIMAGEHEIGHT>
    </TD>
    <TD valign="top"> <b><span class="actregular">NETQUOTEVAR:PRODUCTNAME</span></b>&nbsp;NETQUOTEVAR:PRODUCTREF</TD>
  </TR>
  <TR> 
    <TD valign="top">NETQUOTEVAR:INFOTEXT
      <br>
      <span class="actxsmall">NETQUOTEVAR:PRODUCTBEGINLINKNETQUOTEVAR:PRODUCTLINKTEXTNETQUOTEVAR:PRODUCTENDLINK
      NETQUOTEVAR:PRICEEXPLANATION </span>
      <br>
      <b>NETQUOTEVAR:PRODUCTPRICE</b>
      NETQUOTEVAR:PRODUCTQUANTITY
     <Actinic:ACTIONS>NETQUOTEVAR:ADDTOCARTBUTTON</Actinic:ACTIONS> 
   </TD>
  </TR>
  <TR> 
    <TD valign="top"> 
      <script language="JavaScript">
<!--
if (window.name != "ActPopup")
	{
	document.write('NETQUOTEVAR:CLOSELINK');
	}
else
	{
	document.write('<A HREF="javascript:window.close();">NETQUOTEVAR:CLOSELABEL</A>');
	}
//-->
</script>
    </TD>
  </TR>
</TABLE>
</form>
</BODY>
</HTML>
<!-- End CartButton_ExtendedInfo.html -->

Norman

**jasondarby** · 17-Mar-2003, 08:27 PM

Seems very interesting

Dont suppose you have an example page that i can take a look at?

Thanks

**NormanRouxel** · 17-Mar-2003, 11:32 PM

Sorry no example page. I just do these things to see if they can be done. It's easy to set it up with a demo product yourself and see.

This was actually done as an even more concise way of presenting products where you could have them in a drop-down list and the popup would display when the appropriate one was selected. I stripped out all that and posted it for you as a normal popup page with Add to cart enabled.

Norman

Announcement

Images using CUSTOM VAR

Images using CUSTOM VAR

Comment

Comment

Comment

Comment

Comment

Comment