Testing, Testing...

Working on setting up Javascript Tabs for the sidebar.

Pretty cool.  I'm pushing the envelope a bit to see what I can get away with.  Things might look weird now and then.


Update:

OK, that's pretty cool. Keeps the sidebar nice and clean...altho I'll probably be tweaking what's under each of the tabs.

Not difficult at all either.

You get your necessaries from this site: http://www.barelyfitz.com/projects/tabber/

(1) you copy the tabber.js up to your server. In Movable type there is a 'js' directory under mt-static/ so that's where I pointed to it.

(2) you copy and paste the 'example.css' to the bottom of the stylesheet you are using for your site.

(3) Somewhere between (head) and (/head) on your site's main template you call the java script: Note the path is to where I put it...and the '< and >' are replaced with '( and )' so they would show up on this page.

(script type="text/javascript" src="http://www.the-trainer.com/mt/mt-static/js/tabber.js")
(script type="text/javascript")
(/script)

(4) You nest your content between the tabber tags: Note that the class 'tabber' has the individual content classes of 'tabbertab' nested inside it. You choose which content class to be the default that shows up when people attach to your site...and that's it.

(div class="tabber")
(div class="tabbertab tabbertabdefault" title="Email")
Content1
(/div)
(div class="tabbertab" title="Blogroll")
Content2
(/div)
(div class="tabbertab" title="Recent")
Content3
(/div)
(/div)

It looks like this:

(5) If you want something other than the default 'example.css' for the look of your tabs, you can go to this site and get different looks for your stylesheet.

http://css.maxdesign.com.au/listamatic/

The 'example.css' can always be tweaked also if you've got a bit of skill in this. I found I could fit 4 tabs on my side bar, and I'm sure there is a way to get more on there and still look good, but I haven't gotten to that yet.