Cara Membuat Related Post

Saat kita sudah banyak menulis tentang sebuah artikel dalam blog kita, biasanya kita juga ingin mempromosikan kembali artikel yang sudah lama kita buat tersebut agar mendapat kesempatan untuk dibaca oleh pengunjung. Bagaimana caranya melakukan hal itu?

Mudah, kita cukup menggunakan fasilitas related post untuk menampilkan artikel lama kita. Selain bersifat mempromosikan, hal ini juga akan memberikan akses lebih mudah kepada pembaca yang ingin mengetahui informasi yang berhubungan dengan informasi yang sedang dia baca dengan informasi lainnya lewat tampilan artikel yang berkaitan yang telah kita sajikan. So, menempatkan fitur artikel yang berkaitan di blog kita ini cukup memberikan manfaat bukan? Karena itu, yuk mari kita bahas bersama bagaimana cara membuat related post atau artikel yang berhubungan ini.

Pertama, tentu saja kita harus log ini dulu ke akun blogger kita.
Klik fitur rancangan.
Klik edit HTML.
Klik atau contreng expand template widget.
Masukan kode HTML di bawah ini tepat di bawah kode <data:post.body/>.

<b:if cond='data:blog.pageType == "item"'>
<div class='similiar'>

<div class='widget-content'>
<h3>Related Post</h3>
<div id='data2007'/><br/><br/>
<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('data2007').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>
</div>

</div>
</b:if>

Klik simpan template. Sekarang artikel berkaitan di blog kita sudah jadi!

Keterangan :

Gunakan tombol Ctrl + F pada keyboard untuk mempermudah pencarian kode HTML yang diinginkan.
Sebelum melakukan edit HTML, harap download template kita sebelumnya sebagai backup untuk berjaga-jaga jika terjadi kegagalan saat proses edit terjadi.
Ganti tulisan related post dengan kalimat yang kita sukai.
Ganti angka var maxNumberOfPostsPerLabel = 4; untuk mengubah jumlah artikel berkaitan yang ingin ditampilkan.

Bagaimana? Cukup mudah bukan? Yuk dipraktikan!