Latest Games :
Home » » Cara Membuat 2, 3 dan 4 Kolom di Bawah Postingan

Cara Membuat 2, 3 dan 4 Kolom di Bawah Postingan

Rabu, 17 April 2013 | 0 komentar



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


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>
  12. 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>
  13. 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>
  14. 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
Share this article :

Tidak ada komentar:

 
Support : Creating Website | Johny Template | Mas Template
Copyright © 2011. Hanya Di Sini™ - All Rights Reserved
Template Modify by Creating Website
Proudly powered by Blogger