Merubah ukuran template blog

Mengatur ukuran tamplate pada blog, sebenarnya sudah disediakan langsung oleh blogspot. Namun, pengaturan lanjutan layout/tampilan yang disediakan ini sifatnya terbatas, dan hanya bisa digunakan apabilan saudara menggunakan template yang disediakan blog. Lantas bagaimana, seandainya saya menggunakan tamplet dari pihak ke-dua, dan pengaturan lanjutan di layout/tampilan tidak merespone/tidak bisa membantu saya dalam mengubah ukuran template. Melakukan pengeditan pada template  (HTML editor), mungkin adalah satu-satu cara yang bisa kita lakukan.

Bagaimana cara merubah ukuran template di HTML editor

Sebelum saudara terjun ke TKP untuk mengatur ukuran  template,   secuil ilmu yang saya sampaikan mungkin akan bermanfaat untuk membantu pemahaman saudara.  Didalam HTML editor ada kode yang berfungsi merubah template bagian keseluruhan atau dari beberapa kolom seperti ukuran lebar postingan, sidebar, header dan footer.  Berikut ini penjelasannya:

1. #outer-wrapper >>> kode untuk ukuran lebar suatu template blog… karena ini adalah ukuran dasar, maka semua ukuran baik #header-wrapper, #main-wrapper ataupun #sidebar-wrapper, tidak melebihi dari ukuran #outer-wrapper. 2. #header-wrapper >>> kode untuk ukuran lebar header . Header bagian atas meliputi kolom Judul atau nama blog. Biasanya ada dua kolom kanan dan kiri, misal: header{ dan header2{ 3. #main-wrapper >>> kode template bagian kolom postingan blog. 4. #sidebar-wrapper >>> kode bagian Sidebar dalam template blog…. Biasanya dalam kolom di isi dengan widget-widget yang diterapkan. Sidebar bisa berada dibagian posisi kanan dan kiri atau salah satunya. <br />

Penjelasan diatas adalah patokan/aturan dasar dalam mengubah ukuran tamplet, dan dibawah ini adalah tutorial/langkah-langkah dalam mengubah ukuran template.

1. Pada pilihan menu >>> Template .

3. Klik >> Edit HTML

4. Gunakan fungsi ctrl + F, untuk membantu pencarian:

           

#outer-wrapper {

#outer-wrapper { width: 1000px; margin:0 auto; padding:10px; text-align:justify; font: $bodyfont; }

#header-wrapper

#header-wrapper { width:1000px; margin:0 auto 10px; border:1px solid $bordercolor; } Catatan: Bila Header dalam template blog memiliki dua kolom kanan dan kiri, pastikan kedua ukurannya disesuaikan dengan ukuran #header-wrapper diatas.

#main-wrapper

#main-wrapper { width: 655px; margin-left: 20px; margin-right: 20px; float: left; }

#sidebar-wrapper

#sidebar-wrapper { width: 310px; float: right; }

Ket:

• #####-wrapper     >>>>>adalah kode untuk ukuran template.
• float:left; / float:right  >>>>>>  adalah posisi kolom berada.
• width:####px; >>>>>> adalah ukuran lebar kolom.

Secara harfiah, wrapper artinya pembungkus. Maksudnya, jika saudara menggunakan template hasil download , maka ada kemungkingan kata "wrapper" bisa saja diganti dengan istilah yang lain.
Untuk melakukan pengeditan, saudara cukup dengan hanya merubah ukuran dalam width:####px,  namun seperti yang saya jelaskan diatas, ukuran #outer-wrapper yang menjadi patokan.

Artikel ini kuketik, sebagai catatan inspirasi perjalan blog-ku. Selamat Mencoba "-"