 |
 |
langsung aja deh nih tak kasih step by stepnya Cara Membuat Artikel Terkait Dengan Scroll di Blog blog:
- Tentunnya sobat sudah masuk akun blogger..
- Klik Rancangan
- Pilih tab HTML
- Klik Expand Template Widgets
- Cari kode " <data.post.body/> " tanpa tanda kutip biar cepet tekan ctrl+F
- Jika sobat sudah menggunkan fungsi Readmore maka akan terdapat 2 kode " <data.post.body/> ". Dan jika sobat sebelumnya sudah menggunakan Artikel Terkait yg biasa tanpa scroll hapus saja
- Copy kemudian pastekan kode dibawah ini setelah kode <data.post.body/> yang kedua (jika anda menggunkan fungsi Readmore)
<b:if cond='data:blog.pageType == "item"'>
<br/>
<br/>
<H2>Artikel Terkait:</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 = 9999;
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>
8. Untuk kata artikel tekait bisa sobat ganti dengan kata yang sobat suka
9. Selanjutnya masukan kode dibawah ini 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;}
Catatan:10. Jangan Lupa baca membaca basmalah sebelum klik simpan tempalate.
Ganti kode-kode yang berwarna dengan kode warna yang sobat mau.#D8D8D8: warna border____#E0F8E0: warna background____ #EFFBEF: warna background juga, namun akan terlihat jika disorot dengan pointer
Oke deh sobat mungkin itu tutorial Cara Membuat Artikel Terkait Dengan Scroll di Blog semoga bermanfaat dan bisa membantu sobat semua.
Terima Kasih telah membaca artikel Cara Membuat Artikel Terkait Dengan Scroll di Blog
Sumber
0 komentar