Cara Memodifikasi Kolom Gadget Footer

 

Cara Memodifikasi Kolom Footer Gadget - Pasti dah banyak deh tutorial tentang cara menambahkan atau memodifikasi kolom widget footer yang pernah sobat temui. Ya walaupun dah banyak ga ada salahnya kalo saya ikut-ikutan nulis artikel tentang cara memodifikasi kolom gadget pada footer blog, biar tambah banyak gitu. Yang ingin saya tulis disini adalah bagaimana walaupun kita memodifikasi elemen gadget, tapi blog kita masih ringan alias ramah SEO.

Cara memodifikasi kolom gadget footer:

1. Login Blogger -> Klik Design -> Edit HTML -> tidak perlu centang expand template widget, karena takut malah bikin pusing.
2.  Ganti Backup template anda terlebih dahulu. dengan cara klik pada Download Full Template agar anda bisa mengembalikan template anda ke kondisi semula jika terjadi kesalahan atau anda memang kurang puas terhadap hasilnya.
3.  Setelah itu, cari kode ]]></b:skin> dengan menekan ctrl+f
4.  Tambahkan kode dibawah ini diatas kode ]]></b:skin>                                                      #footer-column-divide { clear:both; } .footer-column { padding: 10px; } 
5.  Cari lagi di find kode yang kira-kira seperti ini : <div id='footer-wrapper'> <b:section class='footer' id='footer' showaddelement='yes'/> </div> atau <div id='footer'> <b:section class='footer' id='footer' showaddelement='yes'/> </div>
6. Setelah ketemu, tambahkan kode di bawah ini tepat di bawah <b:section class='footer' id='footer' showaddelement='yes'/> atau di <div id='footer-wrapper'> (jika belum ketemu, mungkin kode seperti ini : <div id='footer'> ) 

Jika ingin memodifikasi footer 2 kolom. Gunakan kode ini :
    <div id='footer-column-divide'> <div id='footer1' style='width: 50%; mengambang: kiri;
    margin:0; text-align:left;'>
    <b:section class='footer-column' id='col1'
    prefer='yes' style='float:left;'/>
    </div> <div id='footer2' style='lebar: 50%; mengapung: kiri;
    margin:0; text-align: left;'>
    <b:section class='footer-column' id='col2'
    prefer='yes' style='float:left;'/>
    </div> <div style='clear: keduanya;'/>
    </div>

Jika ingin footer 3 kolom. Gunakan kode ini :
<div id='footer-column-divide'>   
<div id='footer1' style='width: 33%; mengambang: kiri; margin:0; text-align:left;'>   
<b:section class='footer-column' id='col1' prefer='yes' style='float:left;'/> </div>   
<
div id='footer2' style='lebar: 33%; float: kiri;margin:0; perataan teks: kiri;'>   
<b:section class='footer-column' id='col2' lebih disukai='yes' style='float:left;'/> </div>   
<   
div id='footer3' style='lebar: 33%; mengapung: benar; margin:0; text-align: left;'>   
<b:section class='footer-column' id='col3' prefer='yes' style='float:right;'/>   

Memodifikasi footer menjadi 4 kolom. Gunakan kode ini :

<div id='footer-column-divide'>
<div id='footer1' style='width: 25%; mengambang:kiri;
margin:0; text-align:left;'>
<b:section class='footer-column' id='col1'
prefer='yes' style='float:left;'/>
</div> <div id='footer2' style='lebar: 25%; mengapung: kiri;
margin:0; perataan teks: kiri;'>
<b:section class='footer-column' id='col2'
lebih disukai='yes' style='float:left;'/>
</div> <div id='footer3' style='lebar: 25%; mengapung: benar;
margin:0; text-align: left;'>
<b:section class='footer-column' id='col3'
prefer='yes' style='float:
kanan;'/> </div> <div id='footer4' style='width: 25%; mengapung: benar;
margin:0; perataan teks: kiri;'>
<b:section class='footer-column' id='col4'
Preferred='yes' style='float:right;'/>
</div>
<div style='clear:both;'/>
</div >

7. Kalau sudah save dan lihat ke elemen halaman.

Semoga artikel tentang cara memodifikasi kolom gadget footer ini bisa bermanfaat dan mempercantik blog sobat, Kalau ada cara lain silahkan di share di sini, karena kelebihan blogspot adalah template yang bisa kita optimasi baik seo maupun tampilannya.

Bagikan Artikel ini