Membuat pemisah antar post (line dividers) pada blogspot

Pada postingan kali ini saya akan mencoba berbagi tips pada para sahabat blogger, tips ini yaitu bagaimana membuat pemisah antar postingan dengan tujuan untuk mempercantik tampilan blog sahabat-sahabat blogger. Pemisah antar postingan ini berupa gambar ornament seperti pada blog saya ini, bisa dilihat dibawah postingan saya ada gambar 8 buah ornament yang berjajar. Teman-teman bisa menggunakan software pengolah gambar seperti Adobe Photoshop ata GIMP yang gratisan.

Ketika membuat Pemisah antar postingan (line dividers) ini pastikan teman-teman mengetahui lebar dari bagian posting blog, bisa dilihat pada code css #main wraper {width=480px .......} yang berwarna merah adalah lebar postingan template anda. Dengan demikian buatlah pemisah dengan lebar lebih kecil dari 480px, misalnya 20 x 450px. Setelah dibuat simpanlah di Photobucket.com atau imageshack.com, atau terserah anda.

Langkah berikutnya masuk ke account blogger===>Layout===>Edit HTML (jangan lupa save template anda) sebelum mengedit ya. Cari code :

.post {
margin: .5em 0 1.5em
border-bottom:0px dotted $bordercolor;
padding-bottom:1.5em;
}

catatan : biasanya akan berbeda-beda untuk setiap tempalate

setelah anda temukan, ganti kode di atas dengan :

.post {
background: url(http://i659.photobucket.com/albums/uu320/icethetic/divider-img.gif);
background-repeat: no-repeat;
background-position: bottom center;
margin:.5em 0 3.5em;
border-bottom:0px dotted $bordercolor;
padding-bottom:1.5em;
}


ganti url nya dengan url punya sobat. Kalo sudah jangan lupa di Save !.
o ya, teman-teman juga bisa mengganti nilai pada margin dan padding-button, cobalah untuk bereksperimen.


Category Article ,

What's on Your Mind...

Random Posts

Powered by Blogger.