Rabu, 03 November 2010

Membuat Daftar Isi Manual di Blog

Membuat daftar isi secara manual, tujuannya untuk memperlihatkan sebagian posting yang mungkin dianggap penting untuk dilihat/dibaca  pengunjung blog kita.Memang sedikit ribet, karena kita sendiri yang memasukannya ke daftar isi. Contoh seperti di bawah ini:


DAFTAR ISI
Membuat Akun Google (Gmail)
Merubah Warna dan Huruf di Template Minima
Membuat Postingan Rata Kiri Kanan
Mengganti URL Alamat Blog Sub Domain Blogger.com
Daftar URL Blog ke Mesin Pencari (Search Engine)
Membuat Read More Otomatis di posting Blog
Arsip Blog Model Scroll
Mengganti Tulisan Newer Post, Home, Older Post dengan Icon/Gambar

Dan ini proses pembuatannya:

DAFTAR ISI

<a href="http://info-terkumpul.blogspot.com/2010/08/membuat-akun-google-gmail.html">Membuat Akun Google (Gmail)</a>
<a href="http://info-terkumpul.blogspot.com/2010/08/merubah-warna-dan-huruf-di-template.html">Merubah Warna dan Huruf di Template Minima</a>
<a href="http://info-terkumpul.blogspot.com/2010/08/membuat-postingan-rata-kiri-kanan.html">Membuat Postingan Rata Kiri Kanan</a>
<a href="http://info-terkumpul.blogspot.com/2010/08/mengganti-url-alamat-blog-sub-domain.html">Mengganti URL Alamat Blog Sub Domain Blogger.com</a>
<a href="http://info-terkumpul.blogspot.com/2010/09/daftar-url-blog-ke-mesin-pencari-search.html">Daftar URL Blog ke Mesin Pencari (Search Engine)</a>
<a href="http://info-terkumpul.blogspot.com/2010/09/membuat-read-more-otomatis-di-posting.html">Membuat Read More Otomatis di posting Blog</a>
<a href="http://info-terkumpul.blogspot.com/2010/09/arsip-blog-model-scroll.html">Arsip Blog Model Scroll</a>
<a href="http://info-terkumpul.blogspot.com/2010/10/mengganti-tulisan-newer-post-home-older.html">Mengganti Tulisan Newer Post, Home, Older Post dengan Icon/Gambar</a>

Silahkan ganti link-nya dengan link milik kita dan ganti juga judul posting (tulisan warna merah).

Daftar isi yang jumlahnya sedikit, tak menjadi masalah. Apabila jumlanya banyak tentu akan menghabiskan tempat dan kurang bagus dilihatnya. Maka kita perlu membuat Daftar Isi Manual dengan model scroll.
Kita tinggal menambahkan kode script di awal dan di akhir daftar isi. Seperti di bawah:

<div style="border: 1px solid rgb(238, 238, 238); height: 100px; overflow: auto; padding: 5px; width: 250px;">DAFTAR ISI</div>

Misalnya

<div style="border: 1px solid rgb(238, 238, 238); height: 100px; overflow: auto; padding: 5px; width: 250px;">
<a href="http://info-terkumpul.blogspot.com/2010/08/membuat-akun-google-gmail.html">Membuat Akun Google (Gmail)</a>
<a href="http://info-terkumpul.blogspot.com/2010/08/merubah-warna-dan-huruf-di-template.html">Merubah Warna dan Huruf di Template Minima</a>
<a href="http://info-terkumpul.blogspot.com/2010/08/membuat-postingan-rata-kiri-kanan.html">Membuat Postingan Rata Kiri Kanan</a>
<a href="http://info-terkumpul.blogspot.com/2010/08/mengganti-url-alamat-blog-sub-domain.html">Mengganti URL Alamat Blog Sub Domain Blogger.com</a>
<a href="http://info-terkumpul.blogspot.com/2010/09/daftar-url-blog-ke-mesin-pencari-search.html">Daftar URL Blog ke Mesin Pencari (Search Engine)</a>
<a href="http://info-terkumpul.blogspot.com/2010/09/membuat-read-more-otomatis-di-posting.html">Membuat Read More Otomatis di posting Blog</a>
<a href="http://info-terkumpul.blogspot.com/2010/09/arsip-blog-model-scroll.html">Arsip Blog Model Scroll</a>
<a href="http://info-terkumpul.blogspot.com/2010/10/mengganti-tulisan-newer-post-home-older.html">Mengganti Tulisan Newer Post, Home, Older Post dengan Icon/Gambar</a>
</div>


Hasilnya seperti di bawah:



Sesuaikan height: dan  width: dengan ukuran sidebar kita.

Terakhir simpan.
Selesai

Tidak ada komentar:

Posting Komentar