Cara Membuat Dua Kolom Widget Pada Blogspot

Terkadang ketika memasang sebuah template pada blog yang kita kelola, terdapat beberapa tampilan yang tidak sesuai dengan kebutuhan blog yang dikelola. Beberapa masalah yang sering terjadi adalah tampilan dan pengaturan widget yang tidak seperti keinginan. Bisa juga template blogger yang digunakan tidak terdapat widget pada beberapa bagian yang akan digunakan. Dengan begitu anda harus menambahkannya sendiri. Bagi kalian yang masih belum terbiasa dengan hal ini, dapat melihat Cara Membuat Dua Kolom Widget Pada Blogspot dibawah ini. 

Susunan gadget yang rapi dan sesuai keinginan dapat meningkatkan tampilan blog menjadi lebih cantik lagi, seperti jumlah dan penempatan kolom widget. Kalian bisa membuat kolom sendiri dan dapat ditempatkan dimana saja sesuai keinginan. Anda bisa meletakkannya di bawah posting, di atas posting, di bawah header, di dalam sidebar, di bagian footer maupun ditempat lainnya.

Cara Membuat Dua Kolom Widget Pada Blogspot

Berikut ini cara membuat 2 buah elemen Gadget/Widget pada template blogger kalian :

1. Login ke dahsboard Blogger kalian.
2. Pilih Template  kemudian pilih menu Edit HTML.
3. Setelah masuk ke halaman edit html, cari kode ]]></b:skin> dengan menekan tombol CTRL+F pada keyboard.
4. Letakkan script berikut ini diatas ]]></b:skin> :
   
   
   #box-main-container {
   clear:both;
   }
   .box-column {
   padding:0px 10px 10px 10px;
   border:1px dotted $bordercolor;
   }
   
   *Kalian bisa mengubah padding ( jarak posisi gadget ) 0px 10px 10px 10px sesuia keinginan. Maksudnya adalah Jarak Atas,  Kanan,  Bawah,  Kiri.
   *Kalian juga bisa mengganti border atau garis tepi widget  dengan warna keinginan kalian, caranya dengan menghapus $bordercolor kemudian diganti dengan kode warna yang kalian mau.
5. Selanjutnya carilah kode-kode berikut
   
   
   •   <div id='main-wrapper'>
   •   <div id='content-wrapper'>
   •   <div id='header'> atau <div id='header-wrapper'>
   •   <div id='sidebar-wrapper'>
   •   <div id='bottom'>

Keterangan :

• <div id='main-wrapper'> adalah posisi halaman utama anda. Biasanya dipakai untuk penempatan menu horizontall atau daftar isi sebuah blog. 
• <div id='content-wrapper'> adalah posisi postingan. 
• <div id='header'> adalah posisi kepala. Biasanya ditempatkan judul blog dan deskripsi blog. 
• <div id='sidebar-wrapper'> adalah posisi sidebar blog. 
• <div id='bottom'> adalah posisi paling bawah. Atau Footer Blog Anda. Silakan pilih salah satu, mau menempatkannya dimana.

Jika sudah ketemu kode seperti diatas, letakkan kode HTML di bawah ini

<div id="box-main-container"> <div id="box1" style="float: left; margin: 0; text-align: left; width: 50%;"> <b:section class="box-column" id="col1" preferred="yes" style="float: left;"> </b:section></div> <div id="box2" style="float: right; margin: 0; text-align: left; width: 50%;"> <b:section class="box-column" id="col2" preferred="yes" style="float: right;"> </b:section></div>
<div style="clear: both;"> </div></div>

Silakan kalian letakkan kode tersebut diatas atau dibawah salah satu kode tadi.
*Sebagai contoh saya letakkan dibawah kode <div id='main-wrapper'>

*Maka hasilnya akan menjadi seperti gambar dibawah ini :

Jika sudah selesai klik Preview / Pratinjau dulu, baru klik Save Template / Simpan Template.

Mudah bukan Cara Membuat Dua Kolom Widget Pada Blogspot. Untuk kalian yang pernah melakukannya akn terasa cukup membingungkan. Akan tetapi, jika kalian mengikuti step by step nya dengan benar tidak akan sesulit yang kalian bayangkan. Silahkan dicoba dan dipraktekkan Cara Membuat Dua Kolom Widget Pada Blogspot yang telah admin bagikan. Semoga bermanfaat .