Daftar Isi bagi sebuah blog, menurut saya merupakan elemen yang
penting dalam sebuah web. Karena ini bisa menjadi 'shortcut', bila
pengunjung ingin mengetahui seluruh konten blog, atau mencari artikel yang
sesuai dengan kebutuhan mereka.
Ada banyak cara untuk membuat daftar Isi. Seringkali, banyak yang menggunakan JavaScript. Memang menggunakan JavaScript akan menghasilkan Daftar Isi yang baik dan bisa dibuat per kategori. Namun, bila blog kita sudah banyak dipenuhi JavaScript, maka tentu penambahan 1 JavaScript lagi, akan memperlambat loading blog.
Nah, pada posting ini saya mencoba menjelaskan Cara Membuat Daftar isi Pada Blog secara sederhana, yaitu dengan langkah-langkah dibawah ini :
Ada banyak cara untuk membuat daftar Isi. Seringkali, banyak yang menggunakan JavaScript. Memang menggunakan JavaScript akan menghasilkan Daftar Isi yang baik dan bisa dibuat per kategori. Namun, bila blog kita sudah banyak dipenuhi JavaScript, maka tentu penambahan 1 JavaScript lagi, akan memperlambat loading blog.
Nah, pada posting ini saya mencoba menjelaskan Cara Membuat Daftar isi Pada Blog secara sederhana, yaitu dengan langkah-langkah dibawah ini :
- Login ke Dashboard --> Layout --> Edit HTML
- Centang "Expand Widget Templates"
- Cari kode berikut :
<b:include data='post' name='post'/>
- Ganti kode di atas dengan kode di bawah :
<b:if
cond='data:blog.homepageUrl !=data:blog.url'>
<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'>
<div style="padding:6px 0 6px 5px;border-right:1px solid #ccc;border-bottom:1px solid #ccc;margin-bottom:2px;background:#EAE9E9;color:#406A0E;">
<data:post.title/></div></a>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'>
<div style="padding:6px 0 6px 5px;border-right:1px solid #ccc;border-bottom:1px solid #ccc;margin-bottom:2px;background:#EAE9E9;color:#406A0E;">
<data:post.title/></div></a>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
- Simpan/Save Templates
- Klik menu Layout. Klik Add a Gadget. Pilih "HTML/JavaScript".
- Copy kode di bawah dan Paste ke ruangan yang tersedia
<a href="http://NamaBlogAnda.blogspot.com/search?max-results=300">Show
all post »»</a>
Note : Ganti NamaBlogAnda dengan nama blog Anda dan Anda bisa mengubah nilai max-results=300 untuk menampilkan berapa yang akan ditampilkan.
- Save. Selesai.
Note
2: Jika Anda ingin langsung meletakkan
link "Daftar Isi" di menu bar blog, maka letakkan search?max-results=300 pada
link menu.
Contoh : Jika link menu daftar isi semula :<li><a href='http://NamaBlogAnda.blogspot.com/p/daftar-isi.html'>Daftar Isi</a></li>
maka ubah jadi seperti di bawah :
<li><a href='http://NamaBlogAnda.blogspot.com/search?max-results=300'>Daftar Isi</a></li>
nah bagitulah caranya. semoga bermanfaat.
Contoh : Jika link menu daftar isi semula :<li><a href='http://NamaBlogAnda.blogspot.com/p/daftar-isi.html'>Daftar Isi</a></li>
maka ubah jadi seperti di bawah :
<li><a href='http://NamaBlogAnda.blogspot.com/search?max-results=300'>Daftar Isi</a></li>
nah bagitulah caranya. semoga bermanfaat.
Post a Comment