CSS : Resize Main Section on Blogger

Ada kalanya tampilan gambar menjadi komponen yang penting dalam sebuah blog.Bahkan konsentrasinya mampu mengalahkan bagian lain dalam sebuah blog.Tak salah bila gambar dipercaya bisa berkata "lebih" dari sekedar kata-kata.

Ini pula yang menjangkiti pikiran pemilik blog yang catatannya kaya akan tampilan gambar.Sebut saja juru kamera, ibu-ibu yang ingin menampilkan poto anak dan keluarganya, atau juga penggila desain grafis atau grafiti yang kini kian marak di dunia blog.

Dan pertanyaannya sekarang manjadi "bagaimana melebarkan bagian konten, bagian template mana yang perlu diedit?"...untuk itu akan segera kita bahas.Namun ini lebih banyak ke kasuistik, tergantung penyedia template dan jenis kode yang digunakan.Untuk lebih mudahnya saya mengambil salah satu template yang sudah digunakan oleh tanty dengan nama template Minima.

Berikut yang perlu kita perhatikan.

1. Content
Biasanya ini ditandai dengan deskripsi /* Content pada bagian CSS.Untuk kasus Minima, content menggunakan lebar 660 px.Biaanya ditandai dengan #Content.Bagian ini meliputi keseluruhan lebar tampilan blog, baik di main maupun sidebar.Bila bagian gambar yang berada di postingan kita ingin memiliki space lebih luas, maka bagian ini perlu kita tambahkan lebarnya.Dalam kasus ini kita akan ganti menjadi 890px.(sekedar catatan, dengan resolusi komputer 1024 * 768 yang banyak digunakan sekarang, angka 890 masih menyisakan ruang yang cukup di bagian kanan dan kiri.

2. Main
Bagian main adalah bagian yang meliputi bagian judul postingan, isi postingan, komentar ,dan penunjuk waktu.Biasanya ditandai dengan #Main.Nah disinilah yang mesti kita berikan space lebih untuk gambar.Bila gambar digeneralisasikan punya lebar seukuran VGA (640*480) maka kita bisa memberi angka 640px dibagian ini.

3. Sidebar
Bagian ini meliputi profile, recent post, links dan tool tambahan seperti shout.Berada di bagian samping kanan (untuk kasus minima).Bagian ini bisa kita biarkan ke nilai 220px.

4. Header
Bagian ini diedit untuk menggenapkan dan merapihkan agar sesuai dengan lebar Content.Biasanya ditandai dengan /* Header.Isikan nila lebar header sesuai dengan lebar Content.Bila kita ganti content ke 890, maka bagian ini juga menggunakan nilai 890.

Setelah itu save template kita dan periksa hasilnya.Hanya saja perlu kita perhatikan bila kita total memiliki lebar 890, sedang posisi main dan sidebar total membutuhkan lebar 860, maka kita memiliki ruang selebar 30 px sebagai pembatas antara bagian Main dan Sidebar agar tidak saling menempel satu sama lainnya.

Berikut tampilan hasil pada saat belum diedit lebarnya (660px):


dan berikut hasil setelah diedit (860 px)