1.Login to your blogger dashboard--> layout- -> Edit HTML
2.Scroll down to where you see </head> tag .
3.Copy below code and paste it just before the </head> tag .
<link href='http://jqueryui.com/latest/themes/base/ui.all.css' rel='stylesheet' type='text/css'/>
<script src='http://jqueryui.com/latest/jquery-1.3.2.js' type='text/javascript'/>
<script src='http://jqueryui.com/latest/ui/ui.core.js' type='text/javascript'/>
<script src='http://jqueryui.com/latest/ui/ui.tabs.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){
$("#tabs").tabs();
});
</script>
4.Now go to Layout-->Page Element and click on "Add a gadget".
5.Select "html/java script" and add the code given below and click save.
<div id="tabs"> <ul> <li><a href="#fragment-1"><span>One</span></a></li> <li><a href="#fragment-2"><span>Two</span></a></li> <li><a href="#fragment-3"><span>Three</span></a></li> </ul> <div id="fragment-1"> content 1 </div> <div id="fragment-2"> content 2 </div> <div id="fragment-3"> content 3 </div> </div>
You are done .It will look like this:
