Cara Membuat Related Post Blogger tentunya sangat mudah untuk Anda terapkan pada blog Anda terutama yang belum memiliki fitur related Post pada tema Blogger yang digunakan.
Related Post umumnya memiliki fungsi untuk menyediakan sebuah navigasi yang mengarah ke postingan serupa lainnya kepada pengunjung ketika pengunjung mengakses suatu artikel sehingga nantinya pada saat membuka sebuah artikel maka pengunjung dapat mengetahui artikel lainya yang berkaitan dengan postingan yang dibaca.
Pada penggunaanya Widget yang ada pada artikel ini bermanfaat apabila diterapkan pada blog supaya pengunjung bisa dengan mudah mengetahui artikel lainnya yang mungkin berkaitan dengan postingan yang dibaca. Sehingga nantiya Pengujung akan lebih lama berada di blog Anda, yang nantinya akan menurunkan tiggkat bounce rate pada blo Anda.
Cara Membuat Related Post Blogger
Banyak sekali cara yang bisa digunkan jika ingin membuat Related Post pada Blogger. Anda bisa minyisipkan beberapa script baik script yang simpel maupun berdasarkan label. Berikut ini adalah Cara Membuat Related Post Blogger :
1. Login terlebih dahulu ke blogger
2. kemudian jika sudah masuk dasbord pilih Edit HTML
3. kemudian Letakkan kode dibawah ini tepat di atas kode </head>
<b:if cond='data:blog.pageType == "item"'>
<style type='text/css'>
#related-posts {margin: 15px 0px;}
#related-posts h2 {font-size:16px;font-weight: bold;color: #666;margin-bottom: 0.75em;}
#related-posts a {font-size: 14px;color: #333;border-bottom:1px dotted #E2E2E2;display:block;padding:5px 0;text-decoration: none;}
#related-posts a:hover {color: #48d;}
#related-posts ul {padding: 0px;list-style-type: none;}
#related-posts li {padding: 0;}
</style>
<script type='text/javascript'>
var relatedpoststitle="Related Posts";
</script>
<script type='text/javascript'>
//<![CDATA[
var relatedTitles=new Array();var relatedTitlesNum=0;var relatedUrls=new Array();function related_results_labels(json){for(var i=0;i<json.feed.entry.length;i++){var entry=json.feed.entry[i];relatedTitles[relatedTitlesNum]=entry.title.$t;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='alternate'){relatedUrls[relatedTitlesNum]=entry.link[k].href;relatedTitlesNum++;break}}}}function removeRelatedDuplicates(){var tmp=new Array(0);var tmp2=new Array(0);for(var i=0;i<relatedUrls.length;i++){if(!contains(tmp,relatedUrls[i])){tmp.length+=1;tmp[tmp.length-1]=relatedUrls[i];tmp2.length+=1;tmp2[tmp2.length-1]=relatedTitles[i]}}relatedTitles=tmp2;relatedUrls=tmp}function contains(a,e){for(var j=0;j<a.length;j++){if(a[j]==e){return true}};return false}function printRelatedLabels(currenturl){for(var i=0;i<relatedUrls.length;i++){if(relatedUrls[i]==currenturl){relatedUrls.splice(i,1);relatedTitles.splice(i,1)}}var r=Math.floor((relatedTitles.length-1)*Math.random());var i=0;if(relatedTitles.length>1){document.write('<h2>'+relatedpoststitle+'</h2>')}document.write('<ul>');while(i<relatedTitles.length&&i<20&&i<maxresults){document.write('<li><a href="'+relatedUrls[r]+'">'+relatedTitles[r]+'</a></li>');if(r<relatedTitles.length-1){r++}else{r=0}i++}document.write('</ul>');relatedUrls.splice(0,relatedUrls.length);relatedTitles.splice(0,relatedTitles.length);}
//]]>
</script>
</b:if>
4. setelah itu Letakkan kode dibawah ini tepat di bawah kode <div class=’post-footer-line post-footer-line-3′> atau di bawah kode <div class=’post-footer’>
<b:if cond='data:blog.pageType == "item"'><div id='related-posts'> <b:loop values='data:post.labels' var='label'> <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=6"' type='text/javascript'/></b:if></b:loop> <script type='text/javascript'> var maxresults=5; removeRelatedDuplicates(); printRelatedLabels("<data:post.url/>"); </script></div></b:if>
5. jika sudah klik Save atau Simpan template.
Jika pada langkah ke 3 kesulitan menemukan kode ataupun script diatas tidak bekerja pada template yang Anda gunakan maka jangan khawatir disini saya menyajikan alternatif Cara Membuat Related Post Blogger lainnya. Untuk
Cara Membuat Related Post Blogger lainya sebagai berikut :
1. Login terlebih dahulu ke blogger
2. kemudian jika sudah masuk dasbord pilih Edit HTML
3. kemudian Letakkan kode dibawah ini tepat di atas kode </head>
<b:if cond='data:blog.pageType == "item"'>
<script type='text/javascript'>
//<![CDATA[
var relatedTitles = new Array(); var relatedTitlesNum = 0; var relatedUrls = new Array(); function related_results_labels(json) { for (var i = 0; i < json.feed.entry.length; i++) { var entry = json.feed.entry[i]; relatedTitles[relatedTitlesNum] = entry.title.$t; for (var k = 0; k < entry.link.length; k++) { if (entry.link[k].rel == 'alternate') {relatedUrls[relatedTitlesNum] = entry.link[k].href; relatedTitlesNum++; break;}}}} function removeRelatedDuplicates() { var tmp = new Array(0); var tmp2 = new Array(0); for(var i = 0; i < relatedUrls.length; i++) { if(!contains(tmp, relatedUrls[i])) { tmp.length += 1; tmp[tmp.length - 1] = relatedUrls[i]; tmp2.length += 1; tmp2[tmp2.length - 1] = relatedTitles[i];}} relatedTitles = tmp2; relatedUrls = tmp;} function contains(a, e) { for(var j = 0; j < a.length; j++) if (a[j]==e) return true; return false;} function printRelatedLabels() { var r = Math.floor((relatedTitles.length - 1) * Math.random()); var i = 0; document.write('<ul>'); while (i < relatedTitles.length && i < 20) { document.write('<li><a href="' + relatedUrls[r] + '">' + relatedTitles[r] + '</a></li>'); if (r < relatedTitles.length - 1) { r++; } else { r = 0;} i++;} document.write('</ul>');}
//]]>
</script>
</b:if>
4. setelah itu Letakkan kode dibawah ini tepat di bawah kode <data:post.body/>
<br/><br/><b:if cond='data:blog.pageType == "item"'> <div id='related-posts'> <font face='Arial' size='4'><b><i aria-hidden='true' class='fa fa-american-sign-language-interpreting fa-2x gradient-icon'>Related Posts</i> : </b></font><font color='#000'><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>
5. jika sudah klik Save atau Simpan template.
Keterangan: Jangan lupa, Pastikan juga pada setiap postingan yang telah Anda publish telah diberi Label. Karena Apabila postingan tidak diberi label, maka related post tidak akan muncul di halaman blog Anda.
Mungkin cukup sekian pembahasan mengenai Cara Membuat Related Post Blogger, yang tentunya sangat mudah untuk diterapkan pada blog yang anda buat. Apabila ada yang ingin ditnyakan dapa melalui kolom kometar dibawah ini
