Cyber Blog: Cara Membuat Artikel Terkait Di Bawah Postingan

___Contoh Menu Artikel Terkait___

Membuat blog lebih mudah digunakan oleh pengunjung adalah sesuatu yang harus dilakukan karena demi kenyamanan para pengunjung setiap blog, dimulai dari cara pembuatan menu drop down, dan lain sebagainya.

Kali ini saya akan berbagi tentang cara pembuatan "Artikel Terkait/ Related Post" di bawah setiap posting blog anda. Sebagai contohnya anda bisa melihat pada bagian bawah artikel ini..

Tujuannya sudah saya jelaaskan di atas, yakni untuk membuat pengunjung semakin nyaman karena semakin mudah untuk mengakses artikel terkait yang ada di blog kita. Cara kerja yang akan di tampilkan pada artikel terkait itu sesuai label posting yang anda buat, jika anda membuat posting dengan label Tips dan Trik maka yang ditampilkan adalah yang ber label itu. Begitu Juga dengan Label yang lain yang telah anda buat.

Tanpa basa-basi lagi, untuk menerapkannya yaitu :

1. Seperti biasa anda masuk ke >> Edit Html, jangan lupa centang kotak kecil bertuliskan Expand Template Widget.

2. Lalu anda cari kode ini <data:post.body/> ,untuk memudahkan pencarian anda tekan Ctrl+F.

Note : Jika blog anda telah dipasang Read More otomatis, maka cari kode serupa yang ke-2.

3. Copy Paste kode di bawah ini, dan letakkan setelah kode <data:post.body/>

<b:if cond='data:blog.pageType == "item"'><br />
<strong>Artikel Terkait di Bawah posting</strong><br />
<div class='rbbox'><div style='margin:0; padding:10px;height:200px;overflow:auto;border:1px solid #ccc;'><div id='ardi33'/><script type='text/javascript'>
var homeUrl3 = "<data:blog.homepageUrl/>";
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;
maxNumberOfPostsPerLabel = 100;
maxNumberOfLabels = 3;
function listEntries10(json) {
var ul = document.createElement('ul');
var maxPosts = (json.feed.entry.length <= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i < maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement('li');
var a = document.createElement('a');
a.href = alturl;
if(a.href!=location.href) {
var txt = document.createTextNode(entry.title.$t);
a.appendChild(txt);
li.appendChild(a);
ul.appendChild(li);
}
}
for (var l = 0; l < json.feed.link.length; l++) {
if (json.feed.link[l].rel == 'alternate') {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k<20; k++) label = label.replace("%20", " ");
var txt = document.createTextNode(label);
var h = document.createElement('b');
h.appendChild(txt);
var div1 = document.createElement('div');
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById('ardi33').appendChild(div1);
}
}
}
function search10(query, label) {
var script = document.createElement('script');
script.setAttribute('src', query + 'feeds/posts/default/-/'
+ label +
'?alt=json-in-script&callback=listEntries10');
script.setAttribute('type', 'text/javascript');
document.documentElement.firstChild.appendChild(script);
}
var labelArray = new Array();
var numLabel = 0;
<b:loop values='data:posts' var='post'>
<b:loop values='data:post.labels' var='label'>
textLabel = "<data:label.name/>";
var test = 0;
for (var i = 0; i < labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length <= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel < maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script><br />
</div><script type='text/javascript'>RelPost();</script><br />
</div></b:if>

4. Simpan Template Anda, jika anda sudah melakukannya dengan benar, maka seharusnya apa yang anda inginkan sudah berhasil.

Terimakasih, salam blogger.