cara membuat related post scroll

Related post Scroll
Related post Scroll selain mempercantik blog juga berfungsi untuk menaik turunkan artikel - artikel yang pernah di buat sobat.Dengan mengaktifkan fungsi scrolling pada widget related posts maka pengunjung tidak lagi merasa terganggu dengan artikel-artikel terkait yang terlalu kepanjangan ke bawah. Dan winget ini di letakan di bawah posting seperti di blog ini. Tertarik ingin memasang related post fungsi scrolling?
Langsung saja saya uraikan cara -caranya :
1. Login ke blogger Sobat
2. Klik Template >> Edit HTML >> Centang Epand Template Winget
3. Cari kode <p><data:post.body/></p>
Letakkan kode berikut di bawahnya :

<b:if cond='data:blog.pageType == "item"'><br />
<h2>Related Post:</H2><div class='rbbox'><br />
<div style='margin:0; padding:10px;height:200px;overflow:auto;border:1px solid #ccc;'><br />
<div id='albri'/><br />
<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><br />
</div><br />
<script type='text/javascript'>RelPost();</script><br />
</div><br />
</b:if>

4. Cari kode ]]></b:skin>

    Letakkan kode berikut di atasnya :


    Edit warna sesuai dengan keinginan sobat,
5. Klik SIMPAN TEMPLATE
    Selesai

Jumat, 12 Oktober 2012

cara membuat related post scroll

Related Post:

Ditulis Oleh : Unknown ~ Great Works Of Art

Tidak ada komentar: