Langsung ke konten utama

Cara Membuat Scroll Pada Related Post Di Blog

Awalnya alasan membuat scroll pada artikel terkait/ related post diblog ini karena pada postingan anaa cara membuat scroll pada daftar komentar sebelumnya bermaksud agar bisa dikit menghemat halaman dan tampilan lebih apik tidak dijejali dengan daftar komentar yang panjang.... tapi komentar dari sahabat blogger (ukhty Narti) yang menanyakan bagaimana agar daftar komentar tidak masuk dalam scroll membuat anaa berpikir kembali. Benar juga ada baiknya kolom untuk menuliskan komentar tidak masuk dalam scroll selain justru lebih apik, sangat membantu sahabat blogger yang masih baru (padahal asli anaa satu diantaranya) untuk tidak bingung saat ingin menuliskan komentarnya harus nyari nyari, apalagi kalau belum ngerti scroll? Karena kolomnya 'sembunyi' didalam scroll & terletak paling bawah dari daftar komentar.

image

Jadinya untuk tujuan yang sama ketika anaa hendak membuat scroll pada daftar komentar, sekarang anaa buat scroll pada artikel terkait/ related post dan menghapus scroll pada daftar komentar, kecuali anaa dah temukan cara membuat scroll pada daftar komentar tanpa memasukkan kolom komentarnya dalam scroll, duh dah otak-atik, search digoogle belum nemu caranya. Ada sahabat yang tahu?
Nah seperti biasa kalau dah nemukan ilmu ngeblog anaa buat postingannya, tentu setelah anaa berhasil mempraktekinnya sendiri diblog ini atau blog anaa lainnya tempat nguji coba.

Jadi panjang ceritanya? Berikut membuat scroll pada artikel terkait/ related post
1. Loggin ke blogger=> Klik layout=> Edit HTML=> Klik Expand Template Widget=> Cari kode 
<data:post.body/>
Kalau sudah ketemu, copi dan pastekan script/ code berikut dibawah kode tadi

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<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 = &quot;<data:blog.homepageUrl/>&quot;;
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;
maxNumberOfPostsPerLabel = 10;
maxNumberOfLabels = 3;
function listEntries10(json) {
var ul = document.createElement(&#39;ul&#39;);
var maxPosts = (json.feed.entry.length &lt;= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i &lt; maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;
for (var k = 0; k &lt; entry.link.length; k++) {
if (entry.link[k].rel == &#39;alternate&#39;) {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement(&#39;li&#39;);
var a = document.createElement(&#39;a&#39;);
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 &lt; json.feed.link.length; l++) {
if (json.feed.link[l].rel == &#39;alternate&#39;) {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k&lt;20; k++) label = label.replace(&quot;%20&quot;, &quot; &quot;);
var txt = document.createTextNode(label);
var h = document.createElement(&#39;b&#39;);
h.appendChild(txt);
var div1 = document.createElement(&#39;div&#39;);
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById(&#39;albri&#39;).appendChild(div1);
}
}
}
function search10(query, label) {
var script = document.createElement(&#39;script&#39;);
script.setAttribute(&#39;src&#39;, query + &#39;feeds/posts/default/-/&#39;
+ label +
&#39;?alt=json-in-script&amp;callback=listEntries10&#39;);
script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;);
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 = &quot;<data:label.name/>&quot;;
var test = 0;
for (var i = 0; i &lt; labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length &lt;= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel &lt; maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
</div>
<script type="text/javascript">RelPost();</script>
</div>
</b:if>

2. Selanjutnya cari kode ]]></b:skin>
3. JIka sudah ketemu copy dan pastekan code berikut diatas code tadi.


.rbbox{border: 1px solid rgb(192, 192, 192);padding: 5px;
background-color: #f0f0f0;-moz-border-radius:5px; margin:5px;}
.rbbox:hover{background-color: rgb(255, 255, 255);}

4. Simpan template
Selesai, sobat telah membuat scroll pada artikel terkait/ related post pada blog sobat, lihat hasilnya!  Semoga membantu. 


Komentar

Posting Komentar

Silahkan berkomentar kepada sobat blogger semua. Diharapkan komentar yang berkaitan dengan isi dari blog ini. Terima Kasih.



TULISKAN KOMENTAR DI BAWAH!!!

Postingan populer dari blog ini

Tips Latihan Memperbaiki Tulang Punggung Belakang Bungkuk

Beberapa kebiasaan yang tanpa Anda sadari bisa menjadi faktor seseorang memiliki postur tubuh yang kurang cantik. Sehingga ini membuat penampilan Anda menjadi kurang cantik dan terkadang membuat Anda menjadi malu dan tidak percaya diri.
Postur tubuh yang buruk ini biasanya disebabkan oleh cara duduk yang salah, sering membawa tas berat, tidur dengan bantal tinggi, sering menggunakan sepatu hak tinggi atau kelebihan berat badan. Dengan postur tubuh yang buruk akan menimbulkan beberapa efek seperti sakit pinggang, nyeri pada punggung dan juga mudah lelah.
Ini semua bisa Anda perbaiki dengan latihan ringan untuk menjadikan penampilan kembali menarik dan membuat Anda percaya diri, sbb tips-tipsnya:

Pertama. Melakukan beberapa latihan peregangan (streching) secara teratur untuk membantu melebarkan bahu sehingga tidak condong ke depan dan dapat meningkatkan fleksibilitas.

Kedua. Latihlah berdiri dan duduk dengan posisi tulang belakang lurus serta letak pundak dan bahu yang tegak dengan kedua tela…

Menambah Font Style pada MS Office

Menambah Font Style pada MS Office | Font-font pada Ms Office, misalnya Word, Powerpoint, dan Excel memiliki berbagai macam Font Style. Namun, font style bawaan mereka terlalu sedikit dan monoton atau terlalu simpel. Jadi, jika ingin membuat dokumen dengan font style yang lebih stylish kita harus menambahkannya sendiri. Bagaimana caranya? Caranya cukup mudah.



Pertama download dulu font style nyadisini.
Karena file nya berbentuk .RAR maka harus di ekstrak terlebih dahulu.Buka foldernya, kemudian Select all dengan cara menekan tombol CTRL+A pada keyboard, lalu copySelanjutnya, klik start pada windows>Control Panel>Paapearence and Personalization>FontLalu paste file tadi di situ. SELESAI!!! Anda dapat mengeceknya dengan membuka MS Offici. Font ini akan otomatis tersimpan pada windows, jadi sebenarnya tidak hanya menambah font style pada Ms Office saja, namun juga akan menambah font style pada setiap program yang menggunakan teks. Misalnya Photoshop. Corel, dan lain-lain...

Cara Melacak Nomor Handphone (No. HP) Seseorang

Jika kamu sering dimisscall orang, di isengin orang MARAH! Kamu bisa mengecek lokasi mereka, mendeteksi di daerah mereka tinggal, kota penelpon kita . .
Silahkan pakai HLR Lookup Search

Nah disitu kita tinggal memasukkan no telepon yang mau kita lacak lalu klik search.
Berikut Daftar Operator yang dapat dideteksi : 1. Telekomunikasi Selular [Kartu Halo, Simpati, Kartu AS] 2. Indosat (Cellular) [IM3, Mentari, Matrix] 3. Indosat (Fixed) [Starone] 4. Excelcomindo Pratama [XL] 5. Hutchison CP Telecommunications [Three] 6. Natrindo Telepon Seluler [Axis] 7. Bakrie Telecom [Esia] 8. Telekomunikasi Indonesia [PSTN, Flexi] 9. Mobile-8 Telecom (Cellular) [Fren] 10. Mobile-8 Telecom (Fixed) [Hepi] 11. Smart Telecom [Smart] 12. Sampoerna Telekomunikasi Indonesia [Ceria] 13. Pasifik Satelit Nusantara [Byru]
NB: Kelemahan HLR Lookup yaitu : lokasi yang dapat dilacak hanya lokasi pendaftarannya saja. Jadi kalo pemilik HP uda lari ke tempat lain ya nda bekal ketemu deh
Hasil deteksinya pun Sangat Akurat.

Ini adalah has…