Use Tabs in Your Blog!

Some Premium WordPress themes have jQuery tabs in the original. But if you have a non-premium theme you can easily apply this tabs in your theme. You integrate 1 js file and 1 css file in your theme and some code :) Let’s Begin…

Here is the code and files;

Firstly Download this file for the begining. There are 2 css files in this zip archive. Upload these files in yout theme directory and just add these code in your themes header.php above the </head> tag;

<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/domtab.js"></script>
<link rel="stylesheet" type="text/css" href="<?php bloginfo('template_directory'); ?>/domtab.css" media="screen" />

After that we will make our tabs. Just copey this code and paste it into your sidebar;

<div class="domtab">
<ul class="domtabs">
<li><a href="#t1">Tab 1</a></li>
<li><a href="#t2">Tab 2</a></li>
<li><a href="#t3">Tab 3</a></li>
</ul>
<div>
<a name="t1" id="t1"></a>
<p>Insert contents of the first tab here,
e.g. The code for a plugin.</p>
</div>
<div>
<a name="t2" id="t2"></a>
<p>Insert contents of the second tab here.</p>
</div>
<div>
<a name="t3" id="t3"></a>
<p>Insert contents of the third tab here.</p>
</div>
</div>

You can make changes for your interests. That’s All. Thanks to Blog-oh-Blog for this code.


Related posts:

If you enjoyed this post, make sure you subscribe to my RSS Feed
Comments are closed.
Highslide for Wordpress Plugin