Bibit We Es - Berita Terbaru, Kabar Terkini, Hot News, Belajar Blog, Bisnis Online, Personal Web dan Make Money Online

GRATIS Gems COC Terbaru

Membuat Blockquote Cantik

cara membuat blockquote, membuat tanda petik unik, membuat block quotation menarik Sebelum melanjutkan postingan tentang cara pasang gambar/foto di posting lewat HP yang sampai artikel ini diterbitkan sudah sampai pada cara kedua yang lebih mudah, kini saatnya saya mencoba menjawab pertanyaan dari seorang sahabat yang menanyakan kurang lebih seperti ini: "Teks menjorok kedalammu koq bisa cuantiq gt ya Bit, gmn tuh scriptnya, mbok aku di ajari". Gemana ya, lha wong saya juga nggak tahu, karena kodenya sudah ada di dalam barisan CSS template gratisan ini, cuma saya coba belajar utak-atik saja, eh ternyata malah ada yang bilang cantik :p
Memang seperti apa sih blockquote itu? Dan bagaimana sih cara membuatnya?

Blockquote atau yang pernah saya sebut sebagai teks menjorok ke dalam adalah sebuah kotak area yang diciptakan dengan tag <blockquote> dan ditutup dengan tag </blockquote> dan untuk blog ini hasilnya seperti contoh di bawah ini:

Mohon dukungannya dalam kontes Belajar SEO Para Pemula dengan memasang kode ini di halaman blog anda:

<strong><a href="http://www.bi2t.com/2009/05/belajar-seo-para-pemula.html" title="Belajar SEO Para Pemula" target="_blank">Belajar SEO Para Pemula</a></strong>

Nah, kotak di ataslah yang saya maksud dengan blockquote yang (katanya) cantik. Berikut cara membuat atau yang yang lebih tepat memodifikasi tampilan blockquote.

  1. Login ke blogger.com - Tata Letak - Edit HTML.
  2. Jangan lupa centang kotak Expand Template Widget.
  3. Cari kode ]]></b:skin> , kemudian letakkan script ini di atasnya:

    blockquote {
    margin: 10px 10px 10px 20px;
    padding: 10px 15px 10px 15px;
    line-height: 1.6em;
    color: #000000;

    background: #e0ffff;


    border: 2px solid #4aa02c;

    border-left: 20px solid #4aa02c
    }

    Sedikit keterangan untuk pewarnaan:
    • color: #000000; » pewarnaan teks di dalam kotak blockquote. Ganti #000000 dengan kode warna yang anda inginkan.
    • background: #e0ffff; » pewarnaan latar belakang (background) kotak blockquote. Ganti #e0ffff dengan kode warna yang diinginkan.
    • border: 2px solid #4aa02c; » pewarnaan garis tepi (border) kotak blockquote. Ganti #4aa02c dengan kode warna sesuai selera anda.
  4. Simpan template.
    Dan lihat perubahan pada kotak blockquote blog anda.


WARNING!
Hati-hati sebelum memasang script blockquote di atas, apabila di dalam barisan CSS Template anda sudah terpasang kode blockquote, maka script di atas tidak akan berjalan. Jadi, sebelum memasang, coba cari dulu siapa tahu kode blockquote-nya sudah ada (cari saja dengan find text: blockquote , dan pastinya kalau memang sudah ada berarti kodenya di atas ]]></b:skin> dan anda hanya perlu mengeditnya.

Semoga berhasil dan bermanfaat.

Share on Facebook
Share on Twitter
Share on Google+
Tags :

Membuat Blockquote Cantik sudah dibaca? Ini artikel lainnya: