Cara Membuat Related Post / Artikel Terkait di Sidebar Blog

Saya tau kalian gak suka basa-basi jadi langsung aja ke TKP

1. Pertama, yang pasti sobat login terlebih dahulu ke blogger dengan akun sobat.
2. Masuk ke Rancangan/Design → Edit HTML. Lalu, klik centang pada "Expand Widget Templates".
3. Copy-paste kode dibawah ini, sebelum tag


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

4. Kemudian, tekan CTRL + F. Untuk melakukan pencarian 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>

5. Jika sobat sudah menemukan kode diatas. Lalu tambahkan kode bercetak tebal berikut diantara kode diatas.

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

Keterangan:
Pada kata yang berwarna merah menunjukkan maksimal artikel terkait yang akan ditampilkan per-label. Jadi bisa ditampilkan hanya 5, bila anda ingin menampilkannya tidak terlalu banyak atau juga bisa hingga 20 artikel terkait yang ditampilkan apabila postingan anda memiliki lebih dari satu label.

6. Kemudian, klik "Save Template". Tunggu dulu, belum selesai sampai disitu

7. Kemudian sobat masuk pada halaman "Rancangan" → "Elemen Laman". Lalu klik "Tambah Gadget". Copy pastekan kode dibawah ini kedalamnya... dan jangan lupa memberikan judul "Related Post", pada widget tersebut. Jika sudah, Lalu klik "Simpan".


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

8. Lalu, sobat kembali lagi ke halaman "Rancangan" → "Edit HTML". Lalu jangan lupa juga klik/centang "Expand Template Widget".

9. Lakukan pencarian pada kata "Related Post". Lalu, sisipkan kode berwarna merah, Mirip-miripnya seperti kode dibawah ini, milik saya..

<b:widget id='HTML7' locked='false' title='Related Post' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>

<b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>

10.langkah terakhirnya yaitu Save Template

~Selamat Mencoba~