Cara Buat Related Post Di Sidebar

Pada pembahsan kali ini saya akan share cara membuat related post disidebar, untuk contohnya silahkan lihat dikanan sidebar saya yang bertuliskan related post klik disini, sekarang udah tau kan?? untuk cara membuatnya sangatlah mudah, bagi yang tertarik silahkan ikuti langkah-langkah dibawah ini :

1. Login ke blogger -> Edit HTML -> Rancangan.
2. Cari kode </head>
3. Lalu letakan kode dibawah ini diatas kode tadi

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

4. Kemudian cari kode dibawah ini :

<b:if cond='data:post.labels'>

<data:postLabelsLabel/>

<b:loop values='data:post.labels' var='label'>

<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'>,</b:if>

</b:loop>

</b:if>

 5. Ganti kode tadi dengan kode dibawah ini :

<b:if cond='data:post.labels'>

<data:postLabelsLabel/>

<b:loop values='data:post.labels' var='label'>

<a expr:href='data:label.url' rel='tag'><data:label.name/></a><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&amp;callback=related_results_labels&amp;max-results=10"' type='text/javascript'/>

</b:if>

</b:loop>

</b:if>

 6. Simpan template
7. Setelah itu sobat pergi ke HTML/JavaScript
8. Kemudian masukan kode dibawah ini :

<script type="text/javascript">

removeRelatedDuplicates();

printRelatedLabels();

</script>

 9. Simpan

Sampai disitu sudah selesai cara membuat related post disidebar, namun artikel terkait akan muncul home page blog, untuk membuat related post yang muncul dihalaman posting blog, maka sobat harus menambahkan beberapa kode.

1. Klik Edit HTML
2. Lalu cari kode dibawah ini :

<b:widget id='HTML3' locked='false' title='Related Post' type='HTML'>

<b:includable id='main'>

<b:if cond='data:blog.pageType == "item"'> <!-- only display title if it's non-empty -->

<b:if cond='data:title != ""'>

<h2 class='title'><data:title/></h2>

</b:if>

<div class='widget-content'>

<data:content/>

</div>

<b:include name='quickedit'/>

</b:if> </b:includable>

</b:widget>

     3.  Simpan template

Untuk yang berwarna merah, silahkan sobat sesuaikan dengan template blog sobat.