Cara Modifikasi Blockquote Blogger Agar Lebih Elegan dan Cantik

BroHad.Com - Blockquote atau kata kutipan di blogger biasanya akan tampil berbeda-beda tergantung jenis template yang digunakan, menggunakan quote di blogger biasanya untuk mengkutip suatu paragraf tertentu. Namun pada blog saya sendiri, blockquote saya gunakan untuk berbagai keperluan seperti pengatur kolom untuk kode (saya tidak menggunakan html 'code' untuk menampilkan bagian kode pada blog), dan paragraf penting lainnya.

Perlu anda ketahui, bagian blockquote dapat anda fungsikan dengan menekan tombol berlogo kutip (") di bagian halaman pembuatan artikel di blogger, seperti pada petunjuk gambar berikut.
Jika dilihat, berikut adalah tampilan blockquote yang telah saya modifikasi sendiri pada blog BroHad.Com ini, dan saya rasa tampilan ini sudah cukup elegan dan simpel namun cukup cantik dan nyaman ketika di perhatikan.

Contoh Blockquote teks pendek dari blog BroHad.Com

Ini merupakan teks paragraf yang ada di dalam blockquote, teks ini saya buat pendek karena untuk membedakan tampilan blockquote pendek dengan yang panjang.

 Contoh Blockquote yang melebihi ukuran tinggi 350px

Ini merupakan bagian contoh untuk bagian blockquote yang jumlah teks didalamnya melebihi tinggi 350 pixel, dan akan menampilkan scroll bar di bagian kanan, ukuran tinggi maksimal blockquote saya buat 350px, dan apabila melebihi ukuran tersebut, blockquote akan menampilkan scroll bar di bagian kanan.

Teks 1 contoh blockquote panjang
Teks 2 contoh blockquote panjang
Teks 3 contoh blockquote panjang
Teks 4 contoh blockquote panjang
Teks 5 contoh blockquote panjang
Teks 6 contoh blockquote panjang
Teks 7 contoh blockquote panjang
Teks 8 contoh blockquote panjang
Teks 9 contoh blockquote panjang
Teks 1 contoh blockquote panjang
Teks 2 contoh blockquote panjang
Teks 3 contoh blockquote panjang
Teks 4 contoh blockquote panjang
Teks 5 contoh blockquote panjang
Teks 6 contoh blockquote panjang
Teks 7 contoh blockquote panjang
Teks 8 contoh blockquote panjang
Teks 9 contoh blockquote panjang

Lalu bagaimana cara untuk membuat blockquote seperti blog BroHad.Com ?

1. Silahkan masuk ke edit HTML pada blog anda di bagian tema.

2. Kemudian cari kode "blockquote", perhatikan pada css blockquote, biasanya akan tampil seperti berikut ini
blockquote{kode;kode;kode;kode;}
atau
blockquote {kode;kode;kode;kode;}
seperti penampakan berikut ini
3. Kemudian hapus kode tersebut, dan silahkan anda ganti dengan kode berikut ini
blockquote{background:#f6f6f6;margin-left:2em;margin-right:2em;padding:1em 1em;font-size:85%;overflow-x: hidden;overflow-y:auto;max-height: 350px;border-radius: 15px;}
4. Silahkan anda ubah warna background dengan kode warna html sesuai dengan warna blog anda, dan silahkan anda ganti ukuran tinggi maksimal untuk blockquote sebelum muncul scrollbar di bagian kanan.

5. Jika sudah, simpan perubahan / simpan tema.

Nahh .. begitulah cara untuk membuat tampilan blockquote / quote di blogger agar lebih cantik dan elegan. Penggunaan blockquote menurut saya cukup penting dan sangat bermanfaat untuk membedakan bagian-bagian tertentu dalam paragraf artikel. Jadi silahkan anda coba atau memodifikasi sendiri kode css dari blockquote tersebut.

Terima kasih atas kunjungannya.
Nurhadi Bachtiar
Sebaik-baik manusia adalah yang bermanfaat bagi orang lain. Tidak akan putus amalan seseorang kecuali 3 hal "Sedekah Jariyah, Ilmu yang Bermanfaat, dan Do'a Anak yang Shaleh."

Related Posts

Subscribe Our Newsletter