Pada tulisan saya yang sebelumnya, saya menjelaskan bagaimana memodifikasi blockquote standar yang diberikan oleh wordpress. Bagaimana dengan blog yang menggunakan blogspot, apakah bisa membuat blockquote seperti yang ada di wordpress?

Blockquote bisa dibuat di blogspot, karena blogspot memberikan izin bagi kita untuk memodifikasi script html dan CSS.

Begini cara membuatnya:

1. Login ke account blogspot.
2. Click menu Layout dan pilih Edit HTML
3. Check pada kotak Expand Widget Templates
4. Cari kata ]]></b:skin> pada kotak Edit Template. ( Ctrl+F untuk mencari kata ), kemudian sebelum kata tersebut masukkan script CSS blockquote.
5. Kamu bisa mencoba memasukkan script CSS blockquote yang ada di blog saya ini:
   

   .vanhook {
   margin: 1em 3em;
   padding: .5em 1em;
   font-weight: bold;
   font-style: italic;
   border-left: 5px solid #fce27c;
   background-color: #f6ebc1; }

6. Simpan dengan click Save Template.
7. Untuk mencoba, buat posting baru. Untuk membuat blockquote, masuk ke menu Edit Html (di blogger posting ada dua menu yaitu Edit Html dan Compose). Ketik script berikut:
   

   <p class=”vanhook”>kalimat yang akan kamu jadikan blockquote…</p>

8. Lanjutkan kalimat kamu setelah tag </p>.
9. Publish tulisan kamu, dan lihat hasilnya.
10. Kamu bisa mengganti script CSS di atas dengan script yang lain sesuai dengan bentuk blockquote yang kamu inginkan.

Tulisan kamu akan semakin bermakna dan lebih indah dengan adanya blockquote. Happy blogging.

See you at the next tutorial ,

dan jangan lupa kirim saya komentar yah

Apa itu blockquote?

Blockquote merupakan suatu kutipan tulisan penting yang diberi tanda khusus dari tulisan yang lainnya.

Salah satu tampilannya seperti tampilan di atas. Blockquote ini banyak dijumpai di majalah dan juga di beberapa blog dan website. Gunanya untuk memberikan informasi yang penting dari suatu tulisan kepada para pembaca yang ditulis dengan kalimat yang ringkas. Saya juga menyebutnya dengan istilah ” Special Words “.

Di blog yang menggunakan engine wordpress, blockquote memiliki bentuk standar. Tetapi blockquote juga bisa dimodifikasi menjadi bentuk yang lebih menarik.

Bagaimana cara membuatnya supaya lebih menarik?

Supaya lebih menarik, kamu tinggal mengubah beberapa baris script CSS ( Cascading Style Sheet ).  Berikut caranya:

1. Login in ke wordpress kamu.
2. Pada menu Appearance yang ada di sebelah kiri, click Editor.
3. Klik tulisan Stylesheet (style.css) pada menu Styles.
4. Cari tulisan ini:blockquotes { script CSS yang akan dimodifikasi }
5. Modifikasi script CSS sesuai dengan bentuk blockquote yang kamu suka.

Beberapa bentuk blockquote yang bisa kamu coba:

Script CSS nya:

blockquote {
    margin: 1em 3em;
    color: #999;
    border-left: 2px solid #999;
    padding-left: 1em; }

Script CSS nya:

blockquote {
    margin: 1em 3em;
    padding: .5em;
    background-color: #f6ebc1; }
blockquote p {
    margin: 0; }

Script CSS nya:

blockquote {
    margin: 1em 3em;
    padding: .5em 1em;
    border-left: 5px solid #fce27c;
    background-color: #f6ebc1; }
blockquote p {
    margin: 0; }

Silahkan explore script CSS untuk modifikasi blockquote dengan gaya yang kamu suka.

Special thanks to: bang Ipoet dan mas Fikri

Source: CSSnewbie