Follow us on Twitter X-Cart on Facebook Wiki
Shopping cart software Solutions for online shops and malls

quick and dirty detail images

 
Reply
   X-Cart forums > X-Cart 4 > Dev Questions
 
Thread Tools Search this Thread
  #1  
Old 05-30-2005, 04:01 AM
 
golfguy golfguy is offline
 

Senior Member
  
Join Date: Apr 2005
Location: Omaha,NE
Posts: 108
 

Default quick and dirty detail images

I wanted to use the category functionality to list Б─°give awayБ─² stuff, but not have to force my customers to the product detail page and scroll down to see a larger image.

This a quick and dirty way of dealing with providing detail images on the category pages. I only have a few products I need this for, so if youБ─≥re implementing detail images for a whole mess of products there are better solutions out there.

The images used are on the file system (not in the SQL database)

You need four images, the Б─°click to enlargeБ─² button, Б─°click to closeБ─² button, Б─°click to closeБ─² backgroundБ─² and your detailed image. Upload to your images folder.
http://www.ecartstore.com/skin1/images/gpis/CLICKTOENLARGE.gif

http://www.ecartstore.com/skin1/images/gpis/CLICKTOCLOSE.gif

http://www.ecartstore.com/skin1/images/gpis/CLICKTOCLOSEbann.gif

Add the follow code between the <HEAD> and </HEAD> section in customer/home.tpl

Code:
{literal} <script language="JavaScript" type="text/JavaScript"> <!-- function MM_findObj(n, d) { //v4.01 var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); if(!x && d.getElementById) x=d.getElementById(n); return x; } function MM_showHideLayers() { //v6.0 var i,p,v,obj,args=MM_showHideLayers.arguments; for (i=0; i<(args.length-2); i+=3) if ((obj=MM_findObj(args[i]))!=null) { v=args[i+2]; if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v=='hide')?'hidden':v; } obj.visibility=v; } } //--> </script> {/literal}

From the administration backend Add the following code to the Б─°Short DescriptionБ─² field of the product.
Code:
<div id="Layerpix1" style="position:absolute; border: 1px solid #666666;width:auto; height:auto; z-index:1000; background-image: url('skin1/images/CLICKTOCLOSEbann.gif'); visibility: hidden; overflow: hidden;"> [img]skin1/images/CLICKTOCLOSE.gif[/img] [img]skin1/images/templates/basicyello_500.gif[/img] </div> [img]skin1/images/CLICKTOENLARGE.gif[/img] any text you want to show up in the short description

Admin screen should appear as follows;
http://www.ecartstore.com/skin1/images/gpis/exDesc.gif

This is what you should get;

Not clicked
http://www.ecartstore.com/skin1/images/gpis/exclickoff.gif
Clicked
http://www.ecartstore.com/skin1/images/gpis/exclickon.gif

NOTE: use the Б─°topБ─² and Б─°leftБ─² modifiers if you want the image to appear in a specific location on the screen.

The name of the Layers MUST be different for every occurance of a detail image e.g. Layerpix1, Layerpix2, etc.[/img]
__________________
Version 4.2.3
Reply With Quote
  #2  
Old 06-01-2005, 03:45 PM
 
balinor balinor is offline
 

Veteran
  
Join Date: Oct 2003
Location: Connecticut, USA
Posts: 30,253
 

Default

Got a working url?
__________________
Padraic Ryan
Ryan Design Studio
Professional E-Commerce Development
Reply With Quote
  #3  
Old 06-02-2005, 05:55 AM
 
golfguy golfguy is offline
 

Senior Member
  
Join Date: Apr 2005
Location: Omaha,NE
Posts: 108
 

Default

Here you go product page
__________________
Version 4.2.3
Reply With Quote
  #4  
Old 06-02-2005, 06:01 AM
 
balinor balinor is offline
 

Veteran
  
Join Date: Oct 2003
Location: Connecticut, USA
Posts: 30,253
 

Default

Nice
__________________
Padraic Ryan
Ryan Design Studio
Professional E-Commerce Development
Reply With Quote
  #5  
Old 06-02-2005, 06:12 AM
 
golfguy golfguy is offline
 

Senior Member
  
Join Date: Apr 2005
Location: Omaha,NE
Posts: 108
 

Default

Thanks! That means a lot coming from you
__________________
Version 4.2.3
Reply With Quote
  #6  
Old 06-24-2005, 10:20 AM
  Bling's Avatar 
Bling Bling is offline
 

Senior Member
  
Join Date: Apr 2005
Posts: 162
 

Default

ummm...this looks pretty awsome! Does the script call the detailed image or does it enlarge the thumbnail or ??

I would really like it to call the detail in order to keep the clarity.

KUDOS...nice work essay!
__________________
Thanks...Bling

4.4.2
Reply With Quote
  #7  
Old 06-24-2005, 11:38 AM
 
golfguy golfguy is offline
 

Senior Member
  
Join Date: Apr 2005
Location: Omaha,NE
Posts: 108
 

Default

Thanks

All the images involved.(click to enlarge, click to close, and the detail image) are on the FS at skin1/images/ the detail image is in no way connected to the thumbnail.

That's why I said this is a quick and dirty popup the whole thing can be done in 5 minutes, but if you want to do this for thousands of images it would be a pain.
__________________
Version 4.2.3
Reply With Quote
  #8  
Old 06-24-2005, 11:52 AM
  Bling's Avatar 
Bling Bling is offline
 

Senior Member
  
Join Date: Apr 2005
Posts: 162
 

Default

Could you create an extra field...add the script to the extra field and just copy it to all the prodcuts using excel and csv?
__________________
Thanks...Bling

4.4.2
Reply With Quote
  #9  
Old 06-24-2005, 12:04 PM
 
golfguy golfguy is offline
 

Senior Member
  
Join Date: Apr 2005
Location: Omaha,NE
Posts: 108
 

Default

I don't know. experiment let me know what you find
__________________
Version 4.2.3
Reply With Quote
Reply
   X-Cart forums > X-Cart 4 > Dev Questions


Thread Tools Search this Thread
Search this Thread:

Advanced Search

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Forum Jump


All times are GMT -8. The time now is 06:13 PM.

   

 
X-Cart forums © 2001-2020