Cara Gampang Membuat Related Post Dengan Fungsi Scroll Single Link
Related Post |
Cara membuat related post pati sudah banyak dibahas di blog yang lainnya. Tapi kali ini saya akan mencoba membagikannya kepada blogger yang masih belum tahu cara memasang related post fungsi scroll. Oke Langsung saja di praktekkan ya sob.
1. Pertama buka blogger.
2. Kedua masuk ke template => edit template => centang expand template widget
3. Lalu sobat cari kode <data:post.body/> atau <p><data:post.body/></p>
4. Setelah itu letakkan kode dibawah ini tepat dibawah kode tadi
<b:if cond='data:blog.pageType == "item"'>
<H2>Related Post:</H2>
<div class='rbbox'>
<div style='margin:0; padding:10px;height:200px;overflow:auto;border:1px solid #ccc;'>
<div id='albri'/>
<script type='text/javascript'>
var homeUrl3 = "<data:blog.homepageUrl/>";
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;
maxNumberOfPostsPerLabel = 50;
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('albri').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>
<script type='text/javascript'>RelPost();</script>
</div>
</b:if>
<H2>Related Post:</H2>
<div class='rbbox'>
<div style='margin:0; padding:10px;height:200px;overflow:auto;border:1px solid #ccc;'>
<div id='albri'/>
<script type='text/javascript'>
var homeUrl3 = "<data:blog.homepageUrl/>";
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;
maxNumberOfPostsPerLabel = 50;
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('albri').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>
<script type='text/javascript'>RelPost();</script>
</div>
</b:if>
5. Jika sudah, sobat cari kode ini ]]></b:skin>
6. Lalu letakkan kode dibawah ini tepat diatas kode ]]></b:skin>
.rbbox{border: 1px solid #D8D8D8;padding: 5px;
background-color: #E0F8E0;-moz-border-radius:5px; margin:5px;}
.rbbox:hover{background-color: #EFFBEF;}
7. Jika sudah, yang perlu sobat lakukan adalah save template.
Untuk tulisan atau kode yang berwarna merah anda bisa menggantinya dengan Artikel Menarik Lainnya, atau apa saja terserah keinginan sobat.
Oke sob cukup sekian tutorial blog dari saya semoga bisa bermanfaat untuk blogger yang masih pemula.
Bila tutorial diatas tidak bisa , mohon berkomentar agar bisa dibetulkan.
21 Komentar untuk "Cara Gampang Membuat Related Post Dengan Fungsi Scroll"
keren nich kalau ada scroll dibawah post, memudahkan pengunjung untuk menemukan yang mereka cari, nice info, terima kasih gan atas kunjungannya di blog basid.
iya bener kan, bagus kan ? hehehe seep :D
Terima kasih infonya admin!
Ini kode yang paling cocok buat blog saya!
Sama sama sob :D
Sering2 mampir ya...?
makasih gan infonya,menarik jadi related post ane gak kepanjangan,,
oy,jangan lupa mampir gan,,,silahturahmi
Alhamdulillah sudah terpasang di blog saya
terima kasih gan tutornya.. bermanfaat
mas pnyku ada 4
yang mana
Biasanya yang kedua sob.
kalo gx muncul coba satu-satu aja sob sampai muncul :)
Oke siap. makasih mas
Sama - sama masbro
Makasih Agan, it' work ^_^
thaks buat artikelnya saya jadi bisa memasang related pos di blog saya dan membuat blog saya jadi seo thanks
Artikel bagus gan. menuntun banget. pas deh untuk yang mau nerapin. :)
thank bro..sangat membantu...
Saatnya praktek gan :D Tapi ada auto readmorenya --
makasih gan tutorialnya maklum ane masih newbie, ditunggu kehadirannya digubuk ane agan.
mantab gan , ane berhasil
kunbal ya gan
di http://zadanew.blogspot.com/
Terima kasih gan, saya sudah ambil share artikel nya dan saya sudah pasangkan di blog saya tentang bagaimana membuat related artikel, sekali lagi terima kasih banyak gan.
http://lyonair.blogspot.com
Terimakasih sudah berbagi ilmunya, sukses selalu. Ditunggu kunjungannya ya...
bagus gan,tentunya related post sangat bermanfaat untuk blog kita, supaya pengunjung nyaman untuk melihat artikel kita yang menarik lainnya..
makasih sudah berbagi ^_^
PERATURAN BERKOMENTAR :
1. Dilarang Spam.
2. Dilarang Memasang Link Aktif.
3. Dilarang Menghina, Sara, Dan P*rn.
4. Dilarang Promosi.
5. Komentar Harus Relevan Dengan Artikel.
Jika anda melanggar 5 point diatas, maka komentar anda akan kami hapus langsung tanpa pemberitahuan sebelumnya.
Terima kasih dan selamat berblogging ria.