How To Add Multitab widget on Blogger




In some blogs and websites there a gadgets occupy huge amount of space on the sidebars.Due to which the visitors to feel many gadgets on the sides.Sometimes it may take sometime to load the page.So,friends here is the Multi tab widget or gadgets ,which make the your gadgets to like look like menu with Headings.Your blogger visitor can select widget as he like.

Procedure to add the Multi tab Content widget for blogger

► Go to blogger
► Design(page elements) or Layout

(Note*: Learn more about essential safety before Editing  theme )

► Add a gadget—>> Html/java script –>>
► Add Below code in the empty box (Please don’t write any gadget title name,leave the title box empty)

<style type="text/css">
.tabber {
padding: 0px !important;
border: 0 solid #bbb;
.tabber h2 {
float: left;
margin: 0 1px 0 0;
font-size: 12px;
padding: 3px 5px;
border: 1px solid #bbb;
margin-bottom: -1px; /*--Pull tab down 1px--*/
overflow: hidden;
position: relative;
background: #e0e0e0;
html .tabber {
background: #fff;
border-bottom: 1px solid #fff; /*--"Connect" active tab to its content--*/
.tabber .widget-content {
border: 1px solid #bbb;
padding: 10px;
background: #fff;
.codewidget, #codeholder {

<script type="text/javascript" src=""></script>
<script type="text/javascript" src=""></script>
<script type="text/javascript">
$(document).ready(function() {
$('#codeholder').bloggerTabber ({
tabCount : 3

<!-- to make sure the widget works, do not alter the code below -->
<div id='codeholder'><p>Get this <a href="" target="_blank">widget</a></p></div>

► Save Gadget and Go to part 2.

How to arrange Multi tab content widget

Leave a Reply

%d bloggers like this: