Empat Cara Membuat Blockquote Posting Blog

Alhamdulillah akhirnya sempat bikin posting lagi, posting kali ini tentang cara membuat blockquote, pernah membuka blog orang dan ada artikel dengan format menarik dimana sebagian teksnya lebih menjorok ke tengah halaman posting ?, itu namanya blockquote.
Cara membuatnya bisa kamu tuliskan script CSS di bagian atas template blog atau sebelum kode ]]></b:skin> script ini fungsinya untuk mengatur tampilan dari teks yang menjorok ke tengah halaman (format teks blockquote).
Contoh script blockquote :

• Script blockquote dengan kotak di sekitar teks yang menjorok ke dalam.
  

.post blockquote {
background:url(http://i34.tinypic.com/11j7yvk.jpg) no-repeat;
padding:10px;
margin:1em 20px;
background-position:10px 10px;
border:2px #000000 solid;
text-align: justify;
}
.post blockquote p {
margin:.75em 0;
}

.

• Blockquote dengan garis vertikal

.blockquote{font-style:italic;
margin:0px 0px 0px 25px;
padding:3px 0px 0px 3px;
border-left:2px solid #63dc8f}
#content blockquote p{margin:3px 3px 3px 3px;padding:5px 0px 5px 3px}

• Blockquote kotak dengan efek hover mouse (I).

.post blockquote {
background:#f5f8fa url(http://eosmate.googlepages.com/blockquoteku2.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://eosmate.googlepages.com/blockquoteku2.png) no-repeat scroll 0 0
} 

• Blockquote kotak dengan efek hover mouse (II).

.post-body blockquote {
background-position:-10px -7px;
border: 1px dashed #fff;
margin: 10px;
padding: 10px;
background:#666;
text-align: justify;
line-height:1.4em;
}
.post-body blockquote:hover{color:#B3FF99; font-size:18px; background:#000;}
.post blockquote{ margin:1em 15px}
.post blockquote p{ margin:.75em 0}

.
Dan untuk catatan. Beberapa template blogger sudah secara otomatis terdapat script blockquote di templatenya, jadi kalau kamu menambahkan script blockquote manual dan tidak berjalan, bisa jadi di template blogger kamu sudah terdapat script blockquote.
Agar blockquote berubah sesuai keinginan kamu, kamu cukup mengganti script blockquote yang telah terdapat di template blog kamu, atau memodifikasi script blockquote sesuai keinginan kamu.

Yups semoga artikel ini bermanfaat, silakan sedot dan selamat mencoba.