Cara Membuat Scroll Blockquote Otomatis di Blog A Z K A V E I R O: Cara Membuat Scroll Blockquote Otomatis di Blog
4

Cara Membuat Scroll Blockquote Otomatis di Blog

Share on :

Apa sih yang di maksud dengan Blockquote itu? Blockquote mrmpunyai fungsi sebagai wadah/penanda kata-kata yang di anggap penting di sebuah artikel blog.

Pertemuan kali ini kita akan belajart memberi batasan tinggi maksimal yang sehinnga akan memunculkan fungsi scroll untuk bergulir kebawah pada blockquote, blockquote dengan fungsi scroll lebih efektif di bandingkan blockquote yang tidak memiliki fungsi scroll, karena jika kata-kata yang di anggap penting terlalu banyak menjadikan blockquote memakan tempat yang panjang ke bawah dalam postingan.

Blockquote dengan fungsi scroll kali ini memiliki ototmatis ketinggian maksimal yang bila tinggi dari kotak blockquote tidak mencapai batas yang di tetapkan, maka kotak akan tetap(scrollnya tidak muncul), dan jika melebihi tinggi yang ditentukan, maka akan muncul fungsi scroll(tombol gulir kebawah). tergantung bagaimana anda memodofikasinya. Kotak blockquote akan tetap dan blockquote nantinya otomatis memiliki scroll pada bagian kanan blockquote bila tinggi kotak blockquote mencapai batas yang telah ditentukan.
Blockquote kali ini menggunakan CSS, jadi anda tidak perlu repot2 mengatur pada tiap postingan anda lewat Edit HTML. bagi anda yang berminat untuk menerapkan trik ini, silahkan ikuti langkah2 dibawah ini :

Cara Membuat Scroll Blockquote Otomatis Pada Postingan Blog
1. Log in ke blogger
2. dari Dasbor klik Template dan masuk ke Edit HTML
3. Gunakan F3 untuk mencari kode seperti berikut :
.post-body blockquote {
-----------------
-----------------
}
Gunaka Ctrl + F lalu ketik blockquote
4. Jika sudah ketemu Ganti kode diatas  dengan kode dibawah :
.post-body blockquote {
overflow:auto;
max-height:400px;
font-family:'Trebuchet MS';
background:#333;
box-shadow:0 0 0.5em #333;
-webkit-transition:all .2s ease-out;
-moz-transition:all .2s ease-out;
-o-transition:all .2s ease-out;
color:#fff;
margin:10px 0;
padding:5px;
}
5. Jika kode pada langkah ke-3 tidak di temukan cari saja
.post body
--------
--------
}
4. dan letakkan kode berikut di bawah kode di atas :
.post-body blockquote {
overflow:auto;
max-height:400px;
font-family:'Trebuchet MS';
background:#333;
box-shadow:0 0 0.5em #333;
-webkit-transition:all .2s ease-out;
-moz-transition:all .2s ease-out;
-o-transition:all .2s ease-out;
color:#fff;
margin:10px 0;
padding:5px;
}
5. Simpan Template dan lihat hasilnya di postingan sobat yang sudah ada blockquotenya.

NB : Silahkan anda modifikasi sendiri sesuai kreatifitas anda, misalnya, mengatur tinggi, memberi background dan lain sebagainya.

jika ada masalah dengan pemasangan kode diatas, silahkan kontak admin lewat kolom komentar dibawah.
Selamat mencoba dan semoga berhasil, Semoga Bermanfaat.

PPC Iklan Blogger Indonesia

Ditulis Oleh : Azka Latif Noor ~ Tips dan Trik Blogspot

Azka Latif Noor Sobat sedang membaca artikel tentang Cara Membuat Scroll Blockquote Otomatis di Blog. Oleh Admin, Sobat diperbolehkan mengcopy paste atau menyebar-luaskan artikel ini, namun jangan lupa untuk meletakkan link dibawah ini sebagai sumbernya

:: Get this widget ! ::

4 komentar:

Kreasi Anak Garut mengatakan...
Reply

demo screenshoot nya gmana Mas? saya coba ya Trimaksih sblumnya :)

Azka Aveiro mengatakan...
Reply

@Kreasi Anak Garut nanti jadinya seperti di postingan ini mas blockquote'a. makasih dah mampir

seoskul mengatakan...
Reply

wah tengkyu berat sob...untuk ilmunya, akan langsung saya praktekan

:)

download games mengatakan...
Reply

thx sob info'y
http://duniagame7.blogspot.com/

Posting Komentar

BLOG INI DOFOLLOW .
Silahkan tinggalkan komentar dan kritik sobat, tapi mohon jangan SPAM ya..!
Komentar SPAM akan di HAPUS oleh admin.
Komentar yang membangun sangat dibutuhkan oleh blog ini.
Terima Kasih.

Back to Top