Bangiz kali ini mau berbagi tips sesuai jadul judul di atas yaitu cara membuat atau menambah kolom footer di blog. Setiap template tentunya beda-beda, ada yang mempunyai kolom footer 2, 3 atau 4 dan ada juga yang tidak menambahkan kolom footer tersebut. Itu tergantung dari desainer templatenya. jika Anda tertarik ingin menambah kolom footer tersebut, ikuti saja caranya berikut ini:
1. Seperti biasa masuk dulu ke dashboard blogger
2. Pilih menu Template > Edit HTML
Karena tampilan edit templatenya sudah baru jadi tidak ada centang-centang lagi, lanjut...hehe..
3. Copy kode berikut dan paste di atas ]]></b:skin> (gunakan Ctrl + F jika belum tahu)
/*----- Cara Menambah Kolom di Footer Blog By bangiz.blogspot.com -----*/
#lower {
margin:auto;
padding: 0px 0px 10px 0px;
width: 100%;
background:#transparant;
}
#lower-wrapper {
background:#ffffff;
margin:auto;
padding: 10px 0px 10px 0px;
width: 960px;
border:0;
}
#lowerbar-wrapper {
background:#ffffff;
float: left;
margin: 0px 5px auto;
padding-bottom: 10px;
width: 23%;
text-align: justify;
color:#000;
font: normal 12px Arial, Tahoma, Verdana;
line-height: 1.6em;
word-wrap: break-word;
overflow: hidden;
}
.lowerbar {margin: 0; padding: 0;}
.lowerbar .widget {margin: 0; padding: 10px 10px 0px 10px;}
.lowerbar h2 {
margin: 0px 0px 10px 0px;
padding: 3px 0px 3px 0px;
text-align: left;
border:0;
color:#000;
text-transform:uppercase;
font: bold 14px Oswald, Arial, Tahoma, Verdana;
}
.lowerbar ul {
color:#000;
margin: 0 auto;
padding: 0;
list-style-type: none;
}
.lowerbar li {
display:block;
color:#000000;
line-height: 1.6em;
margin-left: 0 !important;
padding: 6px;
border-bottom: 1px solid #025076;
border-top: 1px solid #981b1e;
list-style-type: none;
}
.lowerbar li a {
text-decoration:none; color: #3e3e3e;
}
.lowerbar li a:hover {
text-decoration:underline;
}
.lowerbar li:hover {
display:block;
background: #93c572;
}
4. Selanjutnya copy berikut dan paste di atas </body>
<div id='lower'>
<div id='lower-wrapper'>
<div id='lowerbar-wrapper'>
<b:section class='lowerbar' id='lowerbar1' preferred='yes'>
</b:section>
</div>
<div id='lowerbar-wrapper'>
<b:section class='lowerbar' id='lowerbar2' preferred='yes'>
</b:section>
</div>
<div id='lowerbar-wrapper'>
<b:section class='lowerbar' id='lowerbar3' preferred='yes'>
</b:section>
</div>
<div id='lowerbar-wrapper'>
<b:section class='lowerbar' id='lowerbar4' preferred='yes'>
</b:section>
</div>
<div style='clear: both;'/>
</div> </div>
5. Simpan tempalate
6. Klik Tata Letak, jika kolom tambahkan gadget sudah bertambah di bawah berarti sudah berhasil menambahkan kolomnya
Keterangan:
- Untuk mengubah lebar footer silahkan cari width: 960px; dan untuk lebar kolom ditandai dengan width: 23%;, silahkan atur sesuai lebar tampilan blog Anda.
- Jika kolomnya kurang banyak, Anda bisa menambah kolom dengan cara copy kode berikut dan paste sebelum kode <div style='clear: both;'/>
<div id='lowerbar-wrapper'>
<b:section class='lowerbar' id='lowerbar4' preferred='yes'>
</b:section>
</div>
Silahkan ganti lowerbar4 menjadi lowerbar5 dan begitu seterusnya jika ingin menambah lagi.