Add tabs to a "shortcuts"-style pop-out box

For discussion and questions related to CMS Specific templates and stylesheets (CSS), and themes. or layout issues. This is not a place for generic "I don't know CSS issues"
Locked
bogofoo

Add tabs to a "shortcuts"-style pop-out box

Post by bogofoo »

I've just started developing a site with version 1.0-beta5 for a local volleyball club. I really like the effect achieved by the "shortcuts" pop-out tab in the admin pages and I would like to implement something like this on our page to show the club's schedule information.

Ideally the club would have several different groups of schedules so adding tabs within this pop-out div would be perfect (a tab for each team for instance). The "shortcuts" popout looks like its ready to have tabs implemented (based on the existence of a navt_tabs id) and I discovered that just adding another div within my template creates another tab. However I'm unsure of how to hide and show the tabs properly. Browsing the standard.js script functions and the admin pages css gave me some hints. I see that the "activatetab" function applies to the navt_tabs and I'm guessing part of the _add_show_handlers does what I need to do I'm just looking for a few pointers on how to put it all together.

For illustrative purposes the development site is www.trianglevolleyball.org/cmsmadesimple and right now it has the "shortcuts" popout showing schedule info.

Thanks in advance
-Andy

UPDATE INCLUDING SOLUTION:

Well I feel smart and stupid and the same time... something about reading and using good code does that ;D In case anyone is interested (since I found it educational) the solution to what I was doing is to simply append "_c" to the div id that holds the content associated with the tab in question... so for two tabs, one called "YVP" and one called "Practice" I use the following in the template:





YVP
Practice




{global_content name='events'}


Practice Content here






the div id "bookmarks" reflects the fact that I just copied code from the admin pages, it can be named anything since none of the css refers to "navt_bookmarks".

Next I'll extend this to a few more tabs but what a relief to find that a) a solution was built in b) the solution was easy to discover by reading existing code and c) it does exactly what I want it to. Major Kudos to all you developers for such smart design and execution, CMS is a joy to work with (having tried at least 8 systems before finding CMSMS)! Keep up the good work.

-Andy
Last edited by bogofoo on Thu Aug 31, 2006 12:52 am, edited 1 time in total.
User avatar
Dr.CSS
Moderator
Moderator
Posts: 12711
Joined: Thu Mar 09, 2006 5:32 am

Re: Add tabs to a "shortcuts"-style pop-out box

Post by Dr.CSS »

Cool works nice, as long as visitors have java enabled  ;)
bogofoo

Re: Add tabs to a "shortcuts"-style pop-out box

Post by bogofoo »

good point, I'll make sure that the content available in the pullout menu is duplicated elsewhere in the site for those w/o java enabled.
Locked

Return to “Layout and Design (CSS & HTML)”