Cara Membuat Blockquote diblog

Cara Membuat Blockquote diblog
Blockquote merupakan sebuah kotak yang membingkai tulisan tertentu yang menunjukan kalau tulisan itu merupakan sebuah tulisan penting yang perlu mendapat perhatian dari pembaca untuk mendapatkan inti dari bacaan secara keseluruhan. Berbicara mengenai blockquote, kita kadang merasa bosan dengan tampilan blockquote default yang hanya itu-itu saja , adakah cara untuk membuat variasi blockquote dalam blog kita ini? , tentu saja ada. Dengan variasi blockquote yang lebih menarik tidak hanya akan memperjelas pembaca dalam menemukan dan memahami inti bacaan kita, tetapi juga akan memberikan daya tarik tersendiri bagi pengunjung yang tidak terbiasa banyak membaca untuk kemudian mengamati dan membacanya.

Contohnya seperti dibawah ini :

Blockquote merupakan sebuah kotak yang membingkai tulisan tertentu yang menunjukan kalau tulisan itu merupakan sebuah tulisan penting yang perlu mendapat perhatian dari pembaca untuk mendapatkan inti dari bacaan secara keseluruhan. Berbicara mengenai blockquote, kita kadang merasa bosan dengan tampilan blockquote default yang hanya itu-itu saja , adakah cara untuk membuat variasi blockquote dalam blog kita ini? , tentu saja ada. Dengan variasi blockquote yang lebih menarik tidak hanya akan memperjelas pembaca dalam menemukan dan memahami inti bacaan kita, tetapi juga akan memberikan daya tarik tersendiri bagi pengunjung yang tidak terbiasa banyak membaca untuk kemudian mengamati dan membacanya.

Cara otomatis dalam membuat blockquote ini memungkinkan kita untuk tidak lagi harus memasukan kode-kode HTML untuk menampilkan blockquote saat kita membuat postingan blog, karena saat kita mengklik ikon blockquote akan secara otomatis muncul model blockquote yang kita inginkan.

Cara membuatnya adalah sebagai berikut ;

• Pertama masuk ke akun blogger kita.
• Klik fitur rancangan.
• Klik edit HTML.
• Cari kode blockquote dalam kode HTML template blog anda tersebut.
• Hapus kode blockquote tersebut, kemudian ganti dengan memasukan kode HTML blockquote yang kita inginkan.      
• Klik simpan template.

 Copy kode dibawah ini

.post blockquote {
background:#f5f8fa url(http://sites.google.com/site/mujijayaganesha1/img/blockquote.png) no-repeat scroll 0 0;
border-color: #D7E8F0;
border-style: solid;
border-width: 1px 1px 1px 20px;
color: #004276;
font-family: Consolas, "Courier New", Courier, mono, serif;
font-size: 13px;
line-height: 16px;
margin:10px 0 10px 10px;
overflow: visible;
padding: 28px 10px 10px;
width:80%; }
.post blockquote:hover {
background:#FFFFFF url(http://sites.google.com/site/mujijayaganesha1/img/blockquote.png) no-repeat scroll 0 0
}

Atau yang ini

.post blockquote { background: #F3F3F1 url(http://sites.google.com/site/mujijayaganesha1/img/blockquote-orange.gif) ; background-position:; background-repeat:repeat-y; margin: 0 20px; padding: 20px 20px 10px 45px; font-size: 0.9em;} .post blockquote p { margin: 0; padding-top: 10px; }

Keterangan :

• Untuk mempermudah pencarian kode HTML yang dimaksud, klik tombol Ctrl + F pada keyboard anda.
• Selalu biasakan untuk download template blog kita terlebih dahulu sebelum melakukan edit, untuk back up sebagai antisipasi saat kita mengalami kegagalan sewaktu proses editing berlangsung.