Cara Membuat Blok Catatan, Tips dan Peringatan di Blog

Cara Membuat Blok Catatan, Tips dan Peringatan di Blog, kali ini saya akan membuat tutorial Cara Membuat Blok Catatan, Tips dan Peringatan diblog, sebenarnya di google sudah banyak tutorial nya tapi selain untuk berbagi saya membuat tutorial ini juga untuk menjadi tutor simpanan saya di blog, sebagaimana kata mutiara mengatakan kutulis aku ingat ku hfal aku lupa, oke sekian curhatnya next aja..

Cara Membuat Blok Catatan, Tips dan Peringatan di Blog
1. login ke blogger,
2. buka template => edit template
3. cari kode ini ]]></b:skin> atau </style> dan letakkan kode di bawah ini tepat di atas kode tadi

.info, .tips, .warning {
 line-height: 22px;
 min-height: 38px;
 padding: 10px 12px 12px 68px;
 margin: 5px 0;
}
.info {
 background: #e0e5eb url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0msAYnNUuCIFZCHYBd3wzhg3XZQqbNmdt2J67ryvBVOmdXnmySXmltZtidkG5UI6lAJziAqizLXPuze6MYM58WdZ5jGempYMOfwghTlLLtcnR2fWpjPYDoffWBe-Y6UHvP4Ec3Kbfyus/s1600/info.png') no-repeat 12px 8px;
 color: #222
}
.tips {
 background: #7CADDE url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNSpyhcOBiXS-vyyd_POfqKeFaQ2L7Wa97pS9LbLugVAujJqtGdQ0MOxWJXvDKZEaUKCWNXvW_fsCaV6A5B2IBn2TPYtoJOFOnDKivsbc39rZszEquyL0kbga8ADrckzvPAWyyY23Eb3k/s1600/tips.png') no-repeat 12px 8px;
 color: #fff;
}
.warning {
 background: #db6161 url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgrNGJxjlDXpAUmhK3OamReLyyQrWjo2VH8PUfBux1qtKrphHjUWELWZFu2kSoAmfM5ZriXvwHq4g2e2zxi7Oi_1BF3N7dQQ-QOnxlXGchDDwfuYwjeMfMQY1808-hK2SyngHrRxCd1dtw/s1600/warning.png') no-repeat 12px 8px;
 color: #fff;
}

4. simpan setelan.

Cara Membuat Blok Catatan, Tips dan Peringatan di Postingan blog
1. buat blog baru => dan kalo sobat ingin membuat blok catatan buka dengan HTML bukan Compose masukkan kode di bawah ini.

<div class="info">
isi text blok catatan.
</div>

dan kalo sobat ingin membuat blok peringatan masukkan kode di bawah ini.

<div class="warning">
isi text blok peringatan.
</div>

dan kalo sobat ingin membuat blok tips masukkan kode di bawah ini.

<div class="tips">
isi text blok tips.
</div>

Sekian Cara Membuat Blok Catatan, Tips dan Peringatan di Blog Semoga bermanfaat.
sumber : http://blog.kangismet.net