Membuat Blockquote Ringan dan Responsive di Blog

Membuat Blockquote Ringan dan Responsive di Blog - Istilah blockquote adalah milik umum dalam dunia bahasa, yaitu sebuah penekanan. Penekanan disini dimaksudkan agar tulisan yang ditampilkan pada blockquote tampil mencolok dan menyita perhatian pembaca.

Tambahkan CSS

Sebelum bisa mempercantik tampilan blockquote di blog, sahabat harus menambahkan baris kode berikut di HTML. Caranya adalah sebagai berikut :

1. Login ke dashboard blogger kemudian cari Theme --> Customize --> Edit HTML. Perhatikan gambar berikut.

2. Salin/copy kode dibawah ini dan taruhlah diatas kode ]]></b:skin>

/* Blockquote by dhika.my.id */
blockquote{background: #f5f5f5;border-left:5px solid #ff4343;margin: 5px;padding:15px;font-size: 17px;color: #575757;;text-align:left}

3. Terakhir klik simpan jika sudah selesai.

Menerapkan blockquote

Nah sekarang cobalah sahabat membuat sebuah blockquote di dalam artikel blog, jika sahabat belum pernah membuat blockquote caranya sangatlah mudah cukup menyeleksi tulisan yang akan dijadikan blockquote dan tekan ikon petik/quotetext.

Berikut merupakan contoh hasil blockquote :

Contoh tulisan yang dibuat dengan blockquote

Bagaimana menarik bukan? 

Semoga pembahasan artikel bagaimana membuat blockquote ringan dan responsive di blog kali ini bisa bermanfaat bagi sahabat semua. Jika masih ada yang kurang paham silakan mengajukan pertanyaan pada kotak komentar dibawah.

Blogger, Content Creator, Graphic Designer, UI / UX Designer.

Post a Comment

© DhikaMedia. All rights reserved. Developed by Jago Desain