TUTORIAL BLOGGING , BLACKBERRY , TEMPLATE SEO FRIENDLY
Cara Mudah Membuat Slide Show di Blog   Mengunci File Pribadi   memberi efek warna stabilo di postingan   cara membuat tulisan berwarna   Memodifikasi Email Subscribe Form   Menambahkan Footer Multi Kolom   Trik merubah warna background widget dengan CSS3   Menghasilkan uang dengan website atau blog anda   template web gratis untuk membuat website   Membuat file xml dengan adobe photoshop   membuat daftar isi blog   Cara menyisipkan Link di komentar blog   membuat script iklan banner   pasang link teman dengan menu dropdown   Membuat readmore kreasi sendiri   Merubah Background Sidebar atau Gadget Blog Blogspot   Aplikasi Penyadap SMS   CARA MUDAH HACK DAN JAHILI FACEBOOK FRIENDS   Mengganti Gambar Background Blog di Blogger/Blogspot   Pasang Iklan diBAWAH postingan  

close
cbox

Membuat Footer Multi Kolom



Di malam yang sedikit mendung ini saya kembali akan membagikan sedikit tutorial blogger. Pada postingan kali ini kita akan membahas cara membuat footer multi kolom, atau lebih tepatnya membuat tiga kolom di bagian footer.

Membuat footer multi kolom memang sangat berguna untuk menambah koleksi widget kita agar tidak selalu di tempatkan di bagian sidebar.
Secara default template asli blogger tidak terdapat kolom di bagian footer, meskipun banyak template custom yang sudah menyediakan footer multi kolom.

Bagi sobat blogger yang tertarik ingin menambahkan tiga kolom atau add gadget di bagian footer, silahkan ikuti langkah-langkah di bawah ini.

1. Login ke akun blogger
2. Pilih design kemudian edit HTML
3. Jangan lupa Expand Widget Template
4. Untuk menghindari kesalahan, backup template dulu
5. Selanjutnya paste kode di bawah ini DI ATAS ]]></b:skin>


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

6. Langkah selanjutnya temukan kode.

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

7. Lalu pastekan kode berikut DI BAWAH kode di atas.

<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>

8. Save template
9. Pergi ke elemen laman untuk melihat perubahannya


Responses

0 Respones to "Membuat Footer Multi Kolom"

I-) 8-| L-) :-a :-$ [-( :O) 8-} 2:-P (:| =P~ :-? #-o =D7 :-SS @-) :^o :-w 7:P

Posting Komentar

Terima kasih telah membaca dan berkomentar Membuat Footer Multi Kolom, .

Form Komentar Klasik

 

site

GenieRank
Free Plugboard Link Banner ButtonFree Promotion LinkFree Smart Automatic BacklinkMalaysia Free Backlink Services MAJLIS LINK: Do Follow BacklinkLink Portal Teks TVAutoBacklinkGratisjapanese instant free backlink Free Automatic Backlink Service Free Plugboard Link Banner Button

Community


Google PageRank Checker Powered by  MyPagerank.Net Bloggers - Meet Millions of BloggersComputers Blogs
Stay Teddy - Find me on Bloggers.comMy blorner alt="IP" />
Free Counter

Site Info


My Popularity (by popuri.us)
Return to top of page Copyright © 2010 Stay Teddy|Official site All Right Reserved Powered By Blogger