Home » , » Cara Membuat dan Membagi Footer di Blog

Cara Membuat dan Membagi Footer di Blog

Written By Unknown on Thursday, September 27, 2012 | 8:08 PM


Cara Membuat dan Membagi Footer di Blog - Bagi anda yang menggunakan template blog yang tidak memiliki footer atau hanya memiliki 1 kolom footer saja, anda bisa membuatnya dan bisa membaginya menjadi 2 atau 3 kolom, atau bahkan lebih. Tutorial cara membuat dan membagi footer di blog mungkin sangatlah mudah sekali bagi seorang blogger professional, namun bagi seorang blogger newbie atau pemula seperti saya ini, tidak jarang akan mengalami kesulitan jika melakukannya tanpa panduan manual tentang cara membuat dan membagi footer di blog yang jelas dan mudah di pahami.

Untuk cara membuat dan membagi footer di blog, anda bisa melakukannya dengan mengikuti langkah-langkah seperti berikut ini :

1. Masuk ke blogger.com menggunakan akun anda.
2. Menuju ke halaman "Template".



3.  Kemudian pilih "Edit HTML", klik "Lanjutkan" dan jangan lupa centang "Expand Template Widget".


4. Lalu cari kode ]]></b:skin> dan letakkan script kode berikut di atasnya :

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

5. Setelah itu cari kode <div id='footer-wrapper'> atau kode <div class='footer-outer'>.

6. Kemudian letakkan script kode berikut ini tepat di bawah kode <div id='footer-wrapper'> atau kode <div class='footer-outer'> tersebut.

Untuk membuat footer 2 kolom :

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


Untuk membuat footer 3 kolom :

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


Untuk membuat footer 4 kolom :

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


7. Klik save/simpan template, dan selesai...

Sekarang yang perlu anda lakukan adalah tinggal menambahkan gadget-gadget yang sesuai dengan selera anda pada footer yang telah di buat tadi. Cukup sekian postingan pada kesempatan kali ini tentang cara membuat dan membagi footer di blog. Semoga bermanfaat bagi anda, dan selebihnya saya mohon ma'af atas segala kesalahan yang ada. Salam sejahtera by ngeposta...

0 comments:

Post a Comment