ramirin
Posts: 13
Joined: Sun Jun 29, 2008 8:00 pm

Highslide Gallery as product showroom

Great programming! I'm certainly going to pay for commercial license after I get the site done and published!

I'm thinking of creating highslide based products page for showing furnitures.

I have found my favorite (for now) http://highslide.com/examples/gallery-t ... above.html
with few tweaks:
hs.outlineType = 'rounded-white';
hs.wrapperClassName = 'controls-in-heading';
thumbstrip:
position:'right',
mode: 'vertical',

I'm using <div class="highslide-heading"> for Product name and title="for Product information"

I have many galleries (thumbnails) on same page and I figured thumbs and slideshowgroups ok. I'm using one thumbnail for one product and put product variables (such as different colors and so..) to hidden container. Pictures in one gallery are mainly same size. Picture sizes between galleries change signifigantly.

I like this because it's very easy to popup multiple products for comparing.

Everything fine so far. Suprisingly easy considering I normally work with cad, cnc programming and so. Doing our own website is just a hobby in the evenings (nights).

Few questions:
1. I would like to have hs.usebox=false to have similar margins for small and large pictures, but when disabling hs.usebox my thumbs overlap the main picture. Is there any way to have certain margin for thumbs on right side?
2. Alt / Tooltips for thumbs inside gallery (hidden container). It would be nice to show user what is coming up from each thumb. Is this already coded in or am I just missing something?
3. Neat way to show product information (Code, Color, Dimensions, Weight and so) in title. If I use br to change row, it shows in 'tooltips' on mainpage. I was aiming for some nice tabs, but I'm afraid my coding skills don't get me there. EDIT: Search engines should easily find this information.
4. People who have Java disabled, they get the pictures but not the product info and additional pictures. Is there any easy way to at least inform them that they should enable java to experience the site as it should? I don't wanna make many different pages for one product since I'm aiming for as-easy-as-possible to update new products to the site.
5. Is it possible to move all the text to .txt file to be able to easily create multilingual sites? Just need to update .txt links to change language, pictures and stuff remain the same. Or maybe <xml> file? Don't know anything about php or any other than some html..

Any help is appreciated.

P.S. Besides you have great piece of software also your user support rocks. It's always nice to see dedicated people.
-rmi-
torstein.honsi
Site Admin
Posts: 9215
Joined: Thu Nov 09, 2006 11:22 am
Location: Vik i Sogn, Norway

Re: Highslide Gallery as product showroom

Thanks ramirin!

1. Try using position: 'rightpanel' for the thumbstrip instead of 'right'.
2. By giving your thumbnails a title, it will be copied over to the thumbstrip.
3. You can't have a <br/> within a title attribute. Instead, define your captions as subsequent divs. http://highslide.com/editor/?config=%7B ... irst%22%7D .
4. If you have PHP or something generating your galleries, I recommend that you let the href for each picture point to a page containing the picture and the product info. Then use hs.src to set the actual image URL. Check out the bird picture at http://highslide.com/#examples for a demo (without the captions though).
5. Okay, so now #4 is out of the question :) Anyway, PHP is way simpler to learn than parsing an XML file or using txt files. PHP is easier than JavaScript, so with your skills it's no problem.
Torstein Hønsi
CTO, Founder
Highsoft
ramirin
Posts: 13
Joined: Sun Jun 29, 2008 8:00 pm

Re: Highslide Gallery as product showroom

Thanks for quick reply,

1. How can I set width for 'rightpanel'? It seems to be what I was after.. EDIT: Found it. 8)
2. Perfect.
3. Allmost too easy. Is it possible to include something like this http://www.dhtmlgoodies.com/index.html? ... ipt=aptabs in captions?
4. I'm not sure if I understood this one. I create galleries manually (maybe I could get the code from production management but I will copy paste it to html). So can I somehowprovide some information for java-disabled surfers? Maybe only the main picture, but product info is important..
5. Thank you for the encouragement for php, maybe I will try to learn it. Do you know any good beginners site for php?
-rmi-
torstein.honsi
Site Admin
Posts: 9215
Joined: Thu Nov 09, 2006 11:22 am
Location: Vik i Sogn, Norway

Re: Highslide Gallery as product showroom

3. That tab script probably parses the HTML on DOM ready (or page load). When you open Highslide, this has already happened, an the tabs won't be generated again. So you have to find a way to parse the newly generated content again. Some dynamic scripts support this. Check out the docs for your tab script.

4.
a) Create a page called image1.html where image1.jpg is shown in a regular HTML page together with the product info.
b) Write your thumbnail like this: <a href="image1.html" onclick="return hs.expand(this, { src: 'image1.jpg' })"> . Note that the href
points to the HTML file, while the src points to the JPG image. Users without JavaScript will go directly to the HTML page.

5. When I started out I bought PHP and MySQL for Dummies, but I'm sure you can find a good beginner's site if you spend some time googling.
Torstein Hønsi
CTO, Founder
Highsoft
ramirin
Posts: 13
Joined: Sun Jun 29, 2008 8:00 pm

Re: Highslide Gallery as product showroom

3. What about css tabs? I suppose it's possible to create tab-like-behaviour with css? Since highslide was made so easy to use Css has became my weak spot at the moment..

4. Have anyone done any research how many web users don't have java enabled? I mean how important it is to have solution for non java. Is it possible to show some warning for visitors with java disabled? I'm just so thrilled with the thought that I could have just one html page for each product category..
-rmi-
torstein.honsi
Site Admin
Posts: 9215
Joined: Thu Nov 09, 2006 11:22 am
Location: Vik i Sogn, Norway

Re: Highslide Gallery as product showroom

3. Yes CSS tabs could work, but I think that a solution like that also needs some JavaScript to change the tabs. Probably there exist premade solutions for this to, so you actually don't need to write the CSS yourself.

4. Note that JavaScript and Java are two different things, so if you google for some statistics on this, search for JavaScript. Highslide doesn't depend on Java in any way. I don't know exaclty how many users have disabled JavaScript. I thinkt it's about 1-2%. Anyway, you should definately use PHP for the fallback page to save yourself from creating 10 000 static pages.
Torstein Hønsi
CTO, Founder
Highsoft

Return to “Highslide JS Usage”