Menambah Gadget 2 sampai 4 dibawah Posting Blog

Menambah 2 sampai 4 Gadget

Salam Blogger!
Pada kesempatan ini saya akan memberikan trik panduan mengenai bagaimana cara Menambah 2,3,4 Gadget dibawah posting Blog, Trik ini sangat bermanfaat bagi anda yang ingin template nya terlihat ramai, sehingga para pengunjung betah berlama-lama diblog Sobat, langsung saja kita lihat panduan nya dibawah ini :
      1.    Login ke Blogger
      2.    Pilih Rancangan-Edit HTML
      3.    Centang  (√)  Expand Template Widget. 
Jangan lupa Save dahulu 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.  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.  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.  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.  klik Pratinjau jika berhasil tekan tombol Simpan Template, dan lihat hasilnya.

Jika ada masalah ataupun kurang paham silahkan bertanya dengan mengisi dikotak komentar dibawah ini,

Semoga Bermanfaat.

0 komentar:

Posting Komentar

Silahkan sobat tinggalkan jejak di bawah ini...NO.SPAM
Dengan Memberikan Komentar Secara Otomatis akan Mendapatkan Pagerank, Traffic dan Backlink.