Welcome, Guest ( Customer Panel | Login )




 All Forums
 VPCart Forum
 Customization
 Please Integrate HighSlideJS
 New Topic  Reply to Topic
 Printer Friendly
Author Previous Topic Topic Next Topic  

portion
VP-CART New User

86 Posts

Posted - September 14 2007 :  10:39:20  Show Profile  Reply with Quote
Please integrate this with the cart. I know you had attempted Lighbox, but that was much more annoying than. Lightbox was slow and could only have one window open at a time.

Please, Please someone integrate this.

http://vikjavev.no/highslide/#examples

support
Administrator

4679 Posts

Posted - September 14 2007 :  21:59:37  Show Profile  Visit support's Homepage  Reply with Quote
Wow, that looks great. Have forwarded this to our development team to include in their list of things to look at for you.

Thanks
Cam

VP-ASP Support
Go to Top of Page

portion
VP-CART New User

86 Posts

Posted - September 17 2007 :  12:50:43  Show Profile  Reply with Quote
Thanks, I think it would be a great addition to the cart!
Go to Top of Page

support
Administrator

4679 Posts

Posted - September 18 2007 :  00:44:52  Show Profile  Visit support's Homepage  Reply with Quote
Hi!

We have added a helpnote on how to integrate this into your site -

http://www.vpasp.com/helpnotes/shopexd.asp?id=930

Regards,
Claire
VP-ASP Support
Go to Top of Page

goshen
VP-CART New User

132 Posts

Posted - September 22 2007 :  23:58:08  Show Profile  Reply with Quote
Does anyone know how to remove the border around the image prior to zoom on it? I am demoing this for a possible inclusion on my site.
Go to Top of Page

paintwork
Starting Member

5 Posts

Posted - September 28 2007 :  17:05:45  Show Profile  Visit paintwork's Homepage  Reply with Quote
we have this running on our site, its very neat

check it out http://www.paintworkzdirect.co.uk/
Go to Top of Page

Happy
VP-CART New User

90 Posts

Posted - September 30 2007 :  09:57:12  Show Profile  Reply with Quote
goshen,

you need to add a style to the image tag in CSS file or add the inline style tag on the page holding the smaller image. I have done this successfully on shopdisplayproducts.asp successfully. You may please "view source" at my site at http://www.myfinestjewelry.com. I added the "!important" directive to the style to make it work (some inheritance issue I did not go deeper into).




Thanks,
Happy
Go to Top of Page

goshen
VP-CART New User

132 Posts

Posted - September 30 2007 :  22:39:41  Show Profile  Reply with Quote
OK guys. Many thanks. I see an interesting application of this fantastic product on your frontpage Happy. Again, permit me to ask...are those prodyucts from the "Displayrandomproducts" sub that are dynamically generated, or are your frontpage products hardcoded? The reason why I ask is that I will like to take a cue from you and use this image viewer on my homepage. However, my homepage is a random set generated via the Displayrandomproducts subroutine.

Claire (VPASP) --any ideas how this can be implemented with the Displayrandomproducts subroutine. The helpnote decribe using it with teh product templates.

Thanks for your anticipated response.
Go to Top of Page

support
Administrator

4679 Posts

Posted - September 30 2007 :  23:23:50  Show Profile  Visit support's Homepage  Reply with Quote
Dear Goshen,

This can also be implemented on the front page of your site by modifying the tmp_frontpage.htm file (instead of tmp_product.htm as detailed in the help note)

To keep the image size the same as it is currently, you may also need to modify step 5 of the instructions so that instead of loading the image from "[extendedimage]" it loads it from "[cimageurl]"


Regards
Michael
VPASP SUPPORT
Go to Top of Page

Bscott
Starting Member

United Kingdom
8 Posts

Posted - October 01 2007 :  04:24:41  Show Profile  Reply with Quote
Hi,
Really like the Highslide code, great posibilities,

I have followed the help notes with the additions from the last posts, and have managed to place additional images onto my tmp_product.htm file showing 3 or 4 thumbnails that can be selected and expanded using the 'extraimage(1-5) fields. I am having a little problem where there are no extra images in those fields it shows a blank image box with the product wording details. I have tried to $ at the front of the line; which should make it only show the html if the other column has been populated. but with now sucess. the code down to line 44 tmp_product.htm is below:

[ADD_PAGEHEADER]
<script type="text/javascript" src="highslide/highslide.js"></script>
<script type="text/javascript"> hs.graphicsDir = 'highslide/graphics/';</script>
<style type="text/css">
* { font-family: Verdana, Helvetica; font-size: 10pt; }
.highslide { cursor: url(highslide/graphics/zoomin.cur), pointer; outline: none; }
.highslide img { border: 2px solid gray; }
.highslide:hover img { border: 2px solid white; }
.highslide-image { border: 10px solid white; }
.highslide-image-blur { }
.highslide-caption { display: none; border: 5px solid white; border-top: none; padding: 5px; background-color: white; }
.highslide-loading { display: block; color: white; font-size: 9px; font-weight: bold; text-transform: uppercase; text-decoration: none; padding: 3px; border-top: 1px solid white; border-bottom: 1px solid white; background-color: black; /* padding-left: 22px; background-image: url(highslide/graphics/loader.gif); background-repeat: no-repeat; background-position: 3px 1px; */ }
a.highslide-credits, a.highslide-credits i { padding: 2px; color: silver; text-decoration: none; font-size: 10px; }
a.highslide-credits:hover, a.highslide-credits:hover i { color: white; background-color: gray; }
.highslide-display-block { display: block; }
.highslide-display-none { display: none; }
</style>
<table width="100%" border="0" cellspacing="3" cellpadding="3">
<tr>
<td>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td align=left width="50%" valign="top">
<table width="100%" border="0" cellspacing="2" cellpadding="2">
<tr>
<td class=breadcrumb>
[formatbreadcrumb]
</td>
</tr>
<tr>
<td valign=middle align=CENTER>
<a href="[extendedimage]" class="highslide" onclick="return hs.expand(this, {captionId: '[cname]'})">
<img src="[cimageurl]" alt="[cname]" title="[cname]" />

$ <td valign=middle align=CENTER>
<a href="[extraimage2]" class="highslide" onclick="return hs.expand(this, {captionId: '[cname]'})">
<br><img src="[extraimage1]" alt="[cname]" title="[cname]" ><br>

$ <td valign=middle align=CENTER>
<a href="[extraimage4]" class="highslide" onclick="return hs.expand(this, {captionId: '[cname]'})">
<img src="[extraimage3]" alt="[cname]" title="[cname]" />

$ <td valign=middle align=CENTER>
<br><img src="[extraimage5]"><br>


Many Thanks
Bob


Bob Scott
Go to Top of Page

goshen
VP-CART New User

132 Posts

Posted - October 01 2007 :  18:16:05  Show Profile  Reply with Quote
Thanks. I will look into this. I wonder if it is possible to also add the product prices and order now button to the highslide caption instead of just hard coding it?
Go to Top of Page

bjol
Starting Member

1 Posts

Posted - August 30 2008 :  05:51:23  Show Profile  Reply with Quote
Hi guys

I'm looking for the tutorials to intergrate Highslide in the shop.

There was a guide on http://www.vpasp.com/helpnotes/shopexd.asp?id=930 but now link doesn't work anymore?

And I looking for a nice foldout menu.

can anybody help?


/bjol
Go to Top of Page

elvis
VP-CART Super User

202 Posts

Posted - September 02 2008 :  02:16:47  Show Profile  Reply with Quote
Could support put back the help note please. I can't find it either.
Thanks in advance.
Go to Top of Page

support
Administrator

4679 Posts

Posted - September 02 2008 :  02:24:09  Show Profile  Visit support's Homepage  Reply with Quote
Apologize for the invalid link, currently we just updated our domain, here is the valid link

http://helpnotes.vpasp.com/shopexd.asp?id=930

Regards,
Jackson
VP-ASP Support
Go to Top of Page

jackbox
VP-CART New User

United Kingdom
72 Posts

Posted - October 17 2008 :  15:39:49  Show Profile  Visit jackbox's Homepage  Reply with Quote
Integrating it is as easy as pie.

First put all the stylesheet references that go with highslide in shop.css (at the end will do). Put the head references in your shopheader, then call the image like this:

<div class="highslide-caption">
[cname]
</div>
<a href="
[extendedimage]" class="highslide" onclick="return hs.expand(this)">
<img src="[cimageurl]" alt="Highslide JS"
title="Click to enlarge" width="100" /></a>
<div class="highslide-caption">
<p>[cname]
[cdescription]
</p>
</div></div>
Go to Top of Page
  Previous Topic Topic Next Topic  
 New Topic  Reply to Topic
 Printer Friendly
Jump To:
Snitz Forums 2000
0 Item(s)
$0.00