Menurut para pakar internet, salah satu cara untuk meningkatkan lama waktu pembaca berada di blog kita dan menurunkan bouncing rate adalah dengan menampilkan artikel terkait di bawah kiriman blog kita. Banyak cara yang dapat dilakukan untuk menampilkan artikel terkait di bawah kiriman blog kita. Kita bisa menggunakan jasa linkwithin juga. Berikut artikelnya:
Mari kita menuju ke topic pembahasan Cara Membuat Related Post dengan List View. Jika berhasil nantinya akan terlihat seperti gambar diatas
1. Masuk ke akun blogger anda
Pembahasan Related Post dengan List View
Berikut langkah-langkah yang harus dilakukan:1. Masuk ke akun blogger anda
2. Masuk ke Template
3. Lalu pilih Edit HTML
3. Lalu pilih Edit HTML
4. Cari tag atau kode </head> lalu copy paste kode di bawah ini diatas kode </head>.
<style>#related-posts {float : left;width : 540px;margin-top:20px;margin-left : 5px;margin-bottom:20px;font : 11px Verdana;
margin-bottom:10px;}#related-posts .widget {list-style-type : none;margin : 5px 0 5px 0;padding : 0;}#related-posts .widget h2, #related-posts h2 {font-size : 20px;font-weight : normal;margin : 5px 7px 0;padding : 0 0 5px;}#related-posts a {text-decoration : none;}#related-posts a:hover {text-decoration : none;}#related-posts ul {border : medium none;margin : 10px;padding : 0;}#related-posts ul li {display : block;background : url("http://1.bp.blogspot.com/_cNpXRtRph18/SpbSRYurg2I/AAAAAAAAD7Q/ GbYNm2feyIQ/rss.png") no-repeat 0 0;
margin : 0;padding-top : 0;padding-right : 0;padding-bottom : 1px;padding-left : 21px;margin-bottom : 5px;line-height : 2em;border-bottom:1px dotted #cccccc;}#related-posts ul li:hover {background-color:#E2EBF8;
border-top:1px dotted #cccccc;}</style><script src="http://oemar.googlecode.com/files/Related_post _hack.js" type="text/javascript">
Keterangan :
*_* Kode berwarna merah adalah ukuran lebar widget
*_* kode berwarna orange adalah ukuran font dan jenis font yang digunakan
*_* kode berwarna biru adalah url gambar pada bagian kiri judul post
Jika
tidak ada, ini disebabkan oleh kode
setiap template berbeda - beda. Anda dapat mencari kode <div
class='post-body>. Sebenarnya cara ke 6 ini bisa ditempatkan dibagian
template yang anda sukai bila anda cukup mengerti tentang coding. Tapi yang
pasti cari kode <p><data:post.body/></p> saja
dulu. Untuk cara termudah anda bisa menggunakan perintah dengan menekan
tombol CTRL+F di keyboard anda dan masukkan kode yang ingin dicari di kotak
yang tersedia.
6. Setelah mendapatkan kode <p><data:post.body/></p>. Copy-paste kode dibawah ini tepat dibawah kode tersebut.
<b:if cond='data:blog.pageType == "item"'><div id="related-posts"><font face='Arial' size='3'><b>Related Posts : </b></font><font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != "true"'>,</b:if><b:if cond='data:blog.pageType == "item"'><script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels&max-results=5"' type='text/javascript'/></b:if></b:loop> </font><script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();</script></div></b:if>
Keterangan :
*_* Kode berwarna merah adalah jumlah posting yang akan muncul
7. Simpan template anda and you're done.
Last Words
Jadi kesimpulannya, related post terbukti menambah traffik blog anda, jadi amatlah wajib jika anda memasang widget ini dibawah postingan. Sekian post tentang Cara Membuat Related Post dengan List View. Jangan lupa membaca post saya yang lainnya dengan membaca DAFTAR ISI. Maaf bila ada salah-salah kata dan semoga tulisan ini dapat bermanfaat bagi anda :)
AD-BLOCKER DETECTED!
