Membuat Kotak Scroll pada Postingan di WordPress

Saya sering mengarsip artikel mengenai tips blog dalam mempercantik tampilan di blog . Hal yang paling sering saya lakukan dilakukan adalah melakukan editing di bagian template blog itu sendiri. Nah bagian dari artikel yang kemungkinan sering keluar adalah mengenai script/kode yang akan dimasukkan/ditambahkan ke dalam template blog itu sendiri.

Contoh Script/Kode :

<b:if cond=’data:blog.pageType == &quot;item&quot;’>

<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’>

Script ini masih bisa lebih panjang lagi :-(. Nah tentu hal ini akan sangat mengganggu para pembaca 👿 karena harus melakukan scroll ke bawah yang cukup panjang. Kita bisa menyingkat kode tadi dengan meletakkannya ke dalam kotak scroll seperti berikut ini :

<b:if cond=’data:blog.pageType == &quot;item&quot;’>

<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’>

 Pasti akan terlihat singkat kan :-).Nah bagaimanakah cara membuat kotak scroll itu ?

Langkah untuk membuat kotak scroll di wordpress adalah sebagai berikut :

1. Masuk ke akun worpdress – buat postingan baru – masuk di bagian editing html
   (editing html tombol di sebelah visual)
2. Gunakan kode berikut ini : </div style=”overflow: scroll; width: 400px; height: 200px;”/>Isi teks di dalam postingan</div>
3. Hilangkan “/” yang berwarna merah
4. Selamat mencoba dan semoga berhasil 🙂

Advertisements