Cara Membuat Related Post atau Postingan Terkait

Cara Membuat RelatedPost - Sobat yang baru belajar blog dasar tentunya masih belum paham kegunaan pasang related post atau postingan terkait. Dengan memasang relatedpost ini bisa meningkatkan pageview blogger dan tentunya memberi keuntungan pada sobat. Namun sebelum kita bahas kode yang akan dipasang untuk membuat related post tersebut. mari kita belajar maksud dari related post sendiri.

Apa itu Related Post??
Related Post adalah postingan terkait yang biasanya muncul dibawah postingan yang dibaca oleh pengunjung. Related post berfungsi untuk merangsang rasa ingin tau pengunjung, karena jika pengunjung membaca suatu posting dan di bawahnya tampil postingan yang berkaitan maka mudah-mudahan juga pengen membaca artikel itu (diklik untuk dibaca) sehingga efeknya akan meningkatkan page view alexa rank atau peringkat alexa rank

Langsung aja ya kita buat related post, Toko Blog akan mencoba mengulasnya untuk sahabat terkasih.

1. Login blogger sobat dan Pilih Rancangan - Edit HTML.

2. Jangan lupa backup template anda dulu dengan mengklik Download Template Lengkap.

3. Klik Expand Template Widget.

4. Cari kode </head> (klik CTRL+F supaya cepat ketemu)

5. Kemudian letakkan kode di bawah ini, tepat 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(&quot;http://1.bp.blogspot.com/_cNpXRtRph18/SpbSRYurg2I/AAAAAAAAD7Q/ GbYNm2feyIQ/rss.png&quot;) 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'/>

6. Cari kode <p><data:post.body/></p>  (klik CTRL+F)
    kode belum tentu sama persis. Cari yang mendekati kode tersebut

7. Copy kode di bawah ini dan letakkan tepat di bawah kode <p><data:post.body/></p>

<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 != &quot;true&quot;'>,</b:if><b:if cond='data:blog.pageType == &quot;item&quot;'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=5&quot;' type='text/javascript'/></b:if></b:loop> </font>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
</script>
</div></b:if>


8. Setelah selesai semua, jangan lupa Simpan Template.


Untuk mengganti jumlah related posts-nya, silahkan edit maxresults=5, ganti angka 5 dengan angka yang sesuai lebar postingan blog  anda. Cukup mudah bukan cara membuat relatedpost atau postingan terkait di blogspot anda.