Cara Membuat Related Post di Blogspot

Related post adalah kaitan artikel dengan tema atau kategori yang sedang ditampilkan saat itu dimana kaitan itu ditujukan pada berita yang dipilih pada label atau kategori. Sehingga dengan adanya skrip related post ini maka 5 postingan dari kategori yang sama akan ditampilkan linknya dibawah dari berita yang terbaca saat itu. seperti yang tampak pada blog sederhana ini,dimana selain Cara Membuat Related Post di Blogspot ini anda bisa melihat beberapa judul artikel kami sebelumnya dalam kategori yang sama yaitu Tips. 


Cukup menarik bukan? beberapa sumber web master menyebutkan jika dengan memasang related post ini bertujuan untuk meningkatkan view halaman, sehingga setiap pengunjung akan bisa lebih lama dalam blog tersebut karena memiliki banyak pilihan berita yang berkaitan. inilah tujuan untuk pemasangan dari related post pada blogspot. Saudara Web Master yang terhomat, cara cara ini mungkin telah anda terapkan sebelumnya atau bisa jadi lebih baik dari cara ini. Jadi, artikel ini bertujuan untuk mengingatkan anda yang newbie seperti saya yang harus selalu mengingat dan mengulang bila memerlukannya. 

Salam hormat saya untuk webmaster senior, semoga ini berguna untuk yang baru belajar seperti saya ini. Tidak lupa saya sampaikan terima kasih atas kunjunganya. inilah skrip dari cara membuat related post yang kami sebutkan diatas. 

cari kode </head> dan masukkan diatasnya kode berikut :

<style>
 #related-posts {
 float : left;
 width : 540px;
 margin-top:20px;
 margin-left : 5px;
 margin-bottom:20px;
 font : 13px Arial;
 margin-bottom:10px;}
 #related-posts .widget {
 list-style-type : none;
 margin : 5px 0 5px 0;
 padding : 0;}
 #related-posts .widget h2, #related-posts h2 {
 color : #f1c232;
 font-size : 20px;
 font-weight : normal;
 margin : 5px 7px 0;
 padding : 0 0 5px;}
 #related-posts a {
 color : #b45f06;
 font-size : 12px;
 text-decoration : none;}
 #related-posts a:hover {
 color : #00ff00;
 text-decoration : none;}
 #related-posts ul {
 border : medium none;
 margin : 10px;
 padding : 0;}
 display : block;
 margin : 0;
 padding-top : 0;
 padding-right : 0;
 padding-bottom : 1px;
 padding-left : 16px;
 margin-bottom : 5px;
 line-height : 2em;
 border-bottom:1px dotted #ffffff;}
 </style>

 <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>


Selanjutnya, bila tidak ada masalah. lanjutkan dengan mencari kode <data:post.body/> kemudian dibawahnya letakkan kode berikut :

<b:if cond='data:blog.pageType == &quot;item&quot;'>
 <div id='related-posts'>
 <font face='Arial' size='3'><b> Artikel Terkait : </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>


Selamat Mencoba, semoga sukses...

Source: http://infoting.blogspot.com/2012/03/cara-membuat-related-post-di-blogspot.html