Cara Menambah 1 Kolom, 2 Kolom, 3 Kolom, 4 Kolom Diatas Footer

Cara Menambah 1 Kolom, 2 Kolom, 3 Kolom, 4 Kolom Diatas Footer - Istilah menambah gadget baru/elemen kolom di atas footer blogspot lebih d...

Cara Menambah 1 Kolom, 2 Kolom, 3 Kolom, 4 Kolom Diatas Footer - Istilah menambah gadget baru/elemen kolom di atas footer blogspot lebih dari 1 kolom lebih kerennya dengan nama membuat multi kolom di footer. Untuk cara meletakkan penambahan kolom baru yang berada diatas footer blog ini tidaklah sulit, namun tidak semua template blog terpasang footer. Kadang dengan sengaja si pembuat template tidak mencantumkan bagian elemen footer blog. Sekarang ke topik pembahasan bagaimana cara membagi footer menjadi multi kolom, seperti membagi footer menjadi 2 kolom, 3 kolom atau 4 kolom. Kalau membuat 4 kolom di footer blog, lebih bagusnya kalau mempunyai ukuran blog yang lebar. Terlebih dahulu simak postingan mengenai cara menambah 1 kolom, 2 kolom, 3 kolom dibawah header blog.

Cara Membuat Multi Kolom di Footer Blogspot

1. Login ke Blogger
2. Pilih Template => Edit HTML
3. Backup template (Download Full Template)
4. Tekan F3, cari kode ]]></b:skin> lalu letakkan kode berikut diatasnya

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

5. Selanjutnya cari kode seperti dibawah ini

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

atau bisa juga cari kode seperti dibawah ini

<div id='footer'>
<b:section class='footer' id='footer' showaddelement='yes'/>
</div>

6. Letakkan kode berikut dibawah kode <b:section class='footer' id='footer' showaddelement='yes'/> atau <b:section class='footer' id='footer' />

Apabila tidak ada kode <b:section class='footer' id='footer' showaddelement='yes'/> maka tambahkan aja kode berikut dibawah <div id='footer'>

Menambah 2 Kolom Diatas Footer

<div id='footer-column-divide'>

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

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

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

Hasilnya dari menambah 2 kolom di footer seperti gambar dibawah ini

Cara Menambah 1 Kolom, 2 Kolom, 3 Kolom, 4 Kolom Diatas Footer


Menambah 3 Kolom Diatas Footer

<div id='footer-column-divide'>

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

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

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

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

Hasilnya dari menambah 3 kolom di footer seperti gambar dibawah ini

Cara Menambah 1 Kolom, 2 Kolom, 3 Kolom, 4 Kolom Diatas Footer


Menambah 4 Kolom Diatas Footer

<div id='footer-column-divide'>

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

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

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

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

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

Hasilnya dari menambah 4 kolom di footer seperti gambar dibawah ini


Cara Menambah 1 Kolom, 2 Kolom, 3 Kolom, 4 Kolom Diatas Footer

Selamat mencoba Cara Menambah 1 Kolom, 2 Kolom, 3 Kolom, 4 Kolom Diatas Footer, semoga bermanfaat, happy blogging.

COMMENTS

BLOGGER: 3
Loading...
Name

Activator,3,Adobe,1,aneka resep,35,AntiVairus,1,coreldraw,22,Data Recovery,1,Driver,3,education,6,IDM,1,kesehatan,21,komputer,22,Multimedia,1,news,7,photoshop,42,relegius,19,seo,27,Serial Key,4,tips wanita,10,tutorial blog,117,
ltr
item
Full Version Download: Cara Menambah 1 Kolom, 2 Kolom, 3 Kolom, 4 Kolom Diatas Footer
Cara Menambah 1 Kolom, 2 Kolom, 3 Kolom, 4 Kolom Diatas Footer
http://3.bp.blogspot.com/-Am_oK93RBwQ/UUCX1sdBPLI/AAAAAAAAAsc/-9oZdKXh7Zc/s1600/2+kolom+footer.jpg
http://3.bp.blogspot.com/-Am_oK93RBwQ/UUCX1sdBPLI/AAAAAAAAAsc/-9oZdKXh7Zc/s72-c/2+kolom+footer.jpg
Full Version Download
https://bloggerbondowoso24.blogspot.com/2013/03/cara-menambah-1-kolom-2-kolom-3-kolom-4.html
https://bloggerbondowoso24.blogspot.com/
https://bloggerbondowoso24.blogspot.com/
https://bloggerbondowoso24.blogspot.com/2013/03/cara-menambah-1-kolom-2-kolom-3-kolom-4.html
true
7143853511036504925
UTF-8
Loaded All Posts Not found any posts VIEW ALL Readmore Reply Cancel reply Delete By Home PAGES POSTS View All RECOMMENDED FOR YOU LABEL ARCHIVE SEARCH ALL POSTS Not found any post match with your request Back Home Sunday Monday Tuesday Wednesday Thursday Friday Saturday Sun Mon Tue Wed Thu Fri Sat January February March April May June July August September October November December Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec just now 1 minute ago $$1$$ minutes ago 1 hour ago $$1$$ hours ago Yesterday $$1$$ days ago $$1$$ weeks ago more than 5 weeks ago Followers Follow THIS CONTENT IS PREMIUM Please share to unlock Copy All Code Select All Code All codes were copied to your clipboard Can not copy the codes / texts, please press [CTRL]+[C] (or CMD+C with Mac) to copy