Cara Menambahkan Blockquote Pada Artikel

Cara Menambahkan Blockquote Pada Artikel – Blockquote adalah kutipan dari artikel yang dianggap penting atau memiliki artikhusus. Namun pada prakteknya, ada juga yang menggunakan blockquote untukmenuliskan tag HTML, kode CSS atau script pada artikel-artikel tips blogging. Membuat blockquote yang bagus dan kerententu saja sangat penting artinya untuk mempercantik tampilan dari kutipan artikelyang kita buat . Biasanya dalam tiap template bawaan blogger sudah disertakan kode blockquote ini, namun jika tidaktersedia anda pun dapat membuat ataumenambahkan blockquote secara manual. Saya pun sudah memodifikasi blockquote yang ada pada templateThesis ini, dan contoh tampilannya dapat sobat lihat pada postingan sayasebelum ini KamusIstilah Blogger Yang Wajib Dibaca.

Letak kode blockquote dalam template biasanyaditandai dengan kode .post blockquote { atau kode.post-body blockquote {. Dibawah ini adabeberapa contoh blockquote berikut kode css-nya yang dapat sobat tempatkan padatemplate blog  anda.

Kode blockquote 1 :

.post blockquote {

margin: 1em 3em; padding: .5em 1em;

border-left: 5px solid #fce27c;

background-color: #f6ebc1; } blockquote p { margin: 0; }

Kode blockquote 2 :

.post 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

}

Kode blockquote 3 :

.post blockquote { background:#c5c5c5

url(http://1.bp.blogspot.com/-f_Bdt0KTjAM/ThGAdX4ICfI/AAAAAAAAAlg/DJdwW7nkuAE/s320/blockquote.png)no-repeat top left;

padding:10px 20px 10px 45px;

font-style:italic;

border:1px solid #000000;}

Kode blockquote 4 :

.post blockquote {

margin: 10px 10px 10px 20px;

padding: 10px 15px 10px 15px;

line-height: 1.6em;

color: #000000;

background:url(http://2.bp.blogspot.com/_n7xseT2-HDU/TTfSVR6DdyI/AAAAAAAAArQ/ZtQUl-i6dhU/s1600/blockquote%2Bpelajaran%2Bblog.png)

no-repeat left top;

border-left: 10px solid #666666;

}

Kode blockquote 5 :

.post blockquote { background: #F3F3F1

url(http://3.bp.blogspot.com/_7wsQzULWIwo/Swb5Jv9YD4I/AAAAAAAACPc/BJ-zgoLMJXw/s1600/comma-side-orange1.gif);

background-position:; background-repeat:repeat-y;

margin: 0 20px; padding: 20px 20px 10px 45px;

font-size: 0.9em; font: italic 1.2em Georgia, "Times NewRoman", Times, serif; }

.post blockquote p { margin: 0; padding-top: 10px; }

Cara menambahkanblockquote pada template adalah sebagai berikut :

1.      Login pada dashboard blogger anda.

2.      Pilih Rancangan > Edit HTML, centang Expandwidget template.

3.      Carilah kode ]]></b:skin>pada template anda.

4.      Copy kode css blockquote diatas dan paste tepatdiatas kode ]]></b:skin>.

5.      Save template anda.

Untuk cara membuat blockquote pada postingan sangatmudah, cara manualnya adalah teks yang dikutip harus diapit dengan kodeblockquote pembuka <blockquote> dankode blockquote penutup </blockquote>.Trus kalo mau yang otomatis, pada saat berada dalam panel postingan blogger tinggaldiblok saja teks yang mau dijadikan blockquote kemudian klik simbol quotationatau tanda petik, maka teks yang dijadikan blockquote akan di-indentasi (menjorokkedalam) secara otomatis.

Nah dari beberapa contoh blockquote tadi, sobat pundapat mencoba berkreasi dengan merubah warna background, jenis huruf ataumungkin sobat ingin membuat background gambar sendiri ? Boleh saja, karenadengan mencoba-coba sendiri akan membuat pemahaman kita jadi lebih mantap lagi.Semoga tips cara membuat blockquote ini bermanfaat dan selamat mencoba.