Sebagian blogger suka meletakkan artikel terkait di bawah posting,namun sebagian juga ada yang ingin meletakkannya di samping atau di sidebar blog. Ini kan namanya juga orang punya selera yang tak sama,tapi yah terserah masing-masing yang punya blog.
Bagi anda yang ingin menu artikel terkait di sidebar,cara pasangnya ada beberapa langkah yang harus di buat dan biar cepat mulai saja langkah awal:
1. Masuk/login dulu,dan pilih blog anda (bila lebih dari satu). Pilih template > Pilih edit html dan carilah kode </head> kemudian anda kopi kode di bawah dan letakkan sebelum/di atas kode </head> ;
<script type="text/javascript">2. Berikutnya,perhatikan-anda cari lagi kode seperti di bawah;
//<![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>
<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>
3. Kemudian kopi kode dibawah dan anda sisipkan di atas </b:loop> ;
<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>
Nanti jadinya akan seperti ini;
<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>
4. Sampai di sini,silahkan anda save dulu template.
5. Pada langkah 5 anda tidak lagi di edit html,tapi silahkan anda pindah ke tata letak/element. Klik Add gadget/tambah element,klik javascript > Anda beri judul pada kolom judul (ingat ini penting) lalu letakkan kode di bawah dalam kolom javscipt dan simpan;
<script type="text/javascript">removeRelatedDuplicates();printRelatedLabels();</script>
6. Langkah berikutnya agar menu artikel terkait hanya muncul bila halaman artikel dibuka tidak pada semua halaman (maksudnya menu artikel terkait itu akan tetap muncul walau di homepage/halaman utama). Lanjut lagi langkahnya.
Sekarang balik lagi masuk ke edit html blog anda,dan carilah kode seperti di bawah;
<b:widget id='HTML4' locked='false' title='Artikel Terkait Lainnya' type='HTML'><b:includable id='main'><!-- only display title if it's non-empty --><b:if cond='data:title != ""'><h2 class='title'><data:title/></h2></b:if><div class='widget-content'><data:content/></div><b:include name='quickedit'/></b:includable></b:widget>
Pada langkah ini perhatikan benar-benar yang saya beri warna biru. Untuk kode itu kemungkinan tidak sama dengan blog anda (itu hanya contoh),jadi sesuaikan dengan blog anda. Yang anda harus lakukan adalah mengambil kode seperti/yang letaknya ada pada posisi kode yang saya beri warna biru untuk di letakkan pada kode langkah berikutnya.
Yang merah itu adalah judul gadget/element anda. Jadi itu juga sesuaikan dengan judl yang telah anda beri tadi waktu menambah element javascript.
7. Lalu cari lagi kode ]]></b:skin> letakkan kode di bawah tepat di bawah kode ]]></b:skin> .,setelah kode yang BIRU sudah anda sesuaikan dengan yang ada pada blog anda.
<b:if cond='data:blog.pageType != "item"'><style>#HTML4{display:none;}</style></b:if>
8. Sekarang masuk pada langkah terakhir yaitu klik simpan template dan selesai. Dan cek ricek.....!
Silahkan berbagi dengan tombol share di bawah,mungkin orang lain lebih membutuhkan artikel ini:
ٱلْحَمْدُ لِلَّهِ رَبِّ
ٱلْعَاٰلَمِين
