Create tabs for Blogger using jquery and id tabs

If the space of your web page is limited and you want to show more content ,what do you do ? In this case ,organizing content as tabs is a good solution . You can see a live demo in recent comment and recent posts section in my blog.

I found a plugin of Jquery named idTabs . With this script ,creating tabs is very simple . In addition ,this plugin has a lot of options for appearance of tabs . This is really awesome tabbing scripts.
to create tabs view with idTabs and Jquery,follow these steps :
1, idTabs is a plugin of Jquery framework ,so it can't work if Jquery is not installed in your web page . Jquery can be found here . Download Jquery and upload it to a host .
In your blogger template ,insert this line after ]]></b:skin>

<script type="text/javascript" src="url..../jquery.js"></script>

remember to change the url of jquery.js to the right
2,Download idTabs script at here . Upload it to a host and paste following line after the line above :

<script type="text/javascript" src="url/jquery.idTabs.min.js"></script>

remember to change the url of jquery.idTabs.min.js to the right
3, To add tabs view to your blogger , open your template in edit HTML mode ,choose where to add tabs and write code as this structure :
<ul class="idTabs">
<li><a href="#tab1">tab 1</a></li>
<li><a href="#tab2">tab 2</a></li>
</ul>
<div id="tab1">content of tab 1</div>
<div id="tab2">content of tab 2</div>

In this structure, any <a href="#tab"> inside of an element with class="idTabs" will show the element with id="tab" .
In this steps ,if you don't want to edit in HTML mode ,you can add a HTML/Javascript widget and paste the code above into widget content.

4, Ok,save template and you are done .

5,If you want to know more about idTabs and other options for tabs view ,you can go to this website . There are some interesting things you can do with this script ,and I hope it is the script you need .