Cara membuat 3 atau 4 Kolom di footter blog


Dalam tutorial Blogspot Anda akan belajar bagaimana mengkonversi footer yang ada Blogger (Blogspot footer) ke footer 3 kolom atau footer kolom 4. Dengan lebih banyak kolom di footer Blogger Anda Anda akan memiliki ruang ekstra untuk mengakomodasi widget lainnya seperti Flickr foto dan update Twitter. Juga Anda akan dapat menempatkan widget yang lebih sering digunakan seperti komentar Recents, arsip, pengikut, dll About Me di bagian bawah template Anda sehingga hanya widget paling penting dimuat pertama.

Tweak ini melibatkan menambahkan kode ke bagian footer dari template yang ada Blogger Anda untuk mengubahnya menjadi 3 kolom atau 4 kolom. Tutorial ini tidak di luar kemampuan pemula Blogger dan webmaster dengan keahlian menengah tetapi kebutuhan perawatan harus diambil ketika memodifikasi template Blogger Anda sehingga cadangan sebelum Anda mulai. Untuk hasil terbaik template Blogger dengan lebar sekitar 900px; adalah yang terbaik.

Langkah pembuatan :

  1. Terlebih dahulu backup Template Anda
  2. Lalu masuk ke menu Template >> Edit HTML >> Procedd >> cetang Expand Template widget
  3. Lalu cari kode yang sama atau mungkin sama dengan kode dibawa ini : (Ctrl + F)
<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>
Jika Anda mengalami kesulitan mencari bagian ini mencoba pencarian untuk footer-wrap atau yang serupa karena kadang-kadang bagian ini disebut sesuatu yang lain dalam beberapa template.

Untuk Menambah Footer 3 Kolom di Blogger ganti semua kode yang terletak pada langkah 3 dengan kode berikut :

<div id='footer-columns'>
<div id='footer1' 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='footer2' 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='footer3' 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;'/>
</div>
Untuk Menambah Footer 4 Kolom di Blogger ganti semua kode yang terletak pada langkah 3 dengan kode berikut :

<div id='footer-columns'>
<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: left; margin:0; text-align: left;'>
<b:section class='footer-column' id='col3' preferred='yes' style='float:left;'/>
</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>

Simpan perubahan ke template Blogger Anda.






Artikel Terkait


Category Article

What's on Your Mind...