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

6 thoughts on “Membuat Kotak Scroll pada Postingan di WordPress

Komentar adalah wujud apreasiasi atas artikel saya ^_^

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s