Minggu 16 Mar 2025

Notification

×
Minggu, 16 Mar 2025

Iklan

Iklan

Cara Membuat 2, 3 dan 4 Kolom di Bawah Postingan

Selasa, 16 April 2013 | April 16, 2013 WIB Last Updated 2022-07-12T12:58:11Z



بِسْمِ اللّهِ الرَّحْمَنِ الرَّحِيْم


Bingung Mau nambah tempat gadget atau kolom terutama di bawah postingan. Jangan khawatir karena saya pada kesempatan kali ini akan memposting tentang membuat 2, 3 dan 4 kolom di bawah postingan, sebenarnya artikel kayak gini udah ada di mana-mana namun apa salahnya saya posting dengan persi saya itung-itung nambahin artikel saya dan jikalau ada yang belum tau kan jadi tau.






Tidak panjang lebar karena bakalan panjang nanti berat lagi loadingnya - langsung saja yah ke pembahasan :
Apa yang mesti sobat lakukan ?
ikuti Tur dibawah ini, he he Tur bagus nian bahasanya...
  1. Tentunya, Login dulu ke Blogger, bukan ke facebook.
  2. Pilih Rancangan-Edit HTML
  3. Centang  (√)  Expand Template Widget.
    Nb : jika takut terjadi kesalahan unduh dulu tamplate anda - untuk jaga-jaga.
  4. Kalau sudah, Anda cari kode ]]></b:skin> dan letakkan kode dibawah ini tepat di atas kode ]]></b:skin>

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

  6.  Berikutnya, cari kode yang mirip seperti kode di bawah ini :
  7.  <div id='footer'>
    <b:section class='footer' id='footer' showaddelement='yes'/>
    </div>   
  8. Atau
  9. <div id='footer-wrapper'>
    <b:section class='footer' id='footer' showaddelement='yes'/>
    </div>
  10. Note :
    Biasanya, setiap template memiliki kode yang berbeda-beda.
    Dalam hal ini, jika Anda tidak dapat menemukan kode <b:section class='footer' id='footer' showaddelement='yes'/> atau <b:section class='footer' id='footer' /> , yang perlu Anda lakukan adalah menambahkan kode berikut di bawah kode =>
    <div id='footer'> atau <div id='footer-wrapper'>.
  11. Untuk membuat footer 2 kolom, letakkan kode berikut :
    <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>
  • Jikalau Untuk membuat footer 3 kolom, letakkan kode berikut :
    <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>
  • Dan Untuk membuat footer 4 kolom , letakkan kode berikut :
    <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>
  • Jika sudah di tambahkan, klik tombol Simpan Template, dan lihat hasilnya,
  • Kalau ada masalah silahkan komentarnya, apalagi kalau berhasih.. he he maklum blog ane kan baru dan ni blog dofollow - komentar agan sangat bermanfaat bagi saya. :D
    ×
    Berita Terbaru Update