Menulis

Cara Menambah Blok Kutipan (Blockquote) di Posting Blog

Posted by Romel Tea ● Follow @romeltea ● Like Romeltea Media on Facebook

Cara Membuat, Memodifikasi, Mengubah, atau Memasang "Blok Kutipan" (Blockquote) di Posting Blog.

Cara Menambah Blok Kutipan (Blockquote) di Posting Blog
BLOCKQUOTE adalah salah satu aspek atau elemen penting dalam posting blog ataupun situs web. "Blok Kutipan" ini bagian dari highlight tulisan (teks) agar tulisan di media online lebih "user friendly" --bikin nyaman pembaca.

Fungsi blockquote yaitu memberi tekanan pada bagian/kalimat tertentu dalam naskah online dan/atau "kutipan beneran" --menampilkan kutipan langsung-- sebagaimana halnya Soundbite di radio atau Video Clips di televisi.

Ringkasnya, "blok kutipan" di postingan blog atau sajian naskah online berfungsi:
  1. Mempercantik tampilan naskah.
  2. Menarik perhatian (eye catching).
  3. Menunjukkan bagian penting.
  4. Meningkatkan "scannability" sebagaimana disarankan pakar web usability Jakob Nielsen.
Contoh penggunaan blockquote ada di posting Di Balik Kemenangan Persib Bandung. Ada dua kotak kutipan di sana. Cekidot saja ya :)

Alinea berikut ini juga contoh "blockquote" di posting blog:
Desain Web atau Template SEO Friendly biasanya sudah membuat kode khusus buat kotak kutipan. Kota tinggal "Select All" kalimat atau alinea yang akan di-blockquote lalu klik tombol "Quote".

Cara Menambah Blok Kutipan (Blockquote) di Posting Blog

Di template blog yang saya gunakan ini juga sadah ada, namun saya modif biar "lebih berasa" dengan kode yang saya comot dari CSS Trick berikut ini.

blockquote {
  background: #f9f9f9;
  border-left: 10px solid #ccc;
  margin: 1.5em 10px;
  padding: 0.5em 10px;
  quotes: "\201C""\201D""\2018""\2019";
}
blockquote:before {
  color: #ccc;
  content: open-quote;
  font-size: 4em;
  line-height: 0.1em;
  margin-right: 0.25em;
  vertical-align: -0.4em;
}
blockquote p {
  display: inline;
}

Jika Anda akan menggunakannya juga di blog blogspot, tinggal:
1. Klik "Template" > "Edit HTML"
2. Cari (Ctrl+F) kode "blockquote".
3. REPLACE dengan kode di atas.
4. Save Template!

Contoh-contoh blockquote lainnya bisa disimak antara lain di Smashing Magazine.

JENIS BLOCKQUOTE GAMBAR
Jenis kotak kutipan lain yang lebih menarik adalah "image blockquote". Salah satu fungsinya, jika gambarnya menarik, akan di-share oleh pengunjung ke akun Pinterest mereka. Wasalam. (www.romelteamedia.com).*

Author:

I am a Blogger, Media Practisioner, and Practical Communication Trainer. I share my own knowledges, experiences, and skills about practical communication - writing, speaking, blogging - and my hobbies and concerns. Visit my official website Romeltea.

Previous
« Prev Post
0 Komentar untuk "Cara Menambah Blok Kutipan (Blockquote) di Posting Blog"

You comment, I'll visit back your blog. If you have one. Komentar SPAM dan LINK AKTIF tidak akan muncul.