|

Dynamic Tabs
Posted 16 November 2006 - 07:49 PM #1
i.e. One product may have 'Description' 'Tech Spec' 'Dimensions', while another may only have 'Description' 'Tech Spec'.
It means adding fields to the existing tables to accomodate the extra data, and changes to the current tpl's.
Maybe if others are interested i'll post a how to... in a couple of weeks, but i'm not sure how to easily impliment the table changes, maybe an sql script, but i don't want to be responsible for trashing someones site.
If Sno's reading maybe he could help make it into a proper Mod.
I've included some images.
Posted 16 November 2006 - 08:01 PM #2
Customer Service (Helpdesk) Addon for CS-Cart v4.3.1
Quote and Invoicing Addon for CS-Cart v4.3.1
Posted 17 November 2006 - 12:40 AM #4
Bob
Posted 18 November 2006 - 01:38 AM #6
Cant wait for your contribution
Posted 18 November 2006 - 06:44 PM #7
Thanks,
Mike
Posted 20 November 2006 - 09:23 PM #8
http://exploding-boy...enus/menus.html
Posted 21 November 2006 - 05:21 AM #9
Posted 18 December 2006 - 12:49 PM #10
Posted 18 December 2006 - 10:53 PM #11
Thanks.
Posted 12 January 2007 - 12:45 PM #12
Thanks,
Peter
Posted 03 February 2007 - 03:25 AM #13
I'd suggest you make backup of database and any modified files first.
1. In /customer/products_pages/product_details.tpl
Comment out lines 189-191:
<hr> <p></p> {$product.full_description|default:$product.short_description}2. Below it copy and paste the following:
{* Start Product Tabs Menu *} <link rel="stylesheet" type="text/css" href="{$skin_dir}/tabcontent.css" /> <script type="text/javascript" language="javascript 1.2" src="{$skin_dir}/tabcontent.js"></script> <br /> <ul id="maintab" class="shadetabs"> <li class="selected"><a href="#" rel="tcontent1">Description</a></li> {if $product.tab2_avail == 'Y'} <li><a href="#" rel="tcontent2">{$product.tab2title}</a></li> {/if} {if $product.tab3_avail == 'Y'} <li><a href="#" rel="tcontent3">{$product.tab3title}</a></li> {/if} {if $product.tab4_avail == 'Y'} <li><a href="#" rel="tcontent4">{$product.tab4title}</a></li> {/if} {if $product.tab5_avail == 'Y'} <li><a href="#" rel="tcontent5">{$product.tab5title}</a></li> {/if} </ul> <div class="tabcontentstyle"> <div id="tcontent1" class="tabcontent"> {$product.full_description|default:$product.short_description} </div> <div id="tcontent2" class="tabcontent"> {$product.tab2} </div> <div id="tcontent3" class="tabcontent"> {$product.tab3} </div> <div id="tcontent4" class="tabcontent"> {$product.tab4} </div> <div id="tcontent5" class="tabcontent"> {$product.tab5} </div> </div> <script type="text/javascript"> //Start Tab Content script for UL with id="maintab" Separate multiple ids each with a comma. initializetabcontent("maintab") </script> {* End Product Tabs Menu *}3. In /admin/products_pages/products_update.tpl:
At line 206 copy and paste the following,
{******* START PRODUCT TABS SECTION *******} <tr> <td class="field-name" nowrap="nowrap">{$lang.tab2}:</td> <td> </td> <td> <input type="hidden" name="product_data[tab2_avail]" value="N" /> <input type="checkbox" name="product_data[tab2_avail]" value="Y" {if $product_data.tab2_avail == 'Y' || $mode == "add"}checked="checked"{/if} /></td> </tr> <tr> <td class="field-name" nowrap="nowrap">{$lang.tabtitle}:</td> <td > </td> <td> <input type="text" name="product_description[tab2title]" size="55" value="{$product_data.tab2title|escape:html}" class="input-text" style="width: 85%" /></td> </tr> <tr> <td class="field-name" nowrap="nowrap">{$lang.full_description}:</td> <td> </td> <td> <textarea id="product_tab2" name="product_description[tab2]" cols="55" rows="10" class="input-text" style="width: 85%">{$product_data.tab2|escape:html}</textarea><br /> {include file="buttons/button.tpl" but_text=$lang.edit_in_visual_editor but_onclick="javascript: fn_open_editor('product_tab2');" but_style="text"} </td> </tr> <tr> <td class="field-name" nowrap="nowrap">{$lang.tab3}:</td> <td> </td> <td> <input type="hidden" name="product_data[tab3_avail]" value="N" /> <input type="checkbox" name="product_data[tab3_avail]" value="Y" {if $product_data.tab3_avail == 'Y'}checked="checked"{/if} /></td> </tr> <tr> <td class="field-name" nowrap="nowrap">{$lang.tabtitle}:</td> <td > </td> <td> <input type="text" name="product_description[tab3title]" size="55" value="{$product_data.tab3title|escape:html}" class="input-text" style="width: 85%" /></td> </tr> <tr> <td class="field-name" nowrap="nowrap">{$lang.full_description}:</td> <td> </td> <td> <textarea id="product_tab3" name="product_description[tab3]" cols="55" rows="10" class="input-text" style="width: 85%">{$product_data.tab3|escape:html}</textarea><br /> {include file="buttons/button.tpl" but_text=$lang.edit_in_visual_editor but_onclick="javascript: fn_open_editor('product_tab3');" but_style="text"} </td> </tr> <tr> <td class="field-name" nowrap="nowrap">{$lang.tab4}:</td> <td> </td> <td> <input type="hidden" name="product_data[tab4_avail]" value="N" /> <input type="checkbox" name="product_data[tab4_avail]" value="Y" {if $product_data.tab4_avail == 'Y'}checked="checked"{/if} /></td> </tr> <tr> <td class="field-name" nowrap="nowrap">{$lang.tabtitle}:</td> <td > </td> <td> <input type="text" name="product_description[tab4title]" size="55" value="{$product_data.tab4title|escape:html}" class="input-text" style="width: 85%" /></td> </tr> <tr> <td class="field-name" nowrap="nowrap">{$lang.full_description}:</td> <td> </td> <td> <textarea id="product_tab4" name="product_description[tab4]" cols="55" rows="10" class="input-text" style="width: 85%">{$product_data.tab4|escape:html}</textarea><br /> {include file="buttons/button.tpl" but_text=$lang.edit_in_visual_editor but_onclick="javascript: fn_open_editor('product_tab4');" but_style="text"} </td> </tr> <tr> <td class="field-name" nowrap="nowrap">{$lang.tab5}:</td> <td> </td> <td> <input type="hidden" name="product_data[tab5_avail]" value="N" /> <input type="checkbox" name="product_data[tab5_avail]" value="Y" {if $product_data.tab5_avail == 'Y'}checked="checked"{/if} /></td> </tr> <tr> <td class="field-name" nowrap="nowrap">{$lang.tabtitle}:</td> <td > </td> <td> <input type="text" name="product_description[tab5title]" size="55" value="{$product_data.tab5title|escape:html}" class="input-text" style="width: 85%" /></td> </tr> <tr> <td class="field-name" nowrap="nowrap">{$lang.full_description}:</td> <td> </td> <td> <textarea id="product_tab5" name="product_description[tab5]" cols="55" rows="10" class="input-text" style="width: 85%">{$product_data.tab5|escape:html}</textarea><br /> {include file="buttons/button.tpl" but_text=$lang.edit_in_visual_editor but_onclick="javascript: fn_open_editor('product_tab5');" but_style="text"} </td> </tr> {******* END PRODUCT TABS SECTION *******}4. Copy the two files tabcontent.css and tabcontent.js to /customer/
5. Copy the two files shade.gif and shadeactive.gif to /customer/images/
6. New Language Variables:
tabtitle = Tab Title
tab2 = Tab 2 Available
tab3 = Tab 3 Available
tab4 = Tab 4 Available
tab5 = Tab 5 Available
7. Table Field Additions: I used PHPMYADMIN but i'm sure it's not hard to write a mysql script to add the fields.
Field Type Collation Null Default In Table products: tab2_avail char(1) latin1_swedish_ci No N tab3_avail char(1) latin1_swedish_ci No N tab4_avail char(1) latin1_swedish_ci No N tab5_avail char(1) latin1_swedish_ci No N In Table Product_descriptions: tab2 text latin1_swedish_ci No tab2title varchar(25) latin1_swedish_ci No tab3 text latin1_swedish_ci No tab3title varchar(25) latin1_swedish_ci No tab4 text latin1_swedish_ci No tab4title varchar(25) latin1_swedish_ci No tab5 text latin1_swedish_ci No tab5title varchar(25) latin1_swedish_ci No
The FIRST TAB is always 'Default Full Product Description'.
Now when you edit or add an existing products in admin you will find there are another 4 spaces to put the tab descriptions. You can switch each tab on/off and give each tab an individual title.
If you want to change the tab colours then change the gif's but try to keep the same filenames, otherwise you'll have to edit the tabcontent.css file.
I've included these instructions in the attached file "product tabs.zip" which also include all the neccessary files you need.
If anyone can improve on this then please do.
Attached Files
Posted 03 February 2007 - 03:50 AM #14
Would you mind if I talked to them about this?
Thanks,
Mike
Posted 03 February 2007 - 12:01 PM #15
They would probably do it alot better than me anyway, lol.
Posted 06 February 2007 - 04:58 PM #16
We have investigated this code http://forum.cs-cart...44&postcount=13.
And in this case we can offer you the following.
1. We will add a new "Tabs to product details page" module. We will add the "Manage tabs" link in the "CMS" sidebox in the back-end if the "Tabs to product details page" module is active.
2. The "Manage tabs" page will have the following functionalities:
- Add new custom tab button
- Delete custom tab button
- Update name of each custom tab button
You will not be able to change the tab background image and border color via the back-end. But we can provide you with instructions so you could perform it by yourself.
3. Also admin will be able to define the following on the tab details page.
- Update tab name
- Edit tab content
4. If the "Tabs to product details page" module is active then product details page will have tabs in the storefront e.g. http://www.megapcs4u...&product_id=899
5. If administrator adds new tab via back-end then it will be automatically displayed on all product details pages in the back-end.
The modification of such complexity will cost $150
A more than fair price, (as usual). Since I really need this mod, I don't have a problem paying for it, however, my budget's tight and I know it will be a useful addition to lots of users. Any chance I can get a couple of you folks to kick in $50 apiece for this?
Thanks,
Mike
Posted 06 February 2007 - 07:56 PM #17
Example I may want Tab#1 to show only on Product 1 and Tab#2 to show only on products2, 3, 4 and Tab#3 to show only on product 5
I'll pitch in as I don't have time anymore to do this myself, it would be nice to have this instead of having to hardcode it everytime. It would be nice if others would step up to the plate and offer to pitch in so we could get the price per person well below $50/ea., who else is in?
Customer Service (Helpdesk) Addon for CS-Cart v4.3.1
Quote and Invoicing Addon for CS-Cart v4.3.1
Posted 06 February 2007 - 08:27 PM #19
Customer Service (Helpdesk) Addon for CS-Cart v4.3.1
Quote and Invoicing Addon for CS-Cart v4.3.1