assign Pictures to attributes in a drop down menu

Zen Cart 1.3.8a I am trying to set up attributes from a drop down box to show a picture example drop down in colors that says blue can it open color swatch picture? We have 45 colors to chose from and I want to use some type of color chart. Can this be done?

You might find the easiest way to do this is not by dropdown, but by radio button.

When you add the product attribute, you can upload a small image related to that color option (a "color swatch" in your case).

When all are added, your visitor can see all of the color swatches at once, then select the radio button of the one they like best.

jackie.taferner:

You might find the easiest way to do this is not by dropdown, but by radio button.

When you add the product attribute, you can upload a small image related to that color option (a "color swatch" in your case).

When all are added, your visitor can see all of the color swatches at once, then select the radio button of the one they like best.

Thank-you very much for this. It has helped me a great deal.

glad i could help :)

What is the best way to make swatches? What is the correct size for these etc?
Any help would be greatly appreciated please.
Kind Regards

it's really a matter of preference. Depending on how many swatches you have, how much detail you need. Consider that you're a customer shopping at your store. What would you want to see?

This tool could be helpful... it creates a pop-up for the attributes. So you could make small image swatches and allow the user to click and see a much larger, more detailed closeup too: http://www.zen-cart.com/index.php?main_page=product_contrib_info&products_id=616

It may be unnecessary in your case though. Like i said, it really depends on your store. Just review your site in the customer's point of view and use common sense to guide you.

Good luck!

Thanks for the link. That will come in handy I am thinking (if all goes to plan). I have to get the other issue sorted first.
Kind Regards

This sounds very similar to what I'm trying to do, but I'm trying to provide FONT samples. Can anyone assist with this?

I would very much appreciate it!!

Just take screenshots of your fonts, size them to the images you like, and follow the instructions above to put them into your website.

I too am having trouble with placement -
I changed my dropdown to radiobutton - but can I arrange the swatches in columns with the raido button next to each swatch?

http://www.stitchnframeonline.com/index.php?main_page=product_info&cPath=11_24&products_id=282

Go to Catalog > Option Name Values.

Click "edit" for the option name (in your case, I assume Kertzer baby marble)

You will see a selection for different position of the images. Try different ones, and see what looks best on your site.

0= Images Below Option Names
1= Element, Image and Option Value
2= Element, Image and Option Name Below
3= Option Name Below Element and Image
4= Element Below Image and Option Name
5= Element Above Image and Option Name

Ok worked fantasticall- i have tried to read on the centering of the images. with no luck any suggestions?

That would take modifying template files, which is a bit involved.

The easiest way to arrange the photos nicely (without having to center) is the following...

Add this code to your .css file:
.attribImg {
margin: 10px;
}

Go to Catalog > Option Name Manager

Click "edit" for the option name

Change "Attribute Images per Row" to 4.

????
Ok I add the code- I have my items per row at 3 for this particual grouping that would give be 3 on the first row and 2 on the second. is that ok or am I not understanding something.

Still hanging on the left.

yes, instead of centering the images, I'm suggesting having 4 images per row, which will fill in the space better.

Looks like the .css code did not do anything. Try padding: 10px;

If you want to center the images, you're going to have to modify the template files.

that may work for this page but I am concerned that with other attributes they will shift everything off

Any Ideas on the templates?