Kita sering menjumpai pada banyak blog ketika kita mengklik tabel
atau category postingan yang tampil sangat banyak sesuai dengan
banyaknya postingan yang diberi label yang kita klik dan parahnya jika
blog tersebut tidak menggunakan readmore sehingga loading page akan
sangat lama dan berat, nah untuk solusinya kita bisa terapkan trik
berikut yang
hanya menampilkan judul posting ketika diklik:
Login dulu pada
Blogger
Pilih Layout/Tata Letak kemudian Edit HTML -----> centang Expand Template Widget
Cari kode berwarna merah yang penempatannya kayak gini niih:
<div class='blog-posts feed'>
<b:include data='top' name='status-message'/>
<data:adStart/>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><data:post.dateHeader/></h2>
</b:if>
<b:include data='post' name='post'/>
Kalo kode warna merah gak ketemu bisa cari kode berikut:
<b:include data='post' name='post'>
Kalau sudah ketemu ubah kode tadi dengan kode berikut
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'>
<data:post.title/></a><br/><br/>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
Jangan lupa simpan template
Panjang amat judulnya? Sebelumnya saya pernah posting trik cara
hanya menampilkan judul posting ketika label atau category diklik, untuk trik kali ini
cara memodifikasi tampilan judul posting tersebut dengan
memberikan background pada judul postingnya seperti contoh pada gambar disamping. Tapi trik ini bisa dilakukan kalau sobat sudah melaksanakan trik sebelumnya.
Berikut langkah langkahnya:
Login ke Blogger kemudian Layout/Tata Letak terus Edit HTML
- Centang pada kotak kecil disamping Expand Template Widget
- Cari kode yang berwarna merah, ingat kode ini hanya terlihat jika trik sebelumnya sudah anda lakukan,
<b:if cond='data:blog.homepageUrl !=
data:blog.url'>
<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'>
<data:post.title/></a><br/><br/>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
3. Selanjutnya ganti kode yang berwarna merah tadi dengan kode berikut ini:
<div style='padding:6px 0 6px 5px;border-right:1px solid #000;border-bottom:1px solid #000;margin-bottom:2px;background:#0099DD;color:#000000;'>
<data:post.title/></div></a>
Note: Ganti kode warna yang berwarna hijau dengan warna yang Anda sukai.Tapi
jika ingin juga menambahkan icon di depan title postingan, sobat
tinggal menambahkan kode gambar ke dalamnya kode diatas, selengkapnya,
sobat dapat mengganti kode tadi dengan kode berikut:
<div
style='padding:6px 0 6px 5px;border-right:1px solid
#000;border-bottom:1px solid
#000;margin-bottom:2px;background:#0099DD;color:#000000;'>
<img alt='>>>' border='0' src='alamat gambar icon anda letakkan disini'/>
<data:post.title/></div></a>
4. Oke, tinggal simpan template!!!
Semoga berhasil dan bermanfaat!
