Cara Membuat Separator Antar Posting Blog

           Terlihat elegan dan rapi adalah salah satu cara optimalisasi blog kita. Dengan tampilan yang rapi pengunjung blog kita akan kerasan berlama-lama di blog kita. semakin lama tentunya akan semakin banyak pula artikel yang kita miliki. Dengan menambahkan separator antar postingan, membuat pembaca lebih fokus untuk membaca dari posting ke posting lainnya. 

             

            Apakah Saat ini sudah terdapat Separator di blog anda?. Sering kali kita merasa bosan dengan tampilan pada blog kita dan kemudian mengganti tema. Agar tetap serasi dengan tema baru, kita perlu costumisasi ulang separator line kita.

Ada 2 tips untuk membuat separator line, sebagai berikut:

• Separator Dengan Menggunakan Gambar

           Anda dapat membuat sendiri separator line menggunakan CorelDraw, Photoshop, atau aplikasi lainnya.  Download dari internet juga dapat anda lakukan seperti flickr, Google image, freepix dan lain sebagainya. 

                Login ke Blog  >  Templates  > Edit HTML.  cari kode .post{.  masukkan kode Separator dibawah  .post{  dan sebelum }.

Kode Separator:

background:url('URL GAMBAR'); background-repeat: no-repeat; background-position: bottom center; padding-bottom: 10px; margin: 10px 0px 10px 0px;

                  Bila kode .post{. tidak ditemukanpada HTML blog anda. Masuk ke menu Templates > Costumise > Advance >Add CSS. paste kode separator dibawah ini:

Kode Separator:

.post { background:url('URL GAMBAR'); background-repeat: no-repeat; background-position: bottom center; padding-bottom: 10px; margin: 10px 0px 10px 0px; }

 Ubah "URL GAMBAR" dengan alamat URL gambar separator anda.

• Separator Dengan Menggunakan Line Solid

         Costumisasi  dapat kita lakukan dengan mengatur ketebalan garis, warna garis dan jenis garis. jenis garis dapat diganti dengan tipe dotted, dashed, groove, double, ridge, inset dan outset.
 
                Login ke Blog  >  Templates  > Edit HTML.  cari kode .post{.  masukkan kode Separator dibawah  .post{  dan sebelum }.

Kode Separator:

border-bottom: 1px solid #eeeeee; padding-bottom: 10px; margin:  10px 0px  10px 0px;

                  Bila kode .post{. tidak ditemukanpada HTML blog anda. Masuk ke menu Templates > Costumise > Advance >Add CSS. paste kode separator dibawah ini:

Kode Separator:

.post { border-bottom: 1px solid #eeeeee; padding-bottom: 10px; margin:  10px 0px  
10px 0px;}

 M Jika mengalami masalah dalam membuat Separator Poting. jangan lupa komentar yah. (*Msb)