New Mod: Expandable / Collapsible Attributes Field in Product Page

Hey im uploading this mod to the addons area, hopefully it will get some interest.

It is a cosmetic mod using jquery to make the attributes area a little more appealing, it has an expandable / collapsible div for attributes, so if like me on some of your products have a large amount of attributes, this is perfect for tucking them away until the customer actually wants to input something. For browsers with javascript disabled it displays as expanded.

Its a pretty simple mod with the only override being the modules_attributes.php file and some additional css.

Not tested for compatibility with other mods but i am using Tabbed products Pro on 1.3.9h and is working fine.

See it on my live store: http://www.livvylougifts.co.uk

Liking your mods a lot

This is now live in addons area: http://www.zen-cart.com/index.php?main_page=product_contrib_info&products_id=1989

If you fancy posting your site and giving alternative working demo's that would be great :)

I have had to submit an update though which is not yet live because i forgot to include modified tpl_modules_attributes.php so please follow manual instructions in the readme.txt for that file until the update is accepted :)

How do I move this up the page?
I want it to be placed under Tabbed Products

again, without a link for reference i cannot help?

Quick question - does your mod handle multiple option names? When I looked at the example on your store, I only saw products with one option name (i.e. Personalize). What we need is a (toggle-like) link for each option name, like:

• Choose color
• Choose size
• Choose whatever

Thanks!

http://www.livvylougifts.co.uk/index.php?main_page=product_info&cPath=105&products_id=591

if you see the link above i have dropdown boxes for that product, the mod is purely aesthetic, it doesnt alter the attributes themselves, it only wraps the attribute module in a expandable box the function of the attributes remains unchanged

is this what you meant?

reading your message again i realised i've missed the point. At the moment it just deals with the module in its entirety not individual attributes

I've been looking into this (as per your pm and message above)

The mod controls at a template level rather than modifying the attributes code (in tpl_modules_attributes.php) and as such it is indiscriminate as to what attributes it wraps.

So from what i can see you need to somehow distinguish between attributes at code level and wrap it there, this is all done in includes/modules/attributes.php (obv use override templates for testing) ```
switch ($products_options_names->fields['products_options_images_style']) {
case '0':
$tmp_checkbox .= zen_draw_checkbox_field('id[' . $products_options_names->fields['products_options_id'] . ']['.$products_options_value_id.']', $products_options_value_id, $selected_attribute, 'id="' . 'attrib-' . $products_options_names->fields['products_options_id'] . '-' . $products_options_value_id . '"') . '<label class="attribsCheckbox" for="' . 'attrib-' . $products_options_names->fields['products_options_id'] . '-' . $products_options_value_id . '">' . $products_options_details . '</label><br />' . "\n";
break;

i have left the javascript in the template file (tpl_modules_attributes.php) and then lifted the additional div code which the javascript controls to wrap the checkboxes```
 $tmp_checkbox .= '<div id="expanding_attribs">
<h2 class="expheading">Personalise This Product Here!</h2>
<div class="expcontent">' . zen_draw_checkbox_field('id[........

this wraps each individual checkbox with the javascript, so its part of the way there, perhaps one of the pros can jump on this thread and give some guidance on how to wrap the checkboxes and their values in their entirety?

Terrific - your contribution to both Add-ons and this forum is another wonderful example of the true superiority of the Zen Cart family in the world of open source apps!

I'll play with this and let you know of any successes!

Thanks - much appreciated!

OK, made the edits in the attributes.php file for each of "case 0", "case 1" and "case 2" in the "checkbox" section, then made sure all option names were defined as "checkbox" and had "Attribute Style" of either 0, 1 or 2. And it worked, sort of. The product page showed the "Attributes!" link correctly and, when clicked, the first option name and the "Personalise This Product Here" link were displayed. But ...

... when I clicked on that "Personalise..." link, it displayed the first option value, a second "Personalise..." link and, under that, the next option name with another "Personalise..." link. Clicking on 2nd link displayed the next option value with a link, and the 2nd option name/ link moved down. Once all the first option name's values were displayed, I clicked on the 2nd option name link, and it behaved just as before, listing the first value of the 2nd name, and the 3rd option name below it.

Hmmm... not sure if my description is very clear, so I'll try to summarize:

• looks like the links were applied to both the option names and their values, instead of just the names
• not all option names were listed initially, that is the next option name only appeared after the previous name's link was clicked (NOTE: not necessarily a big problem for us!)
• don't know how to apply the edit to cases 3, 4 and 5 (NOTE: this is, of course, a problem since we would like to use Attribute Style 3 and/or 5!)

I'll continue to play with this, but if anyone has any ideas, please let us know! I set up a "Zen Test" store on our server to test all this, so if anyone wants to check this out and/or play with it, please pm me.

Thanks!

thas exactly the problem i had it seemed to be wrapping each level in a new javascript again and again, are you applying the full code with javascript? or are you leaving the javascript in the main template page and using the wrappers in the attributes.php file?

I installed the mod to the Zen Test store, checked to see if it worked (it did!), then modified just the "attributes.php" file, starting at line 325, like you suggested:

switch ($products_options_names->fields['products_options_images_style']) {
                      case '0':
                       $tmp_checkbox .= '<div id="expanding_attribs">
<h2 class="expheading">Personalise This 0 Product Here!</h2>
<div class="expcontent">' . zen_draw_checkbox_field('id[' . $products_options_names->fields['products_options_id'] . ']['.$products_options_value_id.']', $products_options_value_id, $selected_attribute, 'id="' . 'attrib-' . $products_options_names->fields['products_options_id'] . '-' . $products_options_value_id . '"') . '<label class="attribsCheckbox" for="' . 'attrib-' . $products_options_names->fields['products_options_id'] . '-' . $products_options_value_id . '">' . $products_options_details . '</label><br />' . "\n";
                      break;

Did this for case 0, 1 and 2, and checked it by changing the h2 text appropriately so I could see if it worked for those 3 styles. It worked the same for all 3.

BTW, the Zen Test store is a clean install with no other mods.

vey sorry , im struggling to find the time to do this while i am setting up my second shop, juts posting to keep this alive in the hope someone else will jump in for the moment until i can commit more time?