Membuat Dua Kolom Widget di Blogspot

Kampung Blogger, Kumpulan Blog Keren kali ini berbagi artikel yang berjudul :
Membuat Dua Kolom Widget di Blogspot

Kadang template yang kita gunakan tidak sesuai dengan keinginan kita, misalnya kolom widget yang disediakan hanya ada satu padahal kita membutuhkan yang dua kolom, Tutorial kali ini saya buat untuk para blogger yang ingin Membuat Dua Kolom Widget di Blognya.

Dua Kolom Widget / Gadget

Untuk mempercantik blog dengan susunan gadget yang sesuai dengan keinginan Sobat, dalam hal ini jumlah kolom widget, Sobat dapat membuatnya sendiri dan terserah mau meletakkannya dimana, bisa di bawah posting, di atas posting, di bawah header, di dalam sidebar, di bagian footer ataupun di lain tempat.

Berikut Cara Membuat dua Buah Elemen Gadget/Widget :
  • Login Blogger Sobat.
  • Pilih Template > Edit HTML.
  • Ceklis / Centang Expand Widget Template.
  • Cari kode ]]></b:skin> dengan menekan tombol CTRL+F pada keyboard.
  • Letakkan script berikut ini diatas ]]></b:skin> :
    #box-main-container {
    clear:both;
    }
    .box-column {
    padding:0px 10px 10px 10px;
    border:1px dotted $bordercolor;
    }
    *Anda dapat mengubah padding ( jarak posisi gadget ) 0px 10px 10px 10px maksudnya adalah Jarak ( Atas, Kanan, Bawah, Kiri ).
    *Anda juga dapat merubah border ( garis tepi widget ) dengan warna, caranya hapus $bordercolor dan ganti dengan kode warna yang Anda inginkan.
  • Kemudian cari kode
    •   <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 didapat atau hampir sama dengan kode 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 Anda letakkan di bagian atas atau dibawah salah satu kode tadi.
    *Sebagai contoh saya letakkan dibawah kode <div id='main-wrapper'>
    Dua Kolom Widget / Gadget
    *Hasilnya seperti gambar berikut
    Dua Kolom Widget / Gadget
  • Jika sudah selesai klik Preview / Pratinjau dulu, baru klik Save Template / Simpan Template.
Semoga Tutorial diatas bisa berguna dan bermanfaat...

► Baca Juga 5 Artikel Pilihan Untuk Anda:

2 comments

Pelangi99 July 5, 2018 at 12:52 PM

pelangiasik
pelangiasik.com | indopelangi99.com | pelangi99.net
-KARTU BOLEH BANDING, SERVICE JANGAN TANDING !-
Jangan Menunda Kemenangan Bermain Anda ! Segera Daftarkan User ID terbaik nya & Mainkan Kartu Bagusnya.
Dengan minimal Deposit hanya Rp 25.000,-
1 user ID sudah bisa bermain 8 Permainan.
BandarQ
AduQ
Capsasusun
Domino99
Poker
BandarPoker
Sakong
Bandar66

Kami juga akan memudahkan anda untuk pembuatan ID dengan registrasi secara gratis.
Untuk proses DEPO & WITHDRAW langsung ditangani oleh
customer service kami yang profesional dan ramah.
NO SYSTEM ROBOT!!! 100 % PLAYER Vs PLAYER
Anda Juga Dapat Memainkannya Via Android / IPhone / IPad
Untuk info lebih jelas silahkan hubungi CS kami-Online 24jam !!
• BBM : D872D7D9
• WECHAT : PELANGI99COM
• WA : +855 166 75 661
• LINE : PELANGI99.COM
• IG : INDOPELANGI99COM

Daftar
Agen BandarQ
Kartu Online
Judi Online
AgenSakong
BandarQ

Baca juga Berita Terbaru .:
Berita Viral
Berita Terkini
Berita Kriminal

Anonymous January 9, 2020 at 11:53 AM

Nonton Film Online

Berkomentarlah dengan bijak dan sopan, Dilarang menggunakan Link Aktif, Link Mati, Promo, dll.
Dan Berbagilah Jawaban atas apa kesulitan yang sobat-sobat lainnya dapatkan.

Copyright © Kampung Blogger All rights reserved
Design by OnlinePlus & Tips Blogging - Template CaraSehat.Me