03 Januari 2011

Postingan blog dua kolom otomatis bergaya Koran atau majalah


Pernahkah anda melihat gaya penulisan di Koran atau majalah tentunya memiliki style yang berbeda dengan tulisan pada dokumen biasa. 

Bedanya adalah kalau teks dokumen biasanya dibuat dengan tanpa kolom (satu kolom saja) tetapi pada majalah atau Koran diketik dengan dua kolom atau lebih.  Itulah yang menjadi ciri khusus dari Koran atau majalah.

Pembuatan postingan dua kolom pada blog ada dua cara yang dapat anda gunakan, yaitu :
  1. secara manual
  2. secara otomatis.
Cara manual adalah seperti yang sudah saya tulis pada postingan sebelumnya yang berjudul “Membuat postingan dua kolom ternyata mudah” silahkan sobat bisa berkunjung kesana.

Sedangkan cara kedua (secara otomatis) adalah dengan menambahkan kode CSS3 pada template html blog anda.
Kode yang perlu ditambahkan adalah seperti ini:
-moz-column-count:2;-moz-column-gap: 2em;-webkit-column-count: 2;-webkit-column-gap: 2em;

Pamasangan kode postingan dua kolom otomatis yaitu sebagai berikut:
  1. pada template html template anda cari kode .post-body
  2. sisipkan kode -moz-column-count:2;-moz-column-gap: 2em;-webkit-column-count: 2;-webkit-column-gap: 2em; pada deretan kode di dalamnya.
  3. save dan lihat hasilnya
Sehingga susunan kodenya menjadi seperti ini :

.postbody{
-moz-column-count:2;-moz-column-gap: 2em;-webkit-column-count: 2;-webkit-column-gap: 2em; KODE YANG LAINNYA…..}


Sampai disini anda sudah berhasil membuat 2 kolom, tetapi bentuk teks masih rata kiri untuk itu perataan paragraph harus diatur pula agar menjadi rata kanan kiri (justify) dengan menambahkan kode text-align:justify;

Dan keseluruhan kodenya menjadi seperti ini:

.postbody{
-moz-column-count:2;-moz-column-gap: 2em;-webkit-column-count: 2;-webkit-column-gap: 2em;  text-align:justify; KODE YANG LAINNYA…..}

Kalau semuanya sudah dilaksanakan jangan lupa klik save untuk menyimpannya.

Dengan cara di atas maka anda tidak perlu menambahkan kode lagi di dalam postingan karena sudah diatur oleh kode CSS postingan dua kolom di dalam template html sobat.
Seluruh Postingan blog anda akan secara otomatis membentuk 2 kolom yang sama lebar dan sama tingginya.  Demikian pula perataan paragrafnya menjadi justify secara otomatis dengan sendirinya.

Tentu saja ini dapat memberikan kesan rapih, enak dilihat, mudah bagi pengunjung dalam membacanya berkat gaya postingan dua kolom yang seperti Koran atau majalah.

3 komentar:

  1. Thanks infonya, ,

    baca-baca sambil follow, ,

    follow back yea, ,

    www.wakrizki.net

    BalasHapus
  2. Wah,,,keren Bro..Thanks

    BalasHapus
  3. thanks infonya bro... bnr2 muantaap.

    BalasHapus

Catatan: Hanya anggota dari blog ini yang dapat mengirim komentar.