Aksesoris Blog

Menambah Aksesoris TabView pada blog kita, saya rasa suatu kebanggaan. bagaimana tidak ?? Bila aksesoris blog tersebut menempel pada blog kita, menambah daya tarik dari blog tersebut, disisi lain juga memudahkan daripada pengunjung untuk melihat semua artikel pada blog kita.

Adapun cara menambah aksesoris blog TabView adalah : seperti biasa Login terlebih dahulu ke Blogger, kemudian masuk ke Layout dan pilih Edit/HTML.



Kemudia, langkah berikutnya :

• Cari kode ini ]]></b:skin>
• Kemudian masukkan kode dibawah ini, diatas tanda ]]></b:skin>

div.TabView div.Tabs

{

height: 24px;

overflow: hidden;

}

div.TabView div.Tabs a

{

float: left;

display: block;

width: 98px;

text-align: center;

height: 24px;

padding-top: 3px;

vertical-align: middle;

-moz-border-radius-topleft:12px;

-moz-border-radius-topright:12px;

border-top: 1px solid #d9e3ff;

border-left: 1px solid #d9e3ff;

border-right: 1px solid #d9e3ff;

border-bottom: 1px solid #d9e3ff;

font-family: "verdana", Serif;

font-weight: 900;

color: #1E62B6;

}

div.TabView div.Tabs a:hover, div.TabView div.Tabs a.Active

{

background-color: #F2F2F2;

}

div.TabView div.Pages

{

clear: both;

border-left: 1px solid #d9e3ff;

border-right: 1px solid #d9e3ff;

border-bottom: 1px solid #d9e3ff;

overflow: hidden;

background-color: #ffffff;

}

div.TabView div.Pages div.Page

{

height: 100%;

padding: 0px;

overflow: hidden;

}

div.TabView div.Pages div.Page div.Pad

{

padding: 3px 5px;

}

• Pasang kode berikut, sebelum </head>

<script src='http://www.geocities.com/damn_lunchix/tabview.js' type='text/javascript'/>

• Save
• Langkah berikutnya, Pilih menu Page Elements ---> Trus Add Gadget ---> pilih yg HTML / JavaScript
• Inilah script yang kamu harus pasang pada gadget kamu, dengan merubah yang kamu butuhkan.

<form action="tabview.html" method="get">

<div id="TabView" class="TabView">

<div style="width: 300px;" class="Tabs">

<a class="Active" href="javascript:tabview_switch('TabView',%201);">Tab One</a>

<a class="" href="javascript:tabview_switch('TabView',%202);">Tab Two</a>

<a class="" href="javascript:tabview_switch('TabView',%203);">Tab Three</a>

</div>

<div style="width: 300px; height: 275px;" class="Pages">

<div style="overflow: auto; height: 274px; display: block;" class="Page">

<div class="Pad">

<ol>


<li><a href="Your Link Here">Your Link Name </a></li>
<li><a href="Your Link Here">Your Link Name </a></li>
<li><a href="Your Link Here">Your Link Name </a></li>
<li><a href="Your Link Here">Your Link Name </a></li>
<li><a href="Your Link Here">Your Link Name </a></li>
<li><a href="Your Link Here">Your Link Name </a></li>
<li><a href="Your Link Here">Your Link Name </a></li>
<li><a href="Your Link Here">Your Link Name </a></li>
<li><a href="Your Link Here">Your Link Name </a></li>
<li><a href="Your Link Here">Your Link Name </a></li>
<li><a href="Your Link Here">Your Link Name </a></li>
<li><a href="Your Link Here">Your Link Name </a></li>
<li><a href="Your Link Here">Your Link Name </a></li>
<li><a href="Your Link Here">Your Link Name </a></li>
<li><a href="Your Link Here">Your Link Name </a></li>
<li><a href="Your Link Here">Your Link Name </a></li>
<li><a href="Your Link Here">Your Link Name </a></li>
<li><a href="Your Link Here">Your Link Name </a></li>
<li><a href="Your Link Here">Your Link Name </a></li>
<li><a href="Your Link Here">Your Link Name </a></li>
<li><a href="Your Link Here">Your Link Name </a></li>

</ol>

</div>

</div>

<div style="overflow: auto; height: 274px; display: none;" class="Page">

<div class="Pad">

<ol>

<li><a href="Masukkan link postingan kamu disini">Nama Postingan </a></li>
<li><a href="Masukkan link postingan kamu disini">Nama Postingan </a></li>
<li><a href="Masukkan link postingan kamu disini">Nama Postingan </a></li>
<li><a href="Masukkan link postingan kamu disini">Nama Postingan </a></li>
<li><a href="Masukkan link postingan kamu disini">Nama Postingan </a></li>
<li><a href="Masukkan link postingan kamu disini">Nama Postingan </a></li>
<li><a href="Masukkan link postingan kamu disini">Nama Postingan </a></li>
<li><a href="Masukkan link postingan kamu disini">Nama Postingan </a></li>
<li><a href="Masukkan link postingan kamu disini">Nama Postingan </a></li>
<li><a href="Masukkan link postingan kamu disini">Nama Postingan </a></li>
<li><a href="Masukkan link postingan kamu disini">Nama Postingan </a></li>
<li><a href="Masukkan link postingan kamu disini">Nama Postingan </a></li>
<li><a href="Masukkan link postingan kamu disini">Nama Postingan </a></li>
<li><a href="Masukkan link postingan kamu disini">Nama Postingan </a></li>
<li><a href="Masukkan link postingan kamu disini">Nama Postingan </a></li>
<li><a href="Masukkan link postingan kamu disini">Nama Postingan </a></li>
<li><a href="Masukkan link postingan kamu disini">Nama Postingan </a></li>
<li><a href="Masukkan link postingan kamu disini">Nama Postingan </a></li>
<li><a href="Masukkan link postingan kamu disini">Nama Postingan </a></li>
<li><a href="Masukkan link postingan kamu disini">Nama Postingan </a></li>
<li><a href="Masukkan link postingan kamu disini">Nama Postingan </a></li>
<li><a href="Masukkan link postingan kamu disini">Nama Postingan </a></li>
<li><a href="Masukkan link postingan kamu disini">Nama Postingan </a></li>
<li><a href="Masukkan link postingan kamu disini">Nama Postingan </a></li>


</ol>

</div>

</div>

<div style="overflow: auto; height: 274px; display: none;" class="Page">

<div class="Pad">

<ol>

<script style="text/javascript" src="http://kendhin.890m.com/comments.js"></script><script style="text/javascript">var a_rc=8;var m_rc=false;var

n_rc=true;var o_rc=40;</script><script

src="http://aksesorisblogs.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments"></script>

</ol>

</div>

</div>

</div>

</div>

</form>

<script type="text/javascript">

tabview_initialize('TabView');

</script>

Thanks to Kendhin