Membuat Related Post di Blogspot

Blogger.com saat ini masih belum menyediakan gadget untuk menambah element widget related post di blogspot. Mungkin kedepannya, mereka akan menambah fasilitas ini, mengingat memang banyak blogger yang menggunakan fitur related post ini dari luar atau pihak ketiga. Jika anda ingin mempercantik blog anda, anda bisa membuat related post di blogspot anda.

Membuat related post di blogspot ini bisa menggunakan kode javascript. Silahkan anda ikuti petunjuk berikut ini :

1. Buka dashboard anda, design, edit html. Lalu copy kode berikut ini dan letakkan 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>

2. Klik Expand Widget Template pada template anda, lalu cari kode <data:postLabelsLabel/> . Lebih lengkapnya kode yang anda cari adalah seperti 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>

Lalu anda delete kode diatas dan ganti dengan kode 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>

<p>
<h2>Baca ini juga :</h2>
</p>

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

Sebenarnya anda hanya perlu menambahkan kode yang berwarna merah kedalam kode yang saya maksud diatas. Cara ini adalah untuk lebih praktis saja. Jangan lupa anda simpan. Dengan menambahkan related post ini, maka anda telah mempercantik blog anda, dan juga anda memudahkan pengunjung blog anda untuk membaca-baca artikel blog anda yang lainnya. Selamat mencoba, semoga bermanfaat.Anda bisa juga cara membuat recent post di blogspot

Artikel Terkait:

Sebarkan Artikel ini :