Cara Menampilkan Artikel Terkait Dibawah Postingan Blogspot

Cara Menampilkan Artikel Terkait Dibawah Postingan Blogspot

Mungkin diantara anda ada yang belum tau cara menambahkan daftar related post atau related artcle atau Artikel terkait di blogspot. Caranya sebenarnya banyak, yaitu dengan widget, dengan linkwithin,dengan script. Nah kalini saya akan menampilkan postingan cara menampilkan artikel terkait dibawah postingan blogspot dengan cara javascript.

Berikut adalah bagaimana kita dapat menambahkan fungsi sederhana ini untuk template Blogger:

 

1. Pergi ke Layout> Edit HTML di dashboard Blogger Anda, dan centang kotak "Expand widget template".

2. Sisipkan bagian kode berikut tepat sebelum tag  </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>

3. Berikutnya, cari bagian kode ini dalam template Anda:

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

 

Hal ini biasanya terletak di bagian "footer-post" dari template Anda (di widget Blog1), meskipun template Anda mungkin berbeda.

 

Ganti kode diatas  dengan kode berikut sebagai gantinya:

<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&callback=related_results_labels&max-results=10″' type='text/javascript'/>
</b:if>
</b:loop>
</b:if>

 

Kode JavaScript tersebut  diperlukan untuk mengurai label dari feed blog kita.

 

4. Terakhir : cari baris ini di template Anda:
<p><data:post.body/></p>

Dibawah baris  tsb, sisipkan bagian kode berikut:

<b:if cond='data:blog.pageType == "item"'>
<script type="text/javascript">
removeRelatedDuplicates();
printRelatedLabels();
</script>
</b:if>

 

Kemudian simpan template Anda.

Jika tidakada masalah, maka  ketika Anda melihat sebuah posting di halaman posting, Anda akan melihat sebuah daftar sederhana dari posting terkait yang akan muncul sebelum bagian komentar. Daftar ini akan ditata sesuai dengan daftar elemen lain dalam posting Anda, dan secara otomatis menyesuaikan untuk melengkapi template Anda.

Semoga bermanfaat

5 comments:

  1. gan nmn caranya biar artikel jadi READ MORE
    ane dah coba pake cara tmn mlh semua jd read more

    pencerahannya gan tq

    ReplyDelete
  2. punya saya gagal boss, bisa minta tolong dibuatin gak?

    ReplyDelete
  3. ko saya gagal mas,apa ga kompitable dengan template toko online mas??
    mohon pencerahan

    ReplyDelete
  4. lapor gan saya suda mengikuti apa yang di rekomendasikan kak masi gak bisa ya gan... mohon batuannya

    ReplyDelete

Saya berterimakasih atas koment anda yang Sopan dan Ramah...
Sebelum kasih komentar,sebaiknya lihat Contoh komentar spam disini , Agar komentar anda tdk tertangkap oleh spam filter blogger.