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 < 10) { 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>

• while (i < relatedTitles.length && i < 10) {  menunjukkan jumlah Artikel Terkait yang ditampilkan


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

1.  Artikel Terkait  adalah judulnya 


2. Silahkan ganti sesuai dengan selera anda 


3. Save / simpan template anda

Cara Pemasangan di Sidebar : 

1. Pada Dasbor atau tata letak Klik tambah Gadget


2. Klik tanda tambah (+) pada HTML/JavaScript


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