Panduan Anyar nge-BLOG, Blogspot

Membuat Sidebar 2 Kolom

Jumat, 07 Mei 2010
Menambah  Sidebar 2 Kolom hampir merupakan keharusan tiap blog. mengingat selain mempercantik blog juga dapat mempersempit ruangan blog kita. dengan maksud pengunjung tidak merasa bosan dengan blog kita. Sidebar dua kolom ini anda bisa lihat contohnya pada blog ini ada variasi antara 1 dan 2 kolom sidbar.
Sebaiknya kita mulai saja cara membuatnya :
  • Login ke blog anda Klik DISINI, silakan isi email dan password blog anda
  • Pilih ‘TATA LETAK’
  • Klik "Edit HTML"
  • Agar aman, silakan anda Download dulu template anda (klik Download Template Lengkap), Pada bagian atas
  • (gunakan Ctrl + F) Cari kode #sidebar-wrapper (atau yang mirip kode tersebut)
  • atau lengkapnya kode sperti ini :
#sidebar-wrapper {
width: 300px;float: $endSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden;/* fix for long non-text content breaking IE sidebar float */
}
Kode di atas merupakan kode dasar dari template minima bawaan blogger. Kode diatas  akan menjadi patokan untuk menambah kode selanjutnya yang kita inginkan menjadi 2 kolom. Jika sdh ketemu :
  • Copy kode dibawah ini dan letakkan di bawah kode diatas.
#sidebar1-wrapper {width: 145px;float:right;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden;/* fix for long non-text content breaking IE sidebar float */}
#sidebar2-wrapper {width: 145px;float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden;/* fix for long non-text content breaking IE sidebar float */}
Anda ubah lebarnya sesuaikan dengan lebar templete anda ( warna Merah Anda edit / lebar asli sidebar dibagi 2)
  • Setelah itu cari kode :
<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
</b:section>
  • Kalau ketemu Copy kode dibawah ini dan paste dibawah kode diatas
<div id='sidebar1-wrapper'>
<b:section class='sidebar' id='sidebar1' preferred='yes'>
</b:section>
</div>

<div id='sidebar2-wrapper'>
<b:section class='sidebar' id='sidebar2' preferred='yes'>
</b:section>
</div>
</div>
  • Selesai klik simpan dan lihat hasilnya pada tata letak elemen halaman

Subscribe

Berlangganan via RSS Feed

Ingin Artikel seperti ini ?,... masukan alamat email anda untuk berlangganan.

Artikel Anyar Yang Berhubungan :

Komentar Anda :

7 komentar pd : “Membuat Sidebar 2 Kolom”

trimakasih atas panduan ngeblognya...........mantap coy

yg mau gratis mengatakan...
pada hari 

blogwalking

anang mengatakan...
pada hari 

makasih mas tutorialnya, udh aku terapin di blog aku

halanehdanunik mengatakan...
pada hari 

heheheh thanks alot ma bro scriptx berjalan dengan asik, sekali lagi makasih kelas berat bro...
Sutradara sinting

Domon mengatakan...
pada hari 

tidak bekerja di blogku :(

AdityaN8zz mengatakan...
pada hari 

Toko bose

Procomil spray

Neosize xl

Pro extender

Obat pelangsing badan

Obat pemutih kulit

Cream pemutih badan

Cream pemutih wajah

Celana hernia

Obat sakit hernia

Obat peninggi badan

Obat Gemuk alami

Cream pemutih selangkangan

Obat perapat vagina

Cream pembesar payudara

Obat pembesar payudara

Alat pembeasar payudara

Vimax

Kosmetik artis

Alat Bantu Sex

Obat Ambien

Obat Pemutih Kulit

Obat Penghilang Tato

Obat Penggemuk Badan

Alat Pembesar Payudara

Selaput Dara Buatan

Obat Ambeien

Minyak lintah papua

Maya kecantikan

Boneka sex jepang

Toko ujung

Toko surabaya




Unknown mengatakan...
pada hari 

oke bos

cream penghilang flek ampuh mengatakan...
pada hari 

Posting Komentar

Berlangganan via RSS Feed

Ingin berlangganan gratis artikel yang langsung ke e-mail anda ?,... Tulis alamat email anda untuk berlangganan.

Silakan Dipakai !!!