Menambah 2 Kolom sidebar pada Template 2 Kolom

kolomMenambah 2 Kolom sidebar pada Template 2 Kolom.
Bila anda membuat blog di blogspot, anda diberikan kebebasan untuk menggunakan atau pun mengganti template.Tentu ini menguntungkan buat para blogger yang ingin menggunakan template bagus pilihan sendiri yang banyak tersedia di internet.

Tapi ternyata msh banyak loh yang masih memakai template standar blogspot seperti template minima, yang memiliki 2 (dua) kolom. Satu kolom artikel dan satu kolom sidebar. Kadang kala anda yang memakai template 2 kolom ingin menambahkan lagi 2 (dua) kolom dibawah sidebar agar keseluruhan template menjadi 3(tiga) kolom atau
menambahkan 1 (satu) kolom dibawah sidebar.Lihat gambar template minima 2 kolom.

2_kolom
Setelah ditambah 2 kolom lagi dibawah sidebar menjadi:


Nah yang mau nyoba nambahin kolom terutama pada template minima 2 kolom atau template lain yang sejenis, anda bisa ikuti cara berikut:

1. login ke Dasbor.
2. Pilih "tata letak" , lalu klik Edit HTML.
3. Download template anda sebagai cadangan bila ada kesalahan.
4. Cari kode ]]></b:skin> lalu paste kode dibawah ini persis diatas kode ]]></b:skin>
  • #lsidebar{float:left; width:115px}
    #rsidebar{float:right; width:115px}
    #lsidebar .widget{width:100%; padding:2px; margin-bottom:1px}
    #rsidebar .widget{width:100%; padding:2px; margin-bottom:1px}
5. Kemudian cari kode berikut ini:
  • </div> <!-- end content-wrapper -->

    <div id='footer-wrapper'>
  • Mungkin kode diatas ditemplate anda berbeda namanya, tapi intinya sama yaitu akhir dari sidebar, atau sebelum footer.
6. Diatas kode tadi masukkan kode berikut ini:

  • <div id='lsidebar'>
    <b:section class='sidebar-left' id='sidebar-left' preferred='yes'/>
    </div>
    <div id='rsidebar'>
    <b:section class='rsidebar123' id='sidebar123' preferred='yes'/>
    </div>
Sehingga lengkapnya seperti ini:
  • <div id='lsidebar'>
    <b:section class='sidebar-left' id='sidebar-left' preferred='yes'/>
    </div>
    <div id='rsidebar'>
    <b:section class='rsidebar123' id='sidebar123' preferred='yes'/>
    </div>

    </div> <!-- end content-wrapper -->

    <div id='footer-wrapper'>
7. Terakhir simpan template anda dan lihat hasilnya.

Pada kode:
  • #lsidebar{float:left; width:115px}
    #rsidebar{float:right; width:115px}
    #lsidebar .widget{width:100%; padding:2px; margin-bottom:1px}
    #rsidebar .widget{width:100%; padding:2px; margin-bottom:1px}
Anda bisa mengatur lebar kolom pada width:115px, tentukan lebar kolom yang pas dengan template anda atau biarkan saja.

Selamat mencoba, semoga bermanfaat.


21 komentar:

Hendi Burahman said...
This comment has been removed by the author.
Qori said...

Wow, pengaplikasian yang sulit...

adedosol said...

@Qori, Pelan2 aja mas pasti bs. mksh

m4hr4n1 said...

eeee susah yaaah semalam udah aku cobaaa jadi nya template surakkk

Suranto simanullang said...

Wah, ga ngerti jg ne dgn yg anda terangkan. Sulit bgt. .

mae said...

punyaku berhasil cuma kok kolomnya pada berjauhan ga bisa dempet. Yang satu dikiri pojok satunya dikanan pojok. Hmmm apanya nih yg salah ?

adedosol said...

@Mae ,coba anda tambahkab nilai lebar kolom pada kode width: sesuai lebar sidebar dibagi dua, mksh dah berkunjung

mae said...

Udah mas. Awalnya saya kira masalahnya pada width, padding, margin dll, setelah saya utak atik, sekarang bener sejajar tapi posisinya pindah dibawahnya posting. Hahaha saya jadi makin bingung.... mungkin ada alternatif lainnya mas ? txs.

adedosol said...

@ MAe, mungkin anda memasukkan kode no.6 stelah kode no.5, coba pastikan kalo kode no.6 dipasang diatas kode no.5, kalo di letakkan setelah no.5 berarti bukan bagian dari sidebar melainkan bagian footer shingga posisinya dibawah posting. klo sobat msh bingung silahkan kirim templatenya ke adedosol(at)yahoo.co.id untuk sy coba perbaiki, trima ksh

ang said...

lain kali nyoba ah..

Adrian said...

makasih infonya ya mas :)

Hanna Pertiwi said...

kebetulan mas, saya lg pengen nambahin sidebar spt itu, tp belum dapat cara praktisnya. dan lngsung bisa dilihat hasilnya, trims udah jadi referensi mas..salam kenal

adedosol said...

Hanna salam kenal jg en trima ksh klo artikel ini bs berguna buat anda..

asmanu said...

Ok banget nih ...makasih banyak bos,sudah berbagi ilmu yang bermanfaat

adedosol said...

@Asmanu Sama-sama bro, terima ksh

Tembang Lawas said...

Mkasih Kang kebetulan Tembang Lawas lagi pengen bongkar template

cipta said...

malah jadi 2, tapi tumpuk gug kiri kanan,
gmn ne mas ???
mohon bantuannya,

Naimz said...

wow......nice posting.....
dah jadi neh berkat tutor ini....

makasih makasih banyak..............

Sunu Sarker said...

GAK BISA !
JADINYA KAYAK GINI !

http://www.mojoimage.com/free-image-hosting-07/830untitled.JPG

fatimah na81 said...

saya sudah praktekkan, tapi yg nambah malah yg dibawah bukan yg samping

Yohandi said...

bagaimana untuk templet baru

Post a Comment

Silahkan memberi komentar, saran, kritik atau masukan tentang artikel atau blog ini
Do not insert a link on comment box or you will be considered a spammer

 
Seo marketing © 2010 | Designed by Chica Blogger | Back to top