Cara Mengatur Ukuran Lebar Blog (Template BroSense Mas Sugeng)

Pengalaman kemarin yang saya alami saat menggunakan template dari Mas Sugeng yang bernama BroSense Seo Fast ini, saya sedikit kecewa dengan tampilan blog (lebar blog) yang sangat sempit, kemudian karena saya berasal dari perguruan tinggi tekhnik informatika, saya sedikit mengerti dengan pengkodean HTML, saya coba terapkan pada template ternyata sama saja dan berhasil, menjadikan template Bro Sense Seo Fast ini menjadi lebar yang saya inginkan. Hasil yang saya kerjakan Lihat Disini

Pasti banyak sekali template yang sangat anda sukai, tetapi dari segi ukuran lebar blog tersebut kurang pas dihati anda, mulai dari lebar keseluruhan blog, slidebar yang tidak seimbang dll.

Bagi anda yang sedang mencari tau bagaimana cara mengatur lebar template, berikut saya akan berikan arahan dan bisa di setting sesuai ukuran yang anda inginkan.

Untuk proses pelebaran badan blog anda, tentunya anda harus mengetahui sedikit atau pengkodean dasar HTML, tetapi jika anda yang tidak mengerti sama sekali, mari ikuti petunjuk yang akan saya berikan.

Langkah 1 (Masuk Ke Menu Pengkodean HTML)

• Pastinya login dulu ke blogger.com milik anda
• Pilih menu << Template >>
• Klik Edit HTML

Langkah 2 (Mengatur Ukuran Header Blog)

Anda cari terlebih dahulu kode seperti ini #header-wrapper, Kode tersebut adalah menu header anda atau bagian kepala blog anda.

Lihat contoh dibawah ini:

#header-wrapper {

width:920px;

margin:0 auto 10px;

border:1px solid $bordercolor;}

Keterangan:

Warna yang berwarna biru adalah kode untuk header template blog anda.

Warna Merah adalah Ukuran lebar Header template blog anda.

Catatan:

Untuk kode berwarna merah bersifat variatif setiap template mempunyai ukuran yang berbeda, dan kode merah itu adalah untuk mengatur lebar header blog anda, saya sarankan 920px, karena itu adalah ukuran yang disukai google.

Langkah 3 (Mengatur Lebar Keseluruhan Blog)

Anda kemudian cari kode #outer-wrapper Kode ini adalah untuk mengatur lebar keseluruhan blog. Kode #outer-wrapper didalamnya biasanya dan pasti berisi ukuran #main-wrapper (Kolom isi postingan blog), #sidebar-wrapper (Kolom Sidebar Blog).

Lihat contoh dibawah ini:

#outer-wrapper {

width: 920px;

margin:0 auto;

padding:10px;

text-align:justify;

font: $bodyfont;}

Keterangan:

#outer-wrapper adalah kode untuk mengatur keseluruhan body blog anda.

width: 920px; nilai ukuran blog anda, kenapa saya berikan 920px, seperti yang dikatakan diatas ini adalah nilai minimalis terbaik untuk blog, dan harus sama dengan nilai header blog tersebut.

Langkah 4 (Mengatur Ukuran Lebar Postingan Blog)

Anda kembali cari kode #main-wrapper Ini adalah kode untuk mengatur lebar postingan blog anda, anda bisa mengatur nya dengan sangat mudah, jangan samakan ukurannya dengan ke 3 ukuran diatas.

Lihat contoh dibawah ini:

#main-wrapper {

width: 318px;

margin-left: 20px;

margin-right: 20px;

float: left;}

Keterangan:

#main-wrapper adalah kode untuk bagian postingan anda, sementara ;

width: 318px; adalah ukuran besar atau lebar kolom postingan anda.

Langkah 5 (Mengatur Ukuran Lebar SlideBar Blog)

Kemudian anda cari #sidebar-wrapper, kode tersebut adalah kode untuk mengatur slidebar anda yang berada disamping blog anda, slidebar ini yang menampung widget pada blog anda.

Lihat contoh dibawah ini:

#sidebar-wrapper {

width: 300px;

float: right;}

Keterangan:

#sidebar-wrapper Kode untuk bagian slidebar blog anda.

width: 300px; ukuran lebar slidebar blog anda.

Seperti itulah cara saya memperlebar blog miliknya mas sugeng BroSense, dan itulah ukuran yang saya terapkan pada template yang saya gunakan saat ini, semoga bermanfaat bagi anda yang ingin mengubah ukuran-ukuran blog anda.

Semoga berhasil.

Posted by Imam Munandar

Kali DIBAGIKAN

Share Share Share

Tags :

Related : Cara Mengatur Ukuran Lebar Blog (Template BroSense Mas Sugeng)