Selamat Idul Fitri 1432 H

Mohon Maaf Lahir dan Batin. Selamat Idul Fitri, Kawan...

- YauNi.4ever

Pesan •"̮• ♈ǎυ иȋ •"̮•

Monday, August 8, 2011

Membuat Blockquote Keren

Dari hasil surfing, saya menemukan beberapa definisi.
Blockquote adalah tulisan yang menjorok ke dalam dari batas kiri dan kanan area postingan. by. bangjohan

Blockquote adalah tanda yang digunakan untuk memblock suatu tulisan. Biasanya tulisan tersebut dianggap penting sehingga di block agar pembaca lebih fokus pada tulsan tersebut. by. NN

Blockquote adalah sebuah tag HTML biasanya digunakan untuk menampilkan quote/kutipan. Misalnya, kita menemukan kalimat menarik dari seseorang dan ingin menampilkannya di blog/website – maka digunakanlah blockquote. by. denysri

dari beberapa definisi diatas kita pastinya sudah mengerti apa yang dimaksud dengan BlockQuote..,


Baiklah, sekarang saya akan memberitahukan bagaimana cara membuat BlockQuote yang keren ??
Langkah yang harus sobat lakukan:
1. Login ke Akun Blogger
2. Klik Design/Rancangan, kemudian pilih edit html
3. Centang Expand Widget Template (BackUp Template terlebih dulu)
4. Cari kode: ]]></b:skin>
Lalu letakkan kode CSS berikut! diatas kode ]]></b:skin>

.post-body blockquote{  background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiO_P3r0SHZOlcqo2QDxn7uxKnyyftwY76OtGP4HEvfY-WLU291JPPsK1fnbhRGydStKNoS95a-1clKch9QpSKaiMKCZBS8BwUIWcuyoleusFwObp7pkMyLb8NP4TZKScbPndLjtcyCYH2R/s1600/quote.png) no-repeat top left;  text-shadow:2px 2px rgba(0, 0, 0, 0.9); font-size:15px; color:#CC0099;  margin:0;  padding:0 10px 0 35px;  line-height:1.3em}
.post-body blockquote:hover{color:#E60066}
.post blockquote{ margin:1em 15px}
.post blockquote p{ margin:.75em 0}
Nb. Kamu dapat mengedit kode yang berwarna diatas sesuai selera masing-masing.

5. Save Template dan lihat hasilnya..

Ini ada beberapa gambar BlockQuote yang keren..
1. http://lh5.ggpht.com/_7Y9pl24WpQY/S8TbzURLbiI/AAAAAAAADW8/3wp5OomCSv8/blockquote2_thumb%5B2%5D.png

2. http://photoserver.ws/images/ZXJe4cdc41db278a2.png
3. https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3_8HBg1-crrz5xdXCtsR4lVevzPhjX13H6KUltqNzg_ESR5_-D_mU8Yr3LV8TJg3HQX-UVDlhUuhsuo7KmrH49S1OjQOyAL-4Jb5VZCQq_JC6skvVYG0KepDm0DWgoOPok-uL0gJDfc4/s1600/blockquote.gif




Note.
Thanks for reading! Suka dengan artikel ini? Kamu bebas menyebarluaskan, mau menggunakan sharing is sexy tool. Atau kamu mau co-pas, gunakan kode yang ada didalam text area sebagai sumber/link back artikel ini. Gunakan Etika!!

9 comments:

Galaxy-zone 7 said...

wah keren sob

visit back please
http://kehin.blogspot.com/

Muh. Janualdi said...

Keren ni blockquote,,
follow juga ya
www.janualdi.blogspot.com

Muh. Janualdi said...

Gan, tau gak cara buat blockquote pake scroll...?

hendri said...

yang nomor tiga sudah saya pake gan,,mantap..makasih ya,,

Hendra Hacc said...

Saya comot yang #1. Kereenn... :f

fhefy mandja said...

thank u maaz infonya...

fiska said...

bungkus yg nomor 3 deh buat blogku..^^

Unknown said...

hmm...
lumayan..
thnx infonya

Acep-Computer said...

Waw keren banget blockquote ya kaka ?
Izin make ya http://acep-computer-science.blogspot.com/2013/01/cara-membuat-social-sharing-css-keren.html

Post a Comment

Silahkan tinggalkan komentar sebagai respon atau untuk bertanya.
Jangan SPAM ya, No SARA, No P0RNo!
Mohon tidak meninggalkan link di dalam comments.
Komentar berisi LINK & tidak sesuai judul akan segera dihapus!

Twitter Delicious Facebook Digg Stumbleupon Favorites More

 
Template by Premium Blogger Themes | Modified and Enhanced by YauNi
Related Posts Plugin for WordPress, Blogger...