Home » » Cara membuat Daftar isi atau ( Sitemap ) jquery

Cara membuat Daftar isi atau ( Sitemap ) jquery

Written By Unknown on Monday, October 7, 2013 | 2:48 PM

Cara membuat Daftar isi atau ( Sitemap ) jquery, daftar isi berfingsi untuk memudahkan pengunjung untuk melihat daftar daftar postingan dengan lebih mudah, dan selain itu bisa membuat blog kita menjadi rapih.
untuk contohnya bisa lihat di gambar di bawah ini atau bisa di lihat di blog saya :
Cara Membuat Daftar Isi Atau Archive Jquery
Daftar Isi

Untuk cara pembuatannya, silahkan simak penjelasan berikut ini :
1. Login ke akun blogger kalian
2. Pilih template
3. Edit HTML

Kemudian letakkan kode dibawah ini tepat di atas kode ]]</b:skin>

/* CSS Daftar isi */
#dafis-acc{
font-family:"Trebuchet MS", Tahoma, Verdana, Arial, Helvetica, sans-serif;font-size:12px;color:#333;background:#06DCFB; repeat-y scroll left center #E7F7FB;padding:2px 0;border:1px solid #339DC6;}
.dafis-label{background:#0099FF; repeat-x scroll 0 0 #E1F4FB;font-weight:bold;line-height:1.4em;overflow:hidden;white-space:nowrap;vertical-align: baseline;margin: 1px 3px;outline: none;cursor: pointer;text-decoration: none;padding: 2px 10px;color: #fff;text-shadow: 0 1px 1px rgba(0,0,0,.3);border:1px solid #2F94BA;}
.dafis-label:hover{background:#06DCFB; repeat-x scroll 0 0 #E1F4FB;color:#003366;}
.dafis-daf ol{margin:0 0 0 30px !important;padding:0 !important;}
.dafis-daf ol li{background-color:#C9E9F4;line-height:1.5em;margin:1px 3px !important;white-space:nowrap;text-align:left;border:1px solid #339DC6;}
.dafis-daf ol li a{text-decoration: none !important;color:#333 !important;display:block;padding-left:10px;}
.dafis-daf ol li a:hover{background: #7BC4DF;border-left: 5px #333 solid;padding-left: 5px;text-shadow: 0 1px 1px rgba(0,0,0,.3);}
Kode warna :
Warna Aqua : Kode warna background daftar isi
Warna Merah : Kode warna Tab label daftar isi
Warna Biru : Kode warna Link Hover atau warna link saat dilintasi mouse

Jika di blog anda tidak terpasang script jquery, letakan kode jquery dibawah ini tepat di atas kode </head>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>

Setelah itu simpan template anda.
selanjutnya kita membuat postingan atau bisa juga kita membuat laman.
masuk ke bagian edit HTML di samping Compose pada saat kita membuat postingan atau laman, lalu letakkan kode dibawah ini :

<script src="http://yourjavascript.com/32310134121/dafsis.js" type="text/javascript">
</script>
<script src="http://2egm.blogspot.com/feeds/posts/summary?max-results=1000&amp;alt=json-in-script&amp;callback=loadtoc"></script>
Warna Merah diganti dengan link blog kalian

Setelah itu simpan dan lihat hasilnya.
selesai sampai disini cara membuat daftar isi jquery
Share this article :

Kode Smiley Untuk Komentar


:a   :b   :c   :d   :e   :f   :g   :h   :i   :j   :k   :l   :m   :n   :o   :p   :q   :r   :s   :t

0 comments:

Post a Comment


 
Support : Maskolis | Johny Template | 2eGM | Post RSS | Comment RSS
Copyright © 2013. 2eGM - All Rights Reserved
Template Update by Rendy VXC Published by Mas Template
Proudly powered by Blogger