Ads by BuzzCity

Sabtu, 31 Desember 2011

Home » » Cara Membuat 3 KOLOM diatas FOOTER

Cara Membuat 3 KOLOM diatas FOOTER


Sebuah blog tanpa pernak-pernik widget didalamnya ibarat kata"sayur tanpa garam " kurang "maknyus" bila dilihat.maka dariitu diperlukan kreatifitas dan ketelatenan seorang bloger untuk menjadikan/make over tampilan blognya menjadi enak dilihat dan menarik untuk dibaca artikel didalamnya.untuk itu bila menggunakan template bawaan blogspot sendiri dirasa kurang maksimal maka dari itu disini ada 1 cara untuk menambahkan 3 kolom diatas footer yang berguna untuk menempatkan widget tambahan tadi tanpa harus mengurangi fungsi dari blog itu sendiri.cara membuatnya gampang dan simple,langsung aja ke tkp untuk mempelajarinya




langkah-langkah membuat 3 kolom bawah footer   

1.masuk kedalam dashbor bloger./
2.masuk ke dalam rancangan->edit HTML-->ceklist kotak atas dalam HTML tadi(disarankan back up dulu template sebelum utak-atik template)
3.cari kode ]]></b:skin>
4.masukkan kode dibawah ini DIATAS kode ]]></b:skin> tadi

#footer-column-container {
clear:both;
}
.footer-column {
padding: 10px;
}

5.cari kode yang mirip dengan kode berikut

<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>

6.kalau sudah ketemu pastekan kode dibawah ini tepat DIATAS nya

<div id='footer-column-container'>
<div id='footer2' style='width: 30%; float: left; margin:0; text-align: left;'>
<b:section class='footer-column' id='col1'
preferred='yes' style='float:left;'/>
</div>

<div id='footer3' style='width: 40%; float: left; margin:0; text-align: left;'>
<b:section class='footer-column' id='col2'
preferred='yes' style='float:left;'/>
</div>

<div id='footer4' style='width: 30%; float: right; margin:0; text-align: left;'>
<b:section class='footer-column' id='col3' preferred='yes' style='float:right;'/>
</div>

<div style='clear:both;'/>
<p> <hr align='center' color='#5d5d54' width='90%'/></p>

<div id='footer-bottom' style='text-align: center; padding: 10px; text-transform: lowercase;'>
<b:section class='footer' id='col-bottom' preferred='yes'>
<b:widget id='Text2' locked='false' title='' type='Text'/>
</b:section>
</div>

<div style='clear:both;'/>
</div>

7.simpan dan lihat apakah elemen sudah bertambah/belum jika belum berarti ada langkah yang terlewatkan,ulangi dari awal lagi.
8.jangan lupa berdoa dan semoga berhasil

  segala sesuatu yang diikuti dengan niat akan terwujud dan tercapai sobat ,salam bloger indonesia


Tidak ada komentar:

Poskan Komentar

Related Posts Plugin for WordPress, Blogger...