Membuat Artikel Terkait di Sidebar | Tutorial Blog
Dulu saya pernah posting tentang Membuat Related Post (Artikel Terkait), pada postingan kali ini artikel terkait tersebut akan kita pasang di sidebar.
Buat Sobat yang ingin memasangnya silakan ikuti tutorial berikut :
- Login ke Blogger, Klik Design/Rancangan > Edit HTML.
- Beri tanda centang pada Expand Template Widget.Tips : Biasakan mendownload template untuk membackup template sebelum di edit.
- Cari kode </head>, lalu Copy kode dibawah ini dan letakkan diatas kode </head>. <!--Simple Related Posts Scripts Start-->
<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 < 5) {
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>
<!--Simple Related Posts Scripts and Styles End--> - Kemudian silakan Sobat 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 != "true"'>,</b:if>
</b:loop>
</b:if>Lalu ganti dengan kode berikut :<b:if cond='data:post.labels'><data:postLabelsLabel/>max-results=5 : jumlah artikel yang akan ditampilkan, silahkan diganti.
<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=5"' type='text/javascript'/>
</b:if>
</b:loop>
</b:if> - Lalu klik Save / Simpan Template.
- Selanjutnya, masuk ke Page Element > Add a Gadget > HTML/JavaScript.
- Lalu letakkan kode dibawah ini kedalam konten HTML/JavaScript. <script type="text/javascript">
removeRelatedDuplicates();
printRelatedLabels();
</script> - Terakhir klik Save, dan lihat hasilnya.
Tidak ada komentar:
Posting Komentar
Anda diperkenankan untuk meninggalkan komentar.
Semua komentar yang masuk tanpa melalui proses seleksi sehingga komentar tidak mewakili opini dari blog ini
Silahkan klik Poskan Komentar atau Form Komentar jika kotak komentar belum muncul