Catatan pribadi tentang artikel Islami, kesehatan, pendidikan, petualangan, hobi, olahraga dan unik.
Friday, March 4, 2016
Cara Membuat Scroll pada Arsip Blog
Semua artikel yang ada di blog kita akan mudah ditemukan oleh para pengguna hanya dengan menavigasi sitemap ini.Ini lebih sempurna jika dibandingkan dengan sitemap model lain, misalnya daftar isi yang memanfaatkan rss feeds blog untuk memanggil artikel terbaru.
Karena teknik tersebut hanya terbatas pada artikel terbaru saja yang akan tampil di daftar isi, biasanya maksimal 100-125 artikel terbaru saja. Lagi pula jika koneksi internet pengguna lambat, maka daftar isi yang seperti itu tidak bisa tampil.
Namun dengan teknik yang satu ini, yaitu meletakkan blog archive pada kotak scroll di sidebar, maka semua artikel yang ada di blog akan bisa ditemukan semuanya tanpa terkecuali. Artikel pertama dan terakhir akan tampak disitu.
Selain itu akan membuat blog kita lebih rapi dan ringkas karena deretan archive artikel yang panjang akan dikemas ke dalam kotak scroll naik turun.
Dan yang lebih untung lagi teknik ini sangat baik dalam hal seo (search engine optimization). Karena banyak link internal yang tertaut di sidebar yang nantinya akan ikut tersimpan di indeks mesin pencari atau search engine. Sehingga blog kita mudah ditemukan oleh para pengguna internet atau netter.
Tampilannya bisa juragan lihat seperti gambar dibawah ini.
Sekarang kita mulai caranya;
1. Langsung saja pergi menuju dasbor blogger, buka HTML template, dan cari kode ini;
‘ArchiveList’
2. Jika sudah ketemu, copy kode dibawah ini dan pastekan tepat di atas ‘ArchiveList’
<div style=’overflow:auto; width:ancho; height:250px;’>
3. Satu lagi, lihatlah kode <b:include name=’quickedit’/> yang ada dibawahnya. Lalu tambahkan kode </div> tepat di atasnya.
* Maka hasilnya akan seperti dibawah ini
<div style=’overflow:auto; width:ancho; height:250px;’>
<div id=‘ArchiveList’>
<div expr:id=’data:widget.instanceId + "_ArchiveList"’>
<b:if cond=’data:style == "HIERARCHY"’>
<b:include data=’data’ name=’interval’/>
</b:if>
<b:if cond=’data:style == "FLAT"’>
<b:include data=’data’ name=’flat’/>
</b:if>
<b:if cond=’data:style == "MENU"’>
<b:include data=’data’ name=’menu’/>
</b:if>
</div>
</div></div>
<b:include name=’quickedit’/>
Note: 250 adalah tingginya. Sesuaikan sesuka anda.
4. Klik Preview/Pratinjau. Jika oke, klik Simpan dan lihat hasilnya. Begitulah.
Terima kasih,
Semoga bermanfaat,
Ded Lee