Kamis, 15 September 2011

Daftar isi blog lengkap Bagian 3

Assalamualaikum ..
malam ini saya mau kasih tutorial cara buat daftar isi blog otomatis, hehehhe .. lagi lagi cara buat daftar isi, barusan tadi siang daftar isi bagian dua, malam ini daftar isi blog otomatis bagian 3 .. hihihi



LIHAT DEMO nya DISINI

Masuk ke akun blogger
Buka Design/Rancangan
Di Page Elemen/Elemen Laman, klik add a gadget (tempat terserah, dimana saja bisa)
Pilih HTML Javascript, atau juga bisa di new artikeL dan masukkan kode ini

kode:
<div class='widget-content'>
<style type="text/css">
.japarusdaftarisi3_CommBox, .japarusdaftarisi3_CommBox-cumulus, .Label .widget-content {background:#000 url(http://a1.sphotos.ak.fbcdn.net/hphotos-ak-ash2/33788_1489035352941_1445695888_31030325_6016615_n.jpg) bottom center repeat;border:5px groove #666;font:Droid normal;font-size:10px;color:#CCFFFF;border-radius:8px;-moz-border-radius:8px;-webkit-border-radius:8px;-o-transition:all 2s ease-in;-moz-transition: all 2s ease-in;-webkit-transition:all 2s ease-in;}
.japarusdaftarisi3_CommBox-cumulus {float: left;margin: 5px; opacity: 0.2;filter:alpha(opacity=20);}
.Label .widget-content {margin: 20px auto;width: 285px;height: 250px;overflow: auto; opacity: 0.2;filter:alpha(opacity=20);}
.japarusdaftarisi3_CommBox { overflow:auto;height:200px; padding:15px 10px 10px 0;opacity:0.1;}
.japarusdaftarisi3_CommBox:hover, .japarusdaftarisi3_CommBox-cumulus:hover, .Label .widget-content:hover{opacity:1.0; filter:alpha(opacity=100);}
.japarusdaftarisi3_CommBox a{color:#cb5d03;font-size:12px;font-weight:bold;text-decoration:none;}
.japarusdaftarisi3_CommBox a:hover{text-decoration:underline;color:#33FF00;font-style:normal;}
</style>
<p style="font-family:Staccato222 BT;font-size:22px;color:888;margin:10px;text-align:center;">Dafatr Isi</p>
<div class="japarusdaftarisi3_CommBox">
<script src="http://japaruspunya.xtgem.com/js/sitemapdaftarisi.js">
</script>
<script src="http://japarus.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc">
</script></div>
</div>


dan simpan ..

NB: dibagian http://japarus.blogspot.com/ ganti dengan alamat blog anda

0 komentar:

Poskan Komentar