Baca Juga:
Sebenarnya kotak catatan ini sangat terinspirasi dari blog www.arlinadzgn.com karena keseringan lihat melulu kotak catatan ini hampir disetiap postingannya. Akhirnya saya penasaran bagaimana sih caranya membuat kotak catatan seperti itu. Dan saya pun menemukan cara yang cukup simple sehinggga mudah dipraktekkin.
Oke tanpa basa-basi lagi, langsung saja mari simak cara membuat kotak catatan ini:
Cara Membuat Kotak Catatan Paling Keren Di Blog
- Masuk ke Blogger
- Pilih Template > Edit HTML
- Carilah dan Copy paste kode di bawah ini tepat di atas kode
</head>
<style type='text/css'>
/*Blockquote Catatan*/
.post-body blockquote {
text-align: left;
background: #6591c2;
position: relative;
display: block;
padding: 55px 20px 20px;
color: #fff;
margin: 10px 0;
border-radius: 3px;
}
.post-body blockquote:before {
position: absolute;
content: 'Catatan';
background: rgba(255,255,255,1);
right: 3px;
left: 3px;
top: 3px;
padding: 5px 20px;
display: block;
font-weight: 700;
border-radius: 3px 3px 0 0;
color: #6591c2;
}
.post-body blockquote:after {
position: absolute;
content: '\f027';
right: 10px;
bottom: 5px;
font-family: FontAwesome;
font-style: normal;
font-weight: normal;
font-size: 160%;
color: rgba(255,255,255,.6);
}
</style>
- Simpan
Tahap selanjutnya cara menampilkannya ke dalam postingan, simak lagi gan:
- Buatlah postingan terbaru
- Terlebih dahulu anda tulislah sebuah kalimat untuk catatan tersebut.
- Selanjutnya Block semua kalimat catatan anda
- Setelah terblok semua > klik Quote (lihat gambar biar mengerti).
- Setelah klik Quote maka akan secara otomatis terbungkus.
- Selesai, silahkan lihat hasilnya.
Demikian cara Membuat Kotak Catatan Keren Di Blog ini, semoga bisa dipratekkan di blog anda semua. Dijamin tampilan blog anda akan semakin menarik dan keren karena tambahin kotak catatan ini.