Tips Mengganti Warna Background Blockquote

Posted by Herman on Tuesday, November 04, 2008 7 comments

blockquoteUntuk template tertentu, pada bagian blockquote akan diberi warna agar tampilan template terlihat lebih unik dan menarik namun jika anda tidak suka dengan warna yang diberikan. Anda bisa mengganti warna background blockquote dengan warna lain yang anda inginkan hanya sedikit modifikasi pada kode css template anda.

Nah bagi anda yang belum tahu apa itu Blockquote. Blockquote adalah tag HTML yang digunakan untuk menampilkan quote/kutipan pada artikel. Contoh tampilannya seperti ini:

blockquoteUntuk mengganti warna kotak blockquote. Ikuti langkah-langkah berikut:

1. Pertama login ke Blogger. Klik Design -> Edit HTML

2. Cari kode berikut:

post-body blockquote {
padding:3px 15px;
background:#53de61;
margin:5px 0px;
color:#930;
border:solid 1px #32c45f
}
atau
blockquote {
padding:3px 15px;
background:#53de61;
margin:5px 0px;
color:#930;
border:solid 1px #32c45f
}
Catatan:
Yang perlu anda perhatikan adalah kode berwarna merah sedangkan kode berwarna biru pada setiap template berbeda-beda.

3. Kalau sudah ketemu, ganti kode yang dicetak tebal biru pada property background dengan kode warna yang anda inginkan. Contohnya saya mengganti dengan #ffffff yang merupakan kode warna putih maka hasilnya menjadi seperti ini:

blockquote
Selamat mencoba dan semoga bermanfaat.


Tambahan:
Bagi anda yang tidak mengetahui kode warna. Silahkan baca disini

Untuk menghilangkan border atau garis tepi blockquote, ganti 1px pada property border menjadi 0px.


Happy Blogging...!


Recent Posts:

7 comments

Ganesha said... 20 March, 2009
kok gak berhasil yaa?? warnanya tetep gak mau berubah... :| ~x(
Anonymous said... 21 March, 2009
kode warnanya salah kali. coba dicek lg. smoga berhasil
d3d1m4th said... 23 March, 2010
mas saya dah nyoba pa yang mas ajarkan, hanya da yang belum saya ngerti...
gimananya cara ngilangin garis tepi di kotak daftar isi?.... belum mudeng saya....
Lukman Khakim said... 14 September, 2010
saya mau bertanya, script pd templete sy seperti ini

blockquote{
margin: 10px 0 0;
background: #99FF99;
}

blockquote p{
padding: 20px;
}

blockquote blockquote{
margin: 0 20px;
background: #F2F5A9;

nah, sudah saat edit2, tapi hasilnya nihil, bagaimana menurut sobat, mohon bantuannya pd blog saya, thanks
latipz said... 21 June, 2011
Sedang dicoba gan,, moga2 berhasil.. he :-t
http://latipzhomedesign.blogspot.com/
Anonymous said... 26 October, 2011
klw ganti warna blok yg tulisan'a di quote gmna ya :-/
Anonymous said... 31 October, 2012
klo bingung ganti warnanya karena gak tau huruf dan angka setelah tanda #, coba aja liat di di pengaturan twitter, pas di desainnya, disitu kan ada pilihan warna backgroud Diatas tulisan Done

https://twitter.com/settings/design

coba liat..

:)) :)] ;)) ;;) :D ;) :p :(( :) :( :X =(( :-o :-/ :-* : 8-} ~x( :-t b-( :-L x( =))

Post a Comment