Color attributes as images in product display ?

Something like that will require custom configuration / code. The simplest way would probably be to use a module holding images for each of your different options that alters the Add to Cart form to hide the select list via JavaScript and present a palette of images that can be clicked to change the value of the hidden select list. You'll have to figure out which images to show based on the options in the select list and then make sure they map to the proper selection.

If you're interested, the example you've linked to actually uses two separate forms. One just has a bunch of image links you can click on that updates hidden form values in the other form that you actually use to "Buy this design". I suppose they have some server side validation to make sure you don't monkey with the HTML and set some options to invalid values.

Marking this fixed as a support request to leave it open in case other people are interested over the next couple of weeks.

Another option that you can try is something similar to what I have here in www.koziol.co.il

if you scroll down on the main page you see 5 products, each has a color square beneath it. when hovering over the square the image changes and the "price" could change.

this is actually a views slideshow of products (not product displays).
These products have a taxonomy term for color which has a field on it for the square image.
you can probably do the same setup but simply add a "buy" button in the view and probably change the slideshow from changing on hover to changing on click.

Idan

Hi, I try to do this also, like on this site: http://www.maquillage-cosmetique-discount.fr/ .

Here are already two posts about the subject:

• http://www.drupalcommerce.org/node/466
• http://drupal.org/node/1147458

Maybe it helps.

Paul

I created a feature request on http://drupal.org/project/commerce.

http://drupal.org/node/1180016#comment-4563468

@arbel :
1/I was thinking about doing this for the product display node : having a view of all the "teaser image" of all the product referenced in the product display node. When the user will click on it, it will simply reload the page with the right product sku.... and this is where i need support !
I can use the View "rewrite output as a link" function to create the link, but I don't know how to get the exact link for the right product sku... I only have the link to the node which automatically loads the first Product sku.... I figured you use "default-product=63" as a view argument, but i'm not sure i understand where you got that
.

2/Another issue i think i'll have to face soon is when i'll have multiple options list, how would it be possible to have my view / option list choices be persistent ? (say i choose the color BLUE, which redirects me to the BLUE sku, then size L in my 2nd option list, i would like to have the BLUE color and L size SKU. no problem for this ?

Thanks !

Pascal