Mengatur Jarak Gadget

info-gamepc.blogspot.com - Mestinya kita sudah tidak asing lagi dengan namanya template blog, beberapa jenis template juga tersedia gratis di internet, tergantung pilihan mana yang menurut kita cocok, adakalanya template yang kita pasang diblog jarak gadget dengan gadget satunya tidak cocok, misal jarak gadget antara main-wrapper dengan sidebar sebelah kanan terlalu lebar dengan jarak gadget sebelah kiri.

Mungkin bagi orang-orang yang sudah malang melintang didunia blogging hal tersebut tidak menjadi suatu masalah tetapi bagi kita yang notabene baru mengenal blog merupakan suatu permasalahan, kenapa? karena selain menjadikan blog kurang enak dipandang juga menmbuat pengunjung menjadi tidak betah berlama-lama karena terkesan blog dibuat seadanya alias Saldi asal jadi.

Saya ingat perkataan teman saya bahwa sekecil apapun permasalahan yang kita hadapi tanpa kita tahu cara memecahkannya akan menjadi masalah serius dalam kehidupan ini, Mari kita lihat contoh salah satu blog, saya tidak akan menyebutkan blog apa itu, sekali lagi saya minta maap yang sebesar-besarnya bukan maksut menjelekkan blog tersebut tetapi semoga artikel ini menjadi referensi bagi kita semua.

Mari kita perhatikan perbedaan jarak gadget tersebut, kita bisa lihat jarak yang dilingkari warna merah dan hijau, terdapat perbedaan bukan? yang warna merah saya asumsikan ukurannya 10 dan yang warna hijau 20 kalau tidak salah, sekarang kita bandingkan dengan jarak blog saya, maap sekali lagi bukan maksut saya membanggakan blog saya.

Kita bisa lihat diblog yang saya lingkari warna hijau muda ukurannya sama bukan? Ok kita mencoba merapikan saja jarak gadget tersebut, kita mungkin sudah pernah meliha kode-kode dibawah ini.

#box8-wrapper{padding-left:10px;width:310px;float:right;word-wrap:break-word;overflow:hidden}
.ads .widget,.box .widget,.box1 .widget,.box2 .widget,.box5 .widget,.box6 .widget,.box9 .widget,.box8 .widget{margin:10px;0px;}

Mari kta jabarkan maksut kode-kode diatas

#box8-wrapper{padding-left:10px;width:310px;float:right;word-wrap:break-word;overflow:hidden}

Artinya kotak box 8 mempunya lebar 310 dengan posisi sebelah kanan dan jarak margin dengan text mempunyai ukuran 10.

.ads .widget,.box .widget,.box1 .widget,.box2 .widget,.box5 .widget,.box6 .widget,.box9 .widget,.box8 .widget{margin:10px;0px;}

Jarak gadget ads, box1 samapi box9 mempunyai jarak gadget 10,

Jadi kesimpulannya gadget yang mempunyai jarak yang berbeda kita lihat dulu susunan kodenya, kemudian kita lihat gadget mana yang berbeda, dari gambar nomor satu saya bisa menerka bahwa jarak gadget yang berbeda adalah bagian Sidebar sebelah kanan atau kalau ditemplate sering disebut sidebar-wrapper tetapi karena di google bannyak dijumpai artikel cara mengatur jarak gadget dengan isi yang sama dan setelah saya terapkan hasilnya tidak ada perubahan alias jarak gadget masih lebar, mungkin kita sudah sering melihat kode ini.

.main-inner .widget {
margin: 10px 0px;
}

Kalau jawabannya kode diatas tentunya permasalahan nya bukan jarak sidebar yang berbeda tetapi jarak main-inner atau #main-inner-wrapper, baru bisa pas, tetapi berhubung permasalahannya ada di sidebar tentu jawaban tersebut bukan mrupakan solusi yang tepat. Untuk memecahkannya jarak sidebar kanan, kita bisa menambahkan kode dibawah ini di atas ]]></b:skin>:

.sidebar .widget {
margin: 10px 0px;
}

Sekarang simpan template kita dan lihat hasilnya.

Sekian dulu artikel singkat ini, kalau dalam penyampaiannya ada bahasa yang kurang dimengerti saya mohon maap sebesar-besarnya.
Good Luck...