Membuat Blockquote dengan berbagai variasi pada blogger


Mempercantik tulisan pada posting merupakan cara yang paling baik untuk menambah traffick, karena pada prinsipnya sebagus apapun blog yang kita design yang menjadi penentu adakah ISI POSTING

Mempergunakan fasilitas blockquote adalah salah satu alternatif yang bisa dipakai untuk melakukan penekanan atau menunjukan kutipan pada artikel yang kita tulis.
Blockquote sebenarnnya sudah ada pada blogger ( lihat tanda kutip " pada menu posting baru ) sesuai dengan standart template masing masing blog.
Untuk melakukan perubahan pada blockquote standart bisa dilakukan dengan cara :
Modifikasi blockquote standart template yang ada
    Untuk lebih jelasnya silakan lihat uraian berikut ini :

    CARA PERTAMA, Modifikasi blockquote standart template yang ada
    • Login Blogger.com
    • Masuk ke Setting - Design - Edit HTML
    • Cari kode  
    .post blockquote 
    .........  dst  
    }
    .post blockquote:hover
    .........  dst 
    }
    .post blockquote p
    .........  dst 
    }

    ( ini adalah kode standart blockquote bisa dilakukan perubahan sesuai kebutuhan )


    Ganti dengan kode diatas dengan kode berikut :

    .post blockquote {
    background:#f5f8fa url(http://lh6.ggpht.com/_wC8_9aR_6uE/S-7eHs71vkI/AAAAAAAAC4M/SPzkp3SsYg4/bintang%20kelip.gif) no-repeat scroll 0 0;
    border-color: #D7E8F0;
    border-style: solid;
    border-width: 1px 1px 1px 20px;
    color: #004276;
    font-family: Consolas, "Courier New", Courier, mono, serif;
    font-size: 13px;
    line-height: 16px;
    margin:10px 0 10px 10px;
    overflow: visible;
    padding: 28px 10px 10px;
    width:80%; }

    .post blockquote:hover {
    background:#FFFFFF url(http://lh6.ggpht.com/_wC8_9aR_6uE/S-7eHs71vkI/AAAAAAAAC4M/SPzkp3SsYg4/bintang%20kelip.gif) no-repeat scroll 0 0
    }

    .post blockquote p {
    margin:.75em 5;
    background:url(http://lh5.ggpht.com/_wC8_9aR_6uE/S_OXycnYicI/AAAAAAAAC60/lAY-RahuhKw/exit.jpeg) no-repeat;
    padding:20px;
    background-position:bottom right;
    }

    Simpan dan lihat hasilnya. ( hasilnya sama dengan di artikel ini )
    • Silakan dirubah sesuai dengan template yang ada ( kode warna, background image, border, margin, padding ) sesuai kebutuhan.

    terima kasih..
    semoga bermanfaat...!

    About Mahdi e

    - Berbagi itu indah -

    22 comments:

    1. Wah muantabz tuh Sob....ada efek bintang2nya hhe, klo blogger laen ngasih BlockQuote pasti warna -warni haha.......makasih udah d'share.....ikutan save ah........semangat N suskes slalu Sob!!!

      BalasHapus
    2. Great Place to download unlimited templates blog with more themes and favorite colors to support the blogging activities and bring a lot of traffic

      BalasHapus
    3. makasih komentarnya..!
      salam sukses..!

      BalasHapus
    4. Another nice post from your blog. I really find your posts interesting so I have bookmarked your site.

      BalasHapus
    5. bukan yang gini maksudnya...
      yang dipostingan ini..
      http://kibagus-homedesign.blogspot.com/2009/12/cara-membuat-background-untuk-posting.html
      kalau di blockquote kan bisa...
      hasilnya gini..
      http://sukisukisukasuka.blogspot.com/2010/06/romeo-and-juliet-hey-say-jump-lyrics.html
      lihat deh..
      aneh kok bs jadi gini...

      BalasHapus
    6. @april.. pilih salah satu blockquote atau scroll..! biar hasilnya maksimal..!

      BalasHapus
    7. masih belum ngerti..
      maksudnya mau buat yang seperti di http://sukisukisukasuka.blogspot.com/2010/06/romeo-and-juliet-hey-say-jump-lyrics.html
      tapi kok banyak sisa dibawahnya padahal waktu di tulis gak gitu(sebelum di post)
      udah di edit tetap gitu..
      gak usah pakai scroll gmn?
      maksudnya sesuai dengan panjang postingnya..

      BalasHapus
    8. @april.. kode blockquote kamu double.. jadi panjang..
      cob kamu edit tapi pada bagian kode HTML di posting .. nanti kelihatan kode yang double..!

      BalasHapus
    9. nice post sahabat, ijin di-save untuk dipelajari

      BalasHapus
    10. wah....
      maksih banget mas...
      saya coba praktekin dan berhasil.
      tengkyu... :D

      BalasHapus
    11. punya DEMO nya gak......

      BalasHapus
    12. @b koko. hasilnya sama dengan yang di artikel ini..!

      BalasHapus
    13. kok gtu doank gk ad kreasiny sob, ada image lain gk? buat blockquote ???
      share d Cek Info yah :D

      BalasHapus
    14. @asmara..!
      silakan diganti kode warna untuk huruf dan background serta image sesuai kebutuhan...!
      http://kibagus-homedesign.blogspot.com/2010/01/background-dan-animasi-blog.html

      BalasHapus
    15. Mantap sob.. Thanks 4 share

      BalasHapus
    16. mantap dah artikelnya
      http://acemaxs31.com/obat-darah-tinggi-tradisional/

      BalasHapus
    17. keren artikelnya sangat bermanfaat :)
      http://jellygamatgoldg31.com/obat-herbal-jantung/

      BalasHapus
    18. Mantap Gan Artikelnya (y)
      http://grosirobatjellygmat.com/
      http://obatjellygamatgoldg.net/
      http://jellygamat-gold.net/
      http://jamutradisionalmujarab.com/
      http://jellygamatgoldgpro.com/

      BalasHapus
    19. terimakasih infonya sangat bermanfaat sekali :)
      http://kedaijellygamatgoldg.com/
      http://kedaijellygamatgoldg.com/jelly-gamat-gold-g/

      BalasHapus
    20. Wah ... terimakasih nih gan sudah berbagi ilmunya :shy:
      ditunggu kunbalnya ya
      http://obatleukimia.jellygamatluxor.biz/cara-menghilangkan-kesemutan-secara-alami/

      BalasHapus
    21. ini sangat menarik sekali... dan akan saya coba untuk mempraktekan nya scara langsung
      pengobatan untuk sembuhkan kista liver

      BalasHapus

    Note :

    Komentar yang mengandung usur pornografi / sara / kekerasan akan dihapus.
    Terima kasih komentarnya...!
    Semoga bermanfaat...!