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)
0 comments:
Posting Komentar