Cara Buat 3 Kolom Widget Keren

Pada artikel hari ini ada sedikit request dari teman blogger saya yang menayakan bagaimana cara untuk membuat tiga kolom footer seperti di blog saya atau tepatnya seperti gambar di atas sana. Sebenarnya sebelumnya saya telah membuat cara seperti ini di artikel saya sebelumnya dengan judul artikel 'Cara Membuat 3 Kolom Di Atas Footer.

Tapi anggap saja artikel itu untuk edisi pertamanya dan artikel judul ini untuk edisi keduanya. Oke buat teman blogger saya yang tadi merequestnya atau teman yang lainya seperti yang punya saya ini simak dan praktekan cara di bawah ini dengan baik dan benar.

1. Seperti biasanya masuk ke blogger terus ke dasboard blog yang akan anda buat klik template dan kemudian klik Edit HTML.
2. Kemudian silahkan anda cari kode ]]></b:skin> ini di dalam template anda dan letakan kode di bawah ini di atasnya. Terserah di mana saja yang penting di atas ]]></b:skin> tadi.

/* BOTTOM-BAR */
#bottom-bar{overflow:hidden;background:#eaeaea;margin:0;padding:10px;border-top:1px solid #fafafa;display:block}#bottom-bar h2, #bottom-bar h3{padding:3px 0;margin:0;font-size:15px;font-weight:bold;text-shadow:0px 1px 0px #fafafa;text-transform:uppercase;border-bottom:1px solid #ccc}#bottom-bar .widget{margin:0 0 10px;clear:both}#bottom-bar .widget-content{padding:8px 0;border-top:1px solid #fafafa}#bottom-bar .widget-content ul li{margin:0;padding:3px 2px;border-top:1px solid #fafafa;border-bottom:1px solid #ddd}#bottom-bar .widget-content ul li:first-child{border-top:medium none !important}#bottom-bar .widget-content ul li:last-child{border-bottom:medium none !important}#bottom-bar .widget-content ul li a{color:#333}#bottom-bar .widget-content ul li a:hover{color:#c80441}#bottom-bar #LinkList1 .widget-content ul{height:100px;overflow-y:auto}#bottom-bar .kiri{float:left;width:310px;margin:0 5px 0 0;display:inline}#bottom-bar .tengah{float:left;width:310px;margin:0 5px 0 5px;display:inline}#bottom-bar .kanan{float:right;width:310px;margin:0 0 0 5px;display:inline}

3. Selanjutnya kembali lagi mencari. Carilah kode <div id='footer'>, kemudian letakan kode di bawah tepat di atasnya (pokoknya sesuaikan saja pada template masing-masing).

<div style='margin:0;padding:0;height:1px;background:#ccc;clear:both;'/>
<aside id='bottom-bar'>

<b:section class='kiri' id='kiri' preferred='yes'/>

<b:section class='tengah' id='tengah' preferred='yes'/>

<b:section class='kanan' id='kanan' preferred='yes'/>

</aside>

4. Terakhir jurus pamungkasnya klik "SAVE TEMPLATE".

Lebar maupun backgroundnya bisa kalian atur sendiri. Kalau masih ada yang kebingungan silahkan berkomentar, mudah-mudahan berhasil semua. Dan buat yang mau download template keren bisa anda download di artikel saya yang berjudul "Download Template Keren Dan Pasti SEO' yups mudah-mudahan bermanfaat artikel saya kali ini dan terima kasih.