Cara membuat Artikel Terkait di Sidebar

LIVE DEMO

Seperti postingan saya sebelumnya yaitu Cara membuat Artikel Terkait di bawah postingan dan Cara membuat Artikel Terkait berisi image Thumbnails, maka sekarang saya akan mencoba berbagi lagi dengan anda cara membuat Artikel terkait yang keberadaannya di sidebar Blog.

OK langsung saja cara pembuatannya sebagai berikut :

• Seperti biasa masuk ke account Blogger dengan ID anda
• Pada Dasbor - Rancangan Klik Edit HTML
• Simpan atau beri tanda centang pada Expand Template Widget
• Copas (copy-paste) kode berikut dibawah ]]></b:skin> atau diatas 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>

Kemudian scroll kebawah dan cari Kode 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 != &quot;true&quot;'>,</b:if>
</b:loop>
</b:if>

Hapus / ganti kode tersebut dengan kode dibawah :

<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>
<b:if cond='data:blog.pageType == "item"'>
<h4>Artikel Terkait</h4>
<script type="text/javascript">
removeRelatedDuplicates();
printRelatedLabels();
</script>
</b:if>

Catatan :
while (i < relatedTitles.length && i < 20) {
menunjukkan jumlah Artikel Terkait yang ditampilkan
Artikel Terkait adalah judulnya
Silahkan ganti sesuai dengan selera anda
Save / simpan template anda

Cara Pemasangan di Sidebar :

Pada Dasbor atau tata letak Klik tambah Gadget
Klik tanda tambah (+) pada HTML/JavaScript
Copas (copy-paste) kode berikut kedalamnya

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

Simpan Template dan Klik / buka salah satu postingan anda untuk lihat hasilnya
Selanjutnya cara mengatasi Masalah Artikel Terkait di Sidebar dan Solusi