Cara Membuat Catatan (Note Box) Berwana di Blogger – pada kesempatan kali ini ini analisyuki akan membagikan bagaimana cara membuat catatan/blockquote berwarna di posting blog.
Sebelumnya saya sudah pernah share cara membuat blockquote berna dengan icon yang berada di sampingnya, namun pada kesempatan kali ini saya akan membagikan cara membuat kotak catatan (note box) simpel dan sederhana pada postingan blog.
Sebenarnya fitur box quote sudah ada di dalam postingan blog kita, namun saya akan membagikan note box ini dengan tampilan warna-warni, sederhana namun menarik dan enak untuk dilihat dan tidak membosankan untuk dilihat karena memiliki warna yang bervariasi.
Penggunaan catatan (note box) berwarna pada blog ini menurut saya sangat bermanfaat, yaitu agar pembaca dapat mengetahui poin-poin penting yang tidak boleh dilewatkan untuk dibaca terdapat isi artikel yang kita buat.
Cara Membuat Note Box Berbagai Warna di Postingan Blog
1. Buka Blog > pilih Tema > kemudian Edit THML
2. Letakkan kode ini tepat berada di atas kode ]]></b:skin> atau </style>
/* Note Box Color */
.note-yellow{background:#f8cf82;color:#000;font-size:15px;position:relative;padding:1.2em 1.5em;margin:1em auto;overflow:hidden;text-align:left;word-spacing:0}
.note-blue{background:#7eaecf;color:#000;font-size:15px;position:relative;padding:1.2em 1.5em;margin:1em auto;overflow:hidden;text-align:left;word-spacing:0}
.note-green{background:#5dc698;color:#000;font-size:15px;position:relative;padding:1.2em 1.5em;margin:1em auto;overflow:hidden;text-align:left;word-spacing:0}
.note-red{background:#fb7073;color:#000;font-size:15px;position:relative;padding:1.2em 1.5em;margin:1em auto;overflow:hidden;text-align:left;word-spacing:0}3. Jika sudah pilih Simpan Tema
4. Untuk menerapkannya di dalam postingan anda > buat Postinga Baru > pilih menu HTML (bukan compose) > kemudian letakkan kode ini di dalamnya
Untuk kote Box Warna Kuning
<div class='note-yellow'>TULIS-CATATAN-ANDA-DISINI</div>Untuk Note Box Warna Biru
<div class='note-blue'>TULIS-CATATAN-ANDA-DISINI</div>Untuk Note Box Warna Hijau
<div class='note-green'>TULIS-CATATAN-ANDA-DISINI</div>Untuk Note Box Merah
<div class='note-red'>TULIS-CATATAN-ANDA-DISINI</div>Sekian Saja Penjelasan dari saya tentang Cara Membuat Note Box Berwar pada Postingan Blog, Jika ada hal yang kurang dipahami bisa langsung bertanya, Terimakasih.
