Senin, 19 Oktober 2015

Cara Membuat Scroll Pada Blockquote Di Postingan

Oke kali ini saya akan membagi cara membuat scroll pada Blockquote. Seperti apa blockuote itu? Mari kita lihat gambar di bawah ini.

Cara Membuat Scroll Pada Blockquote Di Postingan
Cara Membuat Scroll Pada Blockquote Di Postingan1


Cara Membuat Scroll Pada Blockquote Di Postingan
Cara Membuat Scroll Pada Blockquote Di Postingan2
Nah seperti pada gambar diatas, jika saat kamu membuat postingan lalu kalimat yang kamu pilih dengan Blockquote/Quote yang ditandai oleh panah merah maka untuk Template Default tulisan akan menjorok ke kanan beberapa pixel fungsinya untuk penekanan terhadap kalimat yang akan kita tekankan. Nah untuk beberapa temlate blockquote sudah dimodifikasi sedemikian rupa oleh CSS agar tampilan lebih menarik, contohnya seperti pada blog ini.

Yuk lihat contoh blockquote pada template yang digunakan oleh RiseOfBlogger seperti apa, lihat dibawah ini.

Cara Membuat Scroll Pada Blockquote Di Postingan
Cara Membuat Scroll Pada Blockquote Di Postingan2
Jika kamu ingin melihat contoh langsung bisa klik di salah sau artikel saya yang ini Cara Membuat Laman Contact Us )

Yang diberi kotak merah lah yang disebut dengan blockquote, sementara panah merah menunjukkan scroll yang akan kita buat.

Lalu apa fungsi scroll pada blockquote?


Karena blockuote seringkali diisi oleh kode-kode html misalnya seperti contoh gambar diatas, dan kode tersebut lumayan banyak sehingga membuat kode panjang hingga ke bawah, nah dengan scroll ini lah kita batasi seberapa tinggi/panjang yang akan terlihat pada postingan yang tentunya dapat kita atur ketinggian nya.

Cara Membuat Scroll Pada Blockquote Di Postingan


Caranya sangat simple sekali teman, kau hanya perlu menambahkan kode dibawah ini 
max-height:250px; overflow:auto;
kedalam tag blockquote { pada CSS style.Ikuti cara dibawah ini.

  • Buka menu Template > Edit HTML
  • Tekan CTRL+F dan cari kode ini blockquote {
  • Dan masukkan max-height:250px; overflow:auto; kedalam kode blockquote {
  • Hingga seperti ini blockquote { max-height:250px; overflow:auto;

Cara Membuat Scroll Pada Blockquote Di Postingan
Perhatikan yang warna kuning (klik gambar untuk memperbesar)

  • Klik Simpan Template jika sudah selesai
Keterangan: max-height:250px (250 ubah tinggi sesuai yang kamu inginkan)

0 komentar

Posting Komentar

1. Tolong sebelum berkomentar Dibaca terlebih dahulu.
2. Berkomentar yang relevan sesuai artikel
3. Gunakan bahasa yang baik, yang tidak mengandung SPAM, SARA, Pornografi