Kali ini kita akan belajar membuat related post atau artikel terkait yang di letakan pada bagian bawah halaman blog kita di blogspot.
Sebenarnya penempatan artikel terkait atau related post sama saja baik di bagian bawah halaman maupun di bagian side bar blog. Hal ini tergantung selera Anda mana yang lebih bagus kelihatannya.
Baiklah, sekarang langsung saja ikuti panduan dan tutorial cara membuat related post atau artikel terkait di bawah halaman posting berikut ini:
1. Login menggunakan Username dan Password google account atau gmail Anda di blogger.com
2. Dari halaman dasbor/dashboard, pilih dan klik Design atau Rancangan.
3. Klik Edit HTML dan tandai Expand Widget Template (sebaiknya download dulu template Anda sebagai backup)
4. Cari kode ini
<data:post.body/>
5. Letakkan script code berikut ini di bawah kode diatas (lihat kode di nomor 4):
<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>
6. Save Template, lihat hasilnya.
Selamat mencoba dan semoga berhasil.
Mkasih infonya gan.
ReplyDeletebrguna bgt bwt ane yg baru blajar ng-blog :)
Absen :D mumpung lagi lewat, mampir aja di pos komen, kunjung balik dirumahku ya sob www.arit.tk
ReplyDeletei got the solution of error which i am facing form couple of days, thanks for sharing this nice post.
ReplyDeleteTest Guide