Rabu, 02 November 2011

Membuat Related Post atau Artikel Terkait di Sidebar

Untuk membuat artikel terkait atau related posts syarat utamanya adalah postingan Sampeyan harus mempunyai label, karena penampilan otomatis artikel yang berkaitan didasarkan pada label yang sama.

Langkah Cara Membuat Related Post di Sidebar, silahkan ikuti langkah-langkah berikut :
  • Login ke Blogger.
  • Pilih Rancangan.
  • Pilih Edit HTML
  • Beri tanda centang pada Expand Template Widget.
Letakkan  kode berikut diatas </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>

Cari 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 != &quot;true&quot;'>,</b:if>
</b:loop>
</b:if>

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 != &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=10&quot;' type='text/javascript'/>
</b:if>
</b:loop>
</b:if>

Simpan template

Keterangan:
Pada yang berwarna biru max-result menunjukkan maksimal artikel terkait yang akan ditampilkan per label. Jadi bisa ditampilkan hanya 5, atau bisa juga hingga 15 jika setiap lebel postingan Sampeyan lebih dari 15.

Penempatan Gadget
Sekarang beralihlah ke bagian Rancangan --> Elemen Halaman. Pilih  gadget akan ditambahkan. Klik Tambah Gadget. Pilih HTML/JavaScript.



Lalu masukkan kode berikut ini di gadget Sampeyan.

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

Begitulah Tutorial Artikel Terkait atau Related Posts di Sidebar. Ini akan membantu meningkatkan page view blog Sampeyan. Semoga bermanfaat.

Tidak ada komentar:

Posting Komentar