[Date Prev][Date Next][Thread Prev][Thread Next][Interchange by date
][Interchange by thread
]
[ic] displaying additional product images
At 06:04 PM 3/29/02 -0700, Dave Turk wrote:
>I need some advice on the best way to include pictures for product options.
>Say we are selling a faucet and it comes in chrome, brass and bronze and
>would like to show the customer what the faucet
>looks like in these different finishes. Is this ability already built in, or
>do I need to code it on a separate page.
>What about popups of a larger image when clicking on the thumb nails.
>Help
>Thanks very much
>Dave Turk
You need to code that yourself. Here's some tidbits to get you started...
no warranties, probably won't work off the top of my head:
In your flypage... First, name your form where the options are displayed:
<FORM ACTION="[process-target]" METHOD=POST NAME="foobar">
Then you can generate the select box based on the colors you have listed
in the color column of your products database: (something like this)
<SELECT NAME="mv_order_color" onChange="rollcolor();">
[loop arg=[item-field color]]
<OPTION VALUE="[loop-code]">[loop-code]
[/loop]
</SELECT>
Then you should name the IMG tag that would display your product image.
<IMG SRC="[item-code]" NAME="product">
And some Javascript in the head...
<!--
function rollcolor () {
document.product.src = '/foundation/images/[item-code]' +
document.foobar.mv_order_color.options[document.foobar.mv_order_color.selectedIndex].value';
}
// -->
If your product SKU is "PF-10" and your colors are "chrome,brass,white" the
code will change the image to PF-10chrome, PF-10brass, PF-10white,
etc. As Mike Heins pointed out, a modern browser will be able to guess
the filetype based on the content -- or you can make all your images .jpg,
or whatever you feel comfortable with. They would have to all be the same
size, or things would look rather funny.
It may be more convenient for you to rotate an image other than the
product. Personally I have a little color "swatch" that rotates based on
color, rather than scan 100 different colors of the same item.
Of course you could always go with a simple pop-up. :-)