Cara Mudah Memasang Related Post / Artikel Terkait Dengan Gambar

Cara Memasang Related Post / Artikel Terkait di Blog - Selamat Malam sobat semua, Alhamdulillah saya bisa share lagi buat sobat yang lagi membutuhkan, semoga bermanfaat.. pada kesempatan yang baik ini saya akan mencoba untuk memberikan tutorial bagaimana cara memasang related post / artiekl terkait di bawah posting blog.

Relates Post /  artikel terkait hampir ada di semua blog baik bergambar maupun tidak, banyak manfaat kalau di sebuah blog ada "related post"nya, selain bisa mempercantik blog pemasangan related post pada sebuah blog juga akan mempermudah visitor dalam menjelajahi artikel-artikel yang ada di blog sobat.

Kalau sobat belum memasang related post pada blog sobat dan ingin memasangnya, berikut adalah langkah-langkah yang bisa sobat lakukan :

1.  Bukalah blog sobat
2.  Langkah selanjutnya pilih Template >> Edit HTML
3.  Kalau sudah, silahkan cari kode ]]></b:skin> (untuk lebih mudah tekan F3 atau Ctrl + F) kalau sudah ketemu pastekan kode di bawah ini, di bawah / di atas kode ]]></b:skin>

<b:if cond='data:blog.pageType == "item"'>
<style type="text/css">
#related-posts{float:center; text-transform:none; height:100%; min-height:100%; padding-top:5px; padding-left:5px}
#related-posts h2{font-size:1.6em; font-weight:bold; color:black; font-family:Georgia,Times New Roman,Times,serif; margin-bottom:0.75em; margin-top:0em; padding-top:0em}
#related-posts a{color:black}
#related-posts a:hover{color:black}
#related-posts a:hover{background-color:#d4eaf2}
</style>
<script type='text/javascript'>
var defaultnoimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9JsOK9kcJGefYjfQcd6J1cwz_FJZpVd4fAPTJhHGClBkMFwORv14mU1aMh6QGQ3sqd2CIdhWxgAfMEXsKaQuXUFfkhDaqmbT6lyCGNw-G7rHSpAso8hb-bdGdu-6Y03zxxvrnqYr5MgI/s400/noimage.png";
var maxresults=5;
var splittercolor="#d4eaf2";
var relatedpoststitle="Related Posts";
</script>
<script src='https://njilun2.googlecode.com/svn/Njilun%20(relatedpost).js' type='text/javascript'/>
</b:if>

3.  Belum selesai, cari lagi kode <data:post.body/>, kalau sudah ketemu silahkan copy pastekan script di bawah ini, tepat di bawah kode <data:post.body/> (biasanya kode <data:post.body/> lebih dari satu, jadi sobat coba saja satu persatu hehehe)

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'>
</b:if>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=6&quot;' type='text/javascript'/></b:loop>
<script type='text/javascript'>
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs(&quot;<data:post.url/>&quot;);
</script>
</div>
<div style='clear:both'/>
</b:if>

4.  Langkah terakhir klik Save Template

Selamat mencoba, semoga berhasil dan kalau sobat pengen blognya terlihat lebih menarik coba sobat pasang emoticon di bawah komentar blog. Semoga yang sedikit dari saya ini bermanfaat, jangan lupa coret-coretnya sob..