Jika pada tips yang lalu, telah diketengahkan cara menambahkan scrollbar pada body postingan maka pada tips kali ini, Tips dan Trik Blog akan mencoba mengetengahkan tips membuat scrollbar di dalam postingan.
Dengan fasilitas Scrollbar ini kita dapat memanfaatkannya untuk membuat
sebagian teks di dalam postingan menjadi tergulung dan memendek.
Misalkan saja, kita ingin mencantumkan kutipan dari tulisan orang lain
di dalam postingan kita dengan teks yang sangat panjang. Nah, dengan
scrollbar ini, kita dapat membuat kutipan tersebut menjadi lebih pendek
tanpa menghilangkan sebagian teks. Jika tertarik, silakan ikuti tipsnya
berikut ini. Jika tidak tertarik, silakan baca-baca yang lain, he he
(promosi).
Langkah-langkahnya sebagai berikut.
1. Login ke http://blogger.com hingga masuk Dasbor >> Tata Letak (layout) >> Edit HTML
2. Copy paste kode berikut ini di atas kode ]]></b:skin>
.scrollbox {
height:100px;
width:400px;
overflow:auto;
}
height:100px;
width:400px;
overflow:auto;
}
Kode
di atas digunakan untuk menetapkan tinggi dan lebar scrollbar yang
dapat kita kustomasi sesuai kebutuhan dan keinginan masing-masing.
3. Kemudian Simpan Template
4. Pada saat posting, tempatkan teks yang ingin di-scrollbarkan (digulung) di antara kode <div class="scrollbox"> dan </div>
Sebagai contoh, untuk membuat teks berikut ini menjadi tergulung, letakkan teks berikut di antara kode <div class="scrollbox"> dan </div>
<div class="scrollbox"> Testing
dan simulasi menggunakan scrollbar di dalam postingan. Testing dan
simulasi menggunakan scrollbar di dalam postingan. Testing dan simulasi
menggunakan scrollbar di dalam postingan. Testing dan simulasi
menggunakan scrollbar di dalam postingan. Testing dan simulasi
menggunakan scrollbar di dalam postingan. Testing dan simulasi
menggunakan scrollbar di dalam postingan. Testing dan simulasi
menggunakan scrollbar di dalam postingan. Testing dan simulasi
menggunakan scrollbar di dalam postingan. Testing dan simulasi
menggunakan scrollbar di dalam postingan. </div>
Kita dapat menambahkan efek warna, ukuran, atau jenis font untuk mempercantik postingan yang hasilnya seperti di bawah ini.
Testing
dan simulasi menggunakan scrollbar di dalam postingan. Testing dan
simulasi menggunakan scrollbar di dalam postingan. Testing dan simulasi
menggunakan scrollbar di dalam postingan. Testing dan simulasi
menggunakan scrollbar di dalam postingan. Testing dan simulasi
menggunakan scrollbar di dalam postingan. Testing dan simulasi
menggunakan scrollbar di dalam postingan. Testing dan simulasi
menggunakan scrollbar di dalam postingan. Testing dan simulasi
menggunakan scrollbar di dalam postingan. Testing dan simulasi
menggunakan scrollbar di dalam postingan.
Screenshotnya seperti di bawah ini.
5. Selesai.
Selamat bereksperimen!!
(sumber : Trick For New Blogger)
Sumber : http://tips-trik-blog.blogspot.com/2009/02/scrollbar-di-dalam-postingan.html
Tidak ada komentar:
Posting Komentar