Mungkin sudah tak asing lagi dengan istilah Related Post bagi para blogger. Tapi, sudahkah anda memasang Related Post dengan fungsi scrolling? Nah, begini caranya!
1. Login ke blogger dengan ID anda
2. Tuju TataLetak
3. Pada tab menu, pilih Edit HTML
4. Centang kotak kecil Expand Template Widget
5. Cari kode <p><data:post.body/></p>
Letakkan kode berikut di bawah 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>
6. Jika sudah, sekarang cari kode ]]></b:skin>
7. Letakkan kode berikut di atas kode tadi:
.rbbox{border: 1px solid #D8D8D8;padding: 5px;
background-color: #E0F8E0;-moz-border-radius:5px; margin:5px;}
.rbbox:hover{background-color: #EFFBEF;}
Klik SIMPAN TEMPLATE
Selesai
Disana ada tulisan yang bisa diganti dengan teks favorit anda. Untuk kode warna juga demikian, sesuaikan dengan desain template anda.
Semoga bermanfaat!
source: bangdel
Related Post:
- Menampilkan Judul Postingan Saja pada Halaman Pencarian
- Cara Membuat Daftar Isi
- Membuat Spoiler di Blog
- Cara Memasang Widget "Sharing is Sexy"
- Menulis Kode HTML di Posting Blog
- Cara Membuat Navigasi Halaman Bernomor di Blog
- Memasang Meta Tag di Blogger
- Update PageRank April, SV Naik Kelas!?
- Mengatur Jumlah Post dan Label di Artikel Terkait
- Widget Untuk Mengetahui IP, OS, Country, dan Browser Kita
- Mengatur Jumlah Posting yang Ditampilkan pada Label
- Cara Memasang Live Traffic di Blogspot
- Cara Membuat Artikel Terkait
- Memasang Badge Facebook di Blogspot
- Trik Meningkatkan Pagerank Blog Dengan Mudah Tanpa SEO
- Menambah Google Pagerank
- Tips menambah Read More. (editor baru)
waw, terimakasih...
Kok tempat saya nggak ada kode kayak gitu yak ??