7 Sep 2011

How to Put/add Tab using Html code to Your Blogger, Ideas

Many bloggers love writing on many topics or might have different blog-posts under different topics or categories. So it is hoped that this post will help those who want to add tabs to their blogger blog as you see on my blog.

How to add tabs to the blog
Let's go step by step and follow the tips and ideas for adding tabs for the blogger blog.
At first you have to give the level name to each of your posts. For instance, you have five blog post on mobile. You can label them 'mobile' or whatever you like.


Secondly after giving labels to all your posts, you need to publish them. Now go to add a gadget to add HTML/ java scripts. Under HTML/ java scripts you have to type this HTML code or you may just copy and paste it the code there which is given below:

<ul>
<li><a href="http://www.xyz.com/">tab E</a></li>
<li><a href="http://www.def.com/">tab F</a></li>
</ul>


Thirdly view your blog and you will find the two tabs, namely 'tab E and tab F'. Now if you want to keep any post in a tab then what you have to do is to click on the label of the post and copy the URL address from the URL navigation search bar and then, go to edit HTML/java script gadget where you pasted the above given code and paste it instead of http://www.xyz.com/ and click save.
For e.g- As I click on one my label, the URL will be displayed on URL add bar. Again, suppose the displayed url add is http://www.jkl.com/search/label then I copy it, and when I paste it instead of http://www.xyz.com/ then my code  will be this.

<ul>
<li><a href="http://www.jkl.com/search/label">tab E</a></li>
<li><a href="http://www.def.com/">tab F</a></li>
</ul>

This will put all your desired posts or labels under tab E.

And Fourthly, naming the tab is the last and easiest  task which gives a final touch to your blog. For the tab again you need to edit the same html/java script and change the name of tab E according to your choice. Suppose, mobile is the desired name then I will type mobile and after typing, the code will be like this.

<ul>
<li><a href="http://www.jkl.com/search/label">mobile</a></li>
<li><a href="http://www.def.com/">tab F</a></li>
</ul>

In this way you can add many tabs to your blog.
Remember, while putting HTML code, you need to be very careful and avoid every mistake.