How to expand/collapse attribute lists?

I'm trying to set up a new Zen Cart store, but have not been able to solve a major issue. Our products are sofas (etc.) for which the customer needs to choose the Body fabric, then the pillow fabric, then the wood finish, etc. Since there are 100's of fabrics to choose from for the body and then 100's of fabrics to choose from for the pillows, the normal product page display would be HUGE, and very confusing!

So, I'm thinking that we just show a list of the option names (like "Select a fabric for the Body", "Select a fabric for the Pillows", "Select a Wood Finish", etc.), and when the customer clicks on the option name (let's say for the Body fabric), that option "expands" to display all the fabric swatches from which the customer can make his/her selection. Once the selection is made, the display collapses back to just the list, and the customer can click on the next option (like the pillow fabrics), and so on.

There are several js scripts available for the expand/collapse part, but my questions are:

1. In which file(s) would we add the script, and where?
2. How could we prevent standard Zen Cart from wanting to display all the swatch images anyway?

Actually, an even better solution would be for the various option names to appear as separate tabs, like "Body Fabrics", "Pillow Fabrics", etc. on the product page, and for the option values (swatch images) to be displayed only when the appropriate tab is opened. Unfortunately, the Tabbed Products Pro mod can't do this, but if anyone has any ideas to get us in the right direction, it would be much appreciated.

Thanks!

1. /includes/YOUR_TEMPLATE/templates/tpl_modules_attributes.php
2. Your JavaScript should "hide" each set of options by default, then "show" when it's clicked on.

Thanks, Jackie, appreciate the help! And particular java script you would recommend?

Too many options can result in a "kid in a sweetshop" syndrome. Customers are so overwhelmed by the choices available, they just go elsewhere.

You may be better off segregating your products at a primary attribute level... ie: create many more products, located in categories that are named what would otherwise be a primary attribute.

For example... instead of having hundreds of colour swatches all on ONE product, create categories for COLORS, and then at least you are limiting the number of selectors...

Categories:

Predominately Green Sofas
Predominately Red Sofas
Predominately Cream Sofas

You could go another level...

Under each COLOR category, have PATTERN TYPES

Predominately Green Sofas
|_ Tartans
|_ Florals
|_ Abstract
|_ (etc...)

I agree, and I try to avoid attributes where possible for just that reason. However, when dealing with a custom product, such as a couch with different color and fabric options, it makes more sense to offer those selections as attributes. If you used products, the customer would find it very confusing to add separate products to their Cart for color, shape, fabric, and so on - to purchase one custom couch.

And yes you could remove the "custom" aspect of it, and make separate products for each combination of options, selling them as completed couches. But the possibilities are endless so I think it would be more difficult to manage that many products. For example, one couch with 10 values under 2 different options is going to turn into 20 products. Let's say there are 100 couch styles, then in this case you've got thousands of products to manage, instead of hundreds. Not to mention you'll then need to provide a photo for every finished couch. Unless those are pre-built couches, a photo won't exist.

In most instances, you're absolutely correct. However, for this store type, shoppers generally select the type (category) of furniture first, like sofa, loveseat or chair, then the fabric for their selected item.

Showing 100's of fabric swatches can indeed be very confusing, which is why, on our current non-Zen Cart store (www.livinggreenfurniture.com) we categorized the fabrics by type, like Solids, Stripes, Floral, Patterns, etc. I hope we can eventually do this in our Zen Cart store, too, but I first need to find a way to just display one option set at a time. Once that's figured out, I'll see if we can break the options down a bit further.

Thanks for your thoughts - much appreciated!

Hello..
I would like to do something like this
http://www.tshirtbydesign.com/index....roducts_id=538
Click here to Customize!

how would go go about this.
Any help would be great. Thanks

Quote:

---

Originally Posted by romy

Hello..
I would like to do something like this
http://www.tshirtbydesign.com/index....roducts_id=538
Click here to Customize!


how would go go about this.
Any help would be great. Thanks

---

they probably used a combination of css and jquery. There are tons of examples on the internet on how to achieve this.