Membuat tanda peringatan di postingan

adscblog

Cara mudah membuat tanda peringatan di postingan blog - Sobat blogger infotrens mungkin anda pernah melihat di suatu blog yang menggunakan tanda peringatan ini,atau juga menyimpan satu pesan yang penting untuk para pengunjung blog

Untuk membuat tanda peringatan di blog ini tidak lah susah karena anda hanya tinggal menyimpan salah satu kode di postingan anda dan juga kode yang di simpan nya tidak begitu banyak dengan begitu akan mmpercepat kerja anda dalam membuat postingan

ada dua cara untuk membuat tanda peringatan ini
1- Anda bisa menyimpan langsung kode nya di template Html anda melalui edit html dan menyimpan nya langsung di bawah <data:post.body/>
2 - Cara yang kedua anda bisa menyimpan secara manual di postingan anda ketika anda membuat salah satu postingan dengan begitu anda bisa menempatkan tanda peringatan tersebut di salah satu postingan yang menurut anda memang perlu di beri tanda peringatan atau pesan lain nya,sehingga dengan begitu para pengunjung blog dapat mengetahui atau melihat langsung pesan tersebut

Cara Membuat tanda peringatan di bawah postingan

Tanda peringatan atau tanda pesan ini ada lima macam antara lain,box-info,box-warning,box-list dan juga box-download,anda bisa memilih salah satu box yang menurut anda penting untuk di terapkan di blog atau di dalam postingan sobat blogger

Dari ke lima box tersebut mempunyai warna tersendiri yang membedakan sehingga akan membuat pesan anda lebih menarik lagi selain warna yang menarik dari kelima box tersebut juga mempunyai gambar yang berbeda beda maka akan lebih unik lagi pesan yang anda tulis di dalam box tersebut

Tetapi jika anda kurang menyukai dengan warna atupun anda mempunyai gambar yang anda sukai untuk di simpan di box tersebut anda juga bisa mengganti nya melalui Css yang sudah ada,ataupun anda bisa kreasikan sendiri box tersebut sesuai dengan ke inginan anda agar lebih menarik

Namun jika anda lebih menyukai dengan tampilan box yang saya share disini lihat pada contoh gambar di atas,anda bisa mengikuti langkah langkah untuk pembuatan nya di bawah ini tidak begitu sulit anda hanya perlu menyisipkan kode di bawah ini sebelum kode </b:skin> dan untuk memudahkan anda dalam pencarian silahkan anda tekan Ctrl+F secara bersamaan

/* Warning message */
.box-info,.box-tips,.box-warning, .box-list, 
.box-download{ border: 1px solid #eee;clear:both; display: 
block;line-height: 22px; min-height: 38px; padding: 10px 12px 12px 68px;
 margin: 15px 0;}
.box-info{ background: #F8F8F8 
url('https://dl.dropboxusercontent.com/u/58902557/typography/info.png') 
no-repeat 12px 8px; color: #222}
.box-tips{ background: #7CADDE 
url('https://dl.dropboxusercontent.com/u/58902557/typography/tips.png') 
no-repeat 12px 8px; color: #fff;}
.box-warning{ background: #db6161 
url('https://dl.dropboxusercontent.com/u/58902557/typography/warning.png')
 no-repeat 12px 8px; color: #fff;}
.box-list { background: #F7FCF9 
url(https://dl.dropboxusercontent.com/u/58902557/typography/sticky-big.png)
 no-repeat 16px 14px;}
.box-download { background: #F8F8F8 
url(https://dl.dropboxusercontent.com/u/58902557/typography/download-big.png)
 no-repeat 16px 14px;}
.box1 { margin: 15px 0; padding: 10px 15px !important; background-color: #329579; color: #fff}
.box2 { margin: 15px 0; padding: 10px 15px !important; background-color: #ffffdd; color: #006699;}

Setelah itu untuk membuat pesan silahkan anda tulis pesan di dalam box berikut

<p class="box-info"> pesan disini.</p>
<p class="box-tips"> Pesan disini.</p>
<p class="box-warning"> Pesan disini</p>
<p class="box-list">Pesan disini</p> 
<p class="box-download">pesan disni</p>

dan untuk melihat hasil nya silahkan anda lihat pada postingan anda.
Nah itulah cara membuat peringatan di dalam postingan semoga artikel nya bisa membantu sobat blogger semua semoga bermanfaat dan salam blogger

adscblog

Recommendation Apps

ads1

Previous

Posting Lebih Baru

Next

Posting Lama

Posted by Dede Ubed, Published at 15 Oktober and have 0 komentar