[Tutorial] Cara nak tambah 3 kolum di bawah footer.

Assalamualaikum

Hari gatal-gatal tangan nak buat tutorial macam mana nak tambah kolum baru kat footer. Suka tak? Try and error je lah kan, sebab kalau nak pandai kena lah buat salah dulu. Betul tak? sebab dari situ kita belajar, belajar dari kesilapan.
Ok, nie lah contoh kolum yang ditambah dibawah footer blog. Ala yang kat bawah sekali tu.


Fungsi:
Footer (3 kolum) digunakan untuk membuat ruang yang baru di dalam blog yang agak luas di bahagian bawah supaya sidebar di tepi tidak terlalu panjang dan sesak(macam blog saya nie ke?)
Untuk menambahnya anda semua boleh ikut cara-cara kat bawah nie ye. Sebelum tu, jangan lupa backup template dulu. Sebarang masalah yang berlaku pada template anda bukan dibawah tanggungjawab saya (kejam-kejam).

1. Login akaun blogspot,
2. Klik Design >> Edit HTML >> Klik Expand Templates Widget,
3. Dan cari kod berikut:

]]></b:skin>

4. Tambahkan kod yang berwarna merah(kat bawah tu) diatas atau sebelum kod 

]]></b:skin>

/* bottom
---------------------------- */ #bottom {
width: 900px;
position: relative;
clear:both;
margin: 0 auto;
color:#fff;
float: left;
background: transparan;
padding: 15px 0 15px 0;
}
#bottom h2 {
text-align:center;
padding: 5px 0 2px 0;
margin: 0 0 10px 0;
color:#AEB404;
font-size: 24px;
letter-spacing: -1px;
border-bottom: 0px solid #fff;
}
#bottom ul {
padding: 0;
margin: 0;
}
#bottom ul li {
line-height: 26px;
list-style-type: none;
border-bottom: 1px dashed #AEB404;
}
#bottom ul li a {
display: block;
padding: 0 10px;
color:#0701FD;
text-decoration: none;
}
#bottom ul li a:hover {
background: transparan;
}
#left-bottom { /* kod kolum footer kiri */
width: 32%;
float: left;
padding-left:10px;
}
#center-bottom { /* kod kolum footer tengah */
width: 32%;
float: left;
padding-left:10px;
}
#right-bottom { /* kod kolum footer kanan */
width: 32%;
float: left;
padding: 0 5px 0 10px;
}

5. Teruskan dengan mencari kod berikut:

<div id='footer-wrapper'>

atau

<div id='footer'>

(biasanya ada kat atas kod </body>)

6. Dan tambahkan kod warna ungu ini (kat bawah tu) dekat atas atau sebelum </body>

<div id='bottom'> <b:section class='bottom' id='left-bottom'/>
<b:section class='bottom' id='center-bottom'/>
<b:section class='bottom' id='right-bottom'/>
</div>

7. Lepas tu Save Templates (lihat perubahan pada bahagian Page Element).

Note:
Yang di Bold kan dengan warna merah tu boleh ditukar mengikut kesuaian blog anda.
Selamat mencuba. Kalau jadi alhamdulillah. Kalau tak jadi cuba lagi, sampai jadi..Hehe. Saya dah cuba di blog saya. Kalau tak jadi sampai ke sudah tak tahulah saya. Oklah, sebarang pertanyaan silalah kemukan ye kat ruangan komen. Bye-bye. Wassalam.

P/s :  Saya tulis entry nie guna Windows Live Writer.