Product Variant Thumbnails - How To Display?
 

Hi,

I am working on 4.1.3 with the Product Options/Variants and have added options and attached a thumbnail to each one.

When you view the product detail page the thumbnail image changes as you change the product option, which is fine. But, what I also want to do is display each option/variant thumbnail separately. Maybe in another table below the product details but above the Send to Friend, etc.

http://www.studio57designs.com/example.jpg

I've tried the debug and don't quite understand what variables, etc I need to use.

There may be a few thumbnails or many....isn't there a way to create a loop do display them?

Ultimately what I would like to do is have the thumbnails with qty and checkboxes and be able to order multiple items from that one screen. But, I would be happy to get the first step of displaying the thumbnails.

Any assistance would be greatly appreciated.

Thanks,

Louise

Re: Product Variant Thumbnails - How To Display?
 

I "simply" made a swatch image... and included it into the product description.

The pulldown for each color changes the variant, and there is also an enlarged view of the color palette.

This is one product that I am thinking of changing to a "multiple items and qty" type of input page -- small swatch, next to an input box... then "add to cart" so customers can buy mutliple colors all at once... but for most of my products, a customer will only buy one color.

Hope this helps...

Jeremy

Re: Product Variant Thumbnails - How To Display?
 

Jeremy,

Thanks for the reply but thats not what I'm looking for....because if additional options/variants are added then the image will have to be updated and that doesn't make it very dynamic.

I prefer to code it so that the thumbnails will change without alot of additional intervention.

Louise

Re: Product Variant Thumbnails - How To Display?
 

Ok, I've made some progress but I need some assistance with the code I created.

Here is the code - template name (option_images.tpl):


This template is then inserted into the product.tpl.

Here is the result:
http://www.studio57designs.com/sample2.gif

But, I don't know how to code it so that it will flow to the next row for more than 5 images.....like the subcategories icon mod.

Also, I want to make each image a link to the product page.

Now that I've got this far can someone help me figure out these last 2 steps.

Thanks,

Louise

Re: Product Variant Thumbnails - How To Display?
 

Anyone have any help for my question? Thanks, Louise

Re: Product Variant Thumbnails - How To Display?
 

Just in case someone has the same idea....here is the code to display variant thumbnails in rows:

Re: Product Variant Thumbnails - How To Display?
 

Dalmuti,
Thanks for sharing this code. It works great!

Re: Product Variant Thumbnails - How To Display?
 

You are welcome....hope you find it useful.

Louise

Re: Product Variant Thumbnails - How To Display?
 

Hi,

If I wanted to display the variants thumbnails on the category display where would you code need to go?

Thanks,

Re: Product Variant Thumbnails - How To Display?
 

Ok, this works awesome...but is there a way to code the links to reflect the image swapping as well as changing the SKU?

Re: Product Variant Thumbnails - How To Display?
 

I know its a while back but do you have anywhere that I can check this out to see if its what Im after??

Re: Product Variant Thumbnails - How To Display?
 

View here: Taiga Yarns

Louise

Re: Product Variant Thumbnails - How To Display?
 

Thanks for that Louise. I dont suppose you know if that works for colours if you have more than one option ie. colour and then a badge option say? so that this mod only uses infor from the colour variant and not the other?

Re: Product Variant Thumbnails - How To Display?
 

Everyone, I have a fully working mod for this. If anyone is interested, check out this link: http://forum.x-cart.com/showthread.php?t=30651

Re: Product Variant Thumbnails - How To Display?
 

This code is exactly what i'm looking for, unfortunately i'm not understaning exactly where to place this. Could someone give detailed directions as to how to place it and where? I think i found the template file skin1/main/product.tpl . Now where do I insert it in that paricular file, or call on the options_images.tpl file? Thank you.

Thanks a lot Dalmuti!
 

I have a question..
If I want to display only color option between color and size option,
how can I modify this code?

Thanks for your great job!O:)