Monday, April 2, 2012

Cara Menambahkan Related Post di Bawah Postingan Blog

Memudahkan pengunjung untu melihat artikel lain di blog kita adalah salah satu cara untu meningkatkan pageview blog atau website yang kita buat. Jika artikel yang ada di related post merupakan salah satu artikel yang sedang dicari oleh pengunjung blog kita, bukankah itu merupakan sesuatu hal yang hebat? Bayangkan saja jika seorang pengunjung membaca artikel di blog kita lebih dari satu artikel maka pageview yang kita dapat juga akan banyak kan?..Untuk itulah perlunya membuat related post di bawah setiap artikel kita.


Apa itu Related Post?

Related post adalah daftar dari posting terkait yang biasanya berada di bawah artikel. Related post atau posting terkait sangat berguna untuk meningkatkan jumlah pageview dari blog kallian. Fitur Related post sendiri tidak langsung disediakan oleh pihak blogger / blogspot. Oleh karena itu, kalian harus membuatnya sendiri dengan cara menambahkan beberapa script dengan memodifikasi template blogger kalian agar tempaltenya menjadi SEO Friendly.

Cara Membuat Related Post di Artikel kita
Berikut ini cara pasang related post by category untuk blogspot atau blogger platform:


  • Login ke blogger. masuk ke menu “Desain“(Layout) -> Edit HTML
  • Backup/simpan template untuk jaga-jaga.
  • Centang kotak “Expand Widget Templates“
  • Cari kode </head>, lalu ganti/timpa dengan dengan kode dibawah ini:

<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(“https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFhJTAahDrEN7RXEc_9IaZACWcaat5aKhZD4AyW_1B_oLghGVNP3lw-dvGM0wPZaQ32MN_rn3vT92zUwNKDvyW8W7w06VL4tJJlkJlMK9-BKTNLXdOdBKpcoSLoe9_g9CeCQgwB5ItIug/”) 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; } </style> <script src=’http://yourjavascript.com/1621109274/related post.js’ type=’text/javascript’/>
</head>

  • Lalu cari kode <data:post.body/>, kemudian ganti/timpa dengan kode dibawah ini:

<data:post.body/>
<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>

  • Selanjutnya simpan template. Untuk hasilnya lihat diblog ini dibawah setiap artikel.

Untuk merubah berapa artikel ditampilkan ganti nilai max-results=5 pada kode no.5, bagi yang berminat silahkan dicoba. Kembali ke atas

No comments: