Blockquote merupakan tempat dimana Anda dapat menempatkan suatu kutipan artikel penting dan menarik untuk mudah dan segera ditemukan oleh pembaca. Biasanya blockquote dimanfaatkan para blogger untuk meletakkan postingan script HTML seperti artikel tutorial saya ini, agar mudah ditemukan oleh pembaca blognya.
Berikut ini beberapa blockquote dari berbagai blogger yang dapat anda jadikan contoh mode untuk membuat blockquote pada blog anda.
Cara Mengganti/memasang Blockquote blog secara otomatis disetiap artikel!
- Pertama-tama masuk ke akun Blogger anda.
- Masuk ke Template >> Edit HTML
- Lalu Cari kode dibawah ini dengan menekan CTRL+F
.post-body blockquote {.........}
atau
.post blockquote {.........}
- Jika sudah ketemu langkah selanjutnya kode yang berwarna merah dan bertitik-titik (kode blockqoute setiap template berbeda-beda, jadi saya pake titik-titik aja sebagai pengganti ) ganti dengan salah satu kode dari 22 kode blockqoute dibawah ini
Misalnya :
.post-body blockquote {background-color: #f6ebc1;}
Rubah menjadi :
.post-body blockquote { margin: 1em 2em; border-left: 1px dashed #999; padding-left: 1em; } blockquote p:first-letter { float: left; margin: .2em .3em .1em 0; font-family: "Monotype Corsiva", "Apple Chancery", fantasy; font-size: 220%; font-weight: bold; } blockquote p:first-line { font-variant: small-caps; }
Itu tadi hanya contoh, silahkan anda gunakan script code dibawah ini. Sesuai dengan pilihan anda.
Code:
.post blockquote { margin : 0 20px; padding: 10px 20px 25px 20px; background : #9FCFFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5PMCIlsDtn5o6HnU6xOptcSul0uzMLPr5NBrOm-HcmR-tfHCcFvvgz4JPMFIyvPNJIQCLRNEaVGm-APgJ87L085_26mlr3b4AiaOrjLywHNxEDWIBJtPgSNc0CBAsJVdLWZwQUdqQM5Y/s400/block22.gif) no-repeat right bottom; font: bold .9em "comic sans ms", arial, Helvetica,verdana, Georgia; color : #484848; border: 5px dashed #fff; } .post blockquote p { margin: 0; padding-top:10px; }
Code:
blockquote{ background-color: transparent; border-top: 3px double#DC143C; border-bottom: 3px double #DC143C; padding: 5px; font-style: oblique; font-size: 1em; margin-left: 5%; margin-right: 5%; }
Code:
blockquote { margin: 1em 3em; padding: .5em 1em; border-left: 5px solid #fce27c; background-color: #f6ebc1; } blockquote p { margin: 0; }
Code:
blockquote { background: #484B52 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQfMe0ugqbw9SfNEqJt40_A2edUl54uTptkBmhsDjIfGMl6wIGWrw4TOqZr1rQ5VIjHO7_W-IUuw_oTJzTluUVheP0I9naRim79pqGNbsDFWES7l6VnflH6v0B-TQTKwmSKsrssbe5Tuw/s1600/green-black-side.gif) ; background-position:; background-repeat:repeat-y; margin: 0 20px; padding: 20px 20px 20px 50px; color:#C7CACF; font: normal 0.9em Helvetica, verdana, serif, Georgia, "Times New Roman"; } .post blockquote p { margin: 0; padding-top: 10px; }
- Jika sudah, silahkan anda simpan terlebih dahulu.
- Untuk melihat hasilnya , silahkan anda melakukan postingan dengan cara blok kata-kata yang ingin anda masukkan dalm blockquote. lalu klik seperti tanda " ,kemudian klik pratinjau atau publikasikan. terserah anda sendiri.
Bagaimana jika anda ingin membuat secara manual?
Cara menggunakan Blockquote secara manual :
<blockquote>Kode Yang Kamu Ingin Masukkan/ Text Yang Ingin Kamu Masukkan</blockquote>
Catatan : Untuk menggunakan blockquote secara manual terlebih dahulu kamu harus memilih mode HTML dalam post editor kamu.
Selamat mencoba!
Posting Komentar