Thủ thuật tạo mutiltab cho Blogger

Thủ thuật tạo mutiltab cho Blogger

1.Đăng nhập vào Blog--> Bố cục- -> Chỉnh HTML(không mở rộng mẫu tiện ích)
2.Tìm (Ctrl + F) ]]></b:skin>
Dán code sau vào trước thẻ ]]></b:skin>

.widgets{width:100%; overflow:hidden; margin-top:5px; padding:0px 0px 0px 0px; background:#FFF; border:1px solid #ccc}

.widgets a{color:#222; text-decoration:none}

.widgets a:hover{color:#009; text-decoration:underline}

ul.tabnav{padding:0px 0px 0px 0px; height:27px; margin:0px 0px}

.tabnav li{display:inline; list-style:none; float:left; text-align:center; margin-right:4px}

.tabnav li a{text-decoration:none; text-transform:uppercase; font-weight:normal; padding:5px 8px; width:90px; line-height:18px; font-weight:bold; font-family:Century gothic,Arial,sans-serif; color:#262B2F; text-decoration:none; display:block}

.tabnav li a:hover, .tabnav li a:active, .tabnav li.ui-tabs-selected a{text-decoration:none; background:url(none/catm.pg) repeat-x; color:#0283C7}

.tabdiv{margin-top:2px; padding:5px 5px 5px 5px; font-family: Tahoma,Georgia,Century gothic,Arial,sans-serif; background:#EBF3FB}
.tabdiv a:link, .tabdiv a:visited{color:#333}
.tabdiv a:hover{color:#2676A1}
.tabdiv ul{list-style-type:none; margin:0px 0px; padding:0px 0px}

.tabdiv ul li{height:100%; line-height:28px; padding:0px 0px 0px 0px; color:#333; border-bottom:1px dotted #61696F}
.tabdiv li a:link, .tabdiv li a:visited{margin-left:5px; overflow:hidden; height:18px; line-height:24px; padding:0px 0 0px 0px; margin:3px 0px; color:#99A6AF; font-size:13px}

.tabdiv li a:hover{background:url(none/la.jpg) no-repeat; color:#fff; text-decoration:none}
.ui-tabs-hide{display:none}

.tagcloud{width:300px; float:left; height:100%; padding:5px 15px; margin:0px 0px; background:#fff url(YOUR-IMAGE-HOSTING-LOCATION-HERE/tbody.jpg) repeat-y; font-family:Tahoma,Century gothic,verdana,Arial, sans-serif}

.tagcloud a:link, .tagcloud a:visited{color:#0282D9}
.tagcloud a:hover{color:#BC0C0F}

Bạn có thể chỉnh màu sắc nền ,màu chữ,v.v sao cho phù hợp với Blog của bạn.Như mình chỉnh màu trùng với màu chính của Blog nên rất dễ nhìn...
3.Download các mã sau về và up lên host của bạn

hoverIntent.js
jquery-1.2.6.min.js
jquery-ui-personalized-1.5.2.packed.js
scroll.js
sprinkle.js
spy.js

(gợi ý host free mà cho up file JS ...Host

Bây giờ tìm thẻ sau </head>

Dán đoạn code với các đường dẫn chính xác mã Js vào trước thẻ </head>

<script src='http://YOUR-USER-NAME.110mb.com/jquery-1.2.6.min.js' type='text/javascript'/>
<script src='http://YOUR-USER-NAME.110mb.com/jquery-ui-personalized-1.5.2.packed.js' type='text/javascript'/>
<script src='http://YOUR-USER-NAME.110mb.com/sprinkle.js' type='text/javascript'/>
<script src='http://YOUR-USER-NAME.110mb.com/hoverIntent.js' type='text/javascript'/>
<script src='http://YOUR-USER-NAME.110mb.com/scroll.js' type='text/javascript'/>

4.Tìm dòng sau <div id='sidebar-wrapper'>

Chèn đoạn code ngay dưới nó

<div class='widgets' id='tabzine'>

<ul class='tabnav'>
<li class='pop'><a href='#popular'> Recent</a></li>
<li class='fea'><a href='#tags'> Labels </a></li>
<li class='rec'><a href=' #recent'> Followers </a></li>
</ul>

<div class='tabdiv' id='popular'>
<b:section class='cahaya13' id='cahaya16' showaddelement='yes'>
<b:widget id='HTML144' locked='false' title='Recent Post' type='HTML'/>
</b:section>
</div>
<div class='tabdiv' id='tags'>
<b:section class='cahaya4' id='cahaya4' showaddelement='yes'>
<b:widget id='Label122' locked='false' title='Labels' type='Label'/>
</b:section>
</div>

<div class='tabdiv' id='recent'>
<b:section class='cahaya13' id='cahaya14' showaddelement='yes'>
<b:widget id='Followers152' locked='false' title='Followers' type='Followers'/>
</b:section>
</div>

</div>
<p><font><b>created by</b></font> <a href="http://blogger.com/" target="_BLANK" name="blogger">com</a></p>

Rồi save lại...
Tiếp xong sang Phần tử trang ( tab ngang với Chỉnh sửa HTML)
Bạn chọn và tùy chỉnh 3 cái phần tử trang mới ( Recent,Tag,Follower) là được.(thêm,sửa,xóa ..cái này chắc các bạn đã biết rồi)

Quan trọng nhất vẫn là bước 2 vì nó giúp phần tử của bạn hòa chung với theme mà ko bị "nổi bật" lên
Chúc thành công

Tham khảo thêm tại đây