Cara Membuat 2 Kolom di bawah sidebar.

Kowandy – Membuat 2 Kolom di bawah sidebar. Biasanya di template yang kita gunakan, kolom yang disediakan disebar hanyalah satu. Sedangkan kita perlu sebuah sidebar dengan 2 kolom agar bisa memuat apa yang ingin kita tempatkan seperti gambar, widget ataupun yang lain. Nah, kan cuma 1 kolom. Gimana cara membuat agar kolom sidebar menjadi 2 kolom di bawahnya.?? Baiklah, kowandy akan membagikan sebuah tutorial agar sidebar template anda menjadi terbagi 2 di bagian bawahnya.

Kira-kira seperti ini gambarnya


Kalo uda ditambahkan akan menjadi seperti gambar di bawah


Langsung saja ini dia caranya:
– login dulu ke akun blogger
– masuk dashboard –> Tata Letak –> Edit HTML
– Cari kode di bawah ini atau biar lebih mudah kita gunakan CTRL + F (biar lebih gampang dalam mencari)

#sidebar-wrapper{ width:320px;  float:$endSide;  word-wrap:break-word;  overflow:hidden}

– Lalu copy kode berikut dan letakkan di bawah nya

.singlesidebar {float:$endSide;  word-wrap:break-word;  overflow:hidden}

– Setelah itu klik save.
– Lalu cari kode berikut

<div id=’sidebar-wrapper’>
<b:section class=’sidebar’ id=’sidebar’ preferred=’yes’>
</b:section>
      </div>

– kemudian hapus dan gantikan dengan kode di bawah ini

<div id=’sidebar-wrapper’>
<div class=’singlesidebar’ style=’width:100%’>
        <b:section class=’sidebar’ id=’sidebar’ preferred=’yes’>
</b:section>
      </div>


<div style=’width:100%’><div class=’singlesidebar’ style=’width:50%; float:left;’>
          <b:section class=’sidebar’ id=’sidebar1′ preferred=’yes’/>
        </div>


<div class=’singlesidebar’ style=’width:50%;float:right;’>
          <b:section class=’sidebar’ id=’sidebar2′ preferred=’yes’/>
        </div>
        </div><div style=’clear:both’/>
      </div>

– Lalu save dan lihat hasilnya.
gampang aja kan? selamat mencoba.
Advertisements

About Legy Masyhury

Hanya manusia biasa, sungguh! :D http://legianto.com http://desainku.net http://masyhury.web.id http://ideku.info
This entry was posted in Tutorial Blog. Bookmark the permalink.

2 Responses to Cara Membuat 2 Kolom di bawah sidebar.

  1. mayank says:

    thanx bget gan,.. ane coba praktekin dulu,.oh ya, btw ai sudah memiliki 2 sidebar gan, 1 kecil dan satu besar,.trus yg besar ai mau bagi 2 lagi dibagian bawahnya..kira-kira penerapannya gmana gan..?

  2. Kowandy says:

    @mayank coba anda lakukan dulu tutorial saya diatas. trima kasih.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s