Seocips.com. cara membuat catatan tips info dan peringatan di blog. Tutorial ini cara membuat blok catatan tips dan peringatan ini memang sudah tidak asing lagi karena sudah banyak dibahas dan di bagikan, tapi mungkin saja masih ada beberapa sahabat blog yang belum tahu bagaimana cara membuatnya di Blog.

Cara Membuat Catatan di blog

Menggunakan blok seperti ini biasanya untuk menampilkan catatan penting dalam postingan blog, atau info penting dan peringatan, karena penting maka tampilan catatannya di buat berbeda dengan tulisan biasa untuk memberi tahu pengunjung catatan penting yang perlu di perhatikan. lah itulah gan biar kelihatan lebih profesional aja postingannya.

Letakan kode di bawah ini di atas ]]></b:skin> atau </style> kemudian simpan template.
.info, .tips, .warning {
 line-height: 22px;
 min-height: 38px;
 padding: 10px 12px 12px 68px;
 margin: 5px 0;
}
.info {
 background: #e0e5eb url('http://2.bp.blogspot.com/-3rcGQ-VAKb8/UlA4L72c6wI/AAAAAAAAFtY/f__fkV_xBsQ/s1600/info.png') no-repeat 12px 8px;
 color: #222
}
.tips {
 background: #7CADDE url('http://2.bp.blogspot.com/-_Y9kuQODeBs/UlA4LwDUkhI/AAAAAAAAFtk/Rm0QwoddGLw/s1600/tips.png') no-repeat 12px 8px;
 color: #fff;
}
.warning {
 background: #f6b26b url('http://2.bp.blogspot.com/-OwFgzeuaIxk/VQEOKED6wEI/AAAAAAAAD50/q56e9o-93a8/s50/warning.png') no-repeat 12px 8px;
 color: #fff;
}
Selanjutnya, apabila ingin memasukan ke dalam postingan, sobat tinggal memilih blok mana yang akan digunakan. (Tulis kode dalam mode HTML). Contohnya seperti dibawah ini:

Jika ingin menampilakan info gunakan : 
<div class='info'>
Isi catatan info misalnya: lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum venenatis orc no tortor accumsan at accumsan tortor congue.
</div>

dan hasilnya: 
Seocips.COM - Isi catatan info misalnya: lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum venenatis orc no tortor accumsan at accumsan tortor congue.
Jika ingin menampilakan catatan tips: 
<div class='tips'>
Isi tips misalnya: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum venenatis orc no tortor accumsan at accumsan tortor congue.
</div>
dan hasilnya:
Seocips.COM - Isi tips misalnya: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum venenatis orc no tortor accumsan at accumsan tortor congue.
Jika ingin menampilkan peringatan :
<div class='warning'>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum venenatis orc no tortor accumsan at accumsan tortor congue.
</div>
dan hasilnya:
Seocips.COM - Isi peringatan misalnya: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum venenatis orc no tortor accumsan at accumsan tortor congue.

Ok sobat sekian untuk tutorial cara membuat catatan penting di blog. Semoga bermanfaat.
2 Komentar untuk "Cara Membuat Catatan Tips Info dan Peringatan"

Gk ngerti gan.Mampir ya gan ke blog sederhana ane

thanks gan, tutorialnya ini yang ane cari selama ini :v