Membuat Artikel Terkait di Sidebar

Artikel terkait biasanya ada di bawah postingan, namun kali ini pengunjung akan disuguhkan artikel terkait tersebut terletak di sebelah postingan atau di sidebar, bukan dibawah postingan yang selama ini kita lihat. Sebenarnya artikel terkait ini bisa juga diletakkan dibawah postingan. 

Baiklah, berikut langkah-langkahnya :

Langkah I

1. Seperti biasa kalian login dulu ke blogger.
   
2. Masuk ke Elemen Halaman.
   
3. Kemudian Tuju Edit HTML.
   
4. Klik Expand Template Widget.
   
5. Letakkan kode berikut ini sebelum kode </head> 

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

    6.Kemudian cari kode seperti 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>

     7.Lalu sisipkan kode yang berwarna hijau, sehingga hasilnya menjadi seperti berikut :

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

     8. Simpan Template, sampai disini proses Edit HTML sudah selesai.
     9.Sekarang kalian tuju Tata Letak, kemudian klik Tambah Gadget pada sidebar blog kalian.
   10.Pilih yang HTML/Javascript, kemudian masukkan kode berikut :

<script type="text/javascript">
removeRelatedDuplicates();
printRelatedLabels();
</script>

   11.Jangan lupa beri judul, lalu klik Simpan.

 

Sampai disitu sudah selesai pembuatan artikel terkait di sidebar. Selamat Mencoba........