Breaking News
Loading...
13 March 2013

Cara Menambah 3 Kolom dibawah footer blog || Dhani's Blog



Cara Menambah 3 Kolom dibawah footer blog || Dhani's Blog

Selamat siang sahabat blogger,mungkin ada yang mengatakan cara ini tidak perlu namun kadang kadang saat kita tidak tahu harus diletakkan dimana  lagi widget yang pantas,kadang footer lah pilihan terkhirnya,,tetapi kadang kadang ada template yang tidak menyediakan kolom untuk footer sehingga tidak leluasa untuk meletakkan widget di footer,artikel kali ini akan membahas tentang cara menambah 3 kolom dibawah footer.
nikmati tutorialnya gan :

1. Seperti biasa Login ke blog sobat terlebih dahulu.
2. Klik Template > Edit HTML > beri centang Expand Template Widget
3. Cari code
]]></b:skin>
 untuk mempercepat gunakan Ctrl+f
4. Copy code di bawah ini lalu letakkan tepat di atas code
]]></b:skin>

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

5. Selanjutnya cari code
<div id='footer'> atau id='footer'

6. Lalu copy lagi code di bawah ini letakkan tepat di bawah code
<div id='footer'> atau id='footer'
 tadi
<div id='footer-column-container'>
    <div id='footer2' 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='footer3' 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='footer4' 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;'/>
    <p>
    <hr align='center' color='#ffae00' width='90%'/></p>
    <div id='footer-bottom' style='text-align: center; padding:
    10px; text-transform: lowercase;'>
    <b:section class='footer' id='col-bottom' preferred='yes'>
    <b:widget id='Text2' locked='false' title='' type='Text'/>
    </b:section>
    </div>
    <div style='clear:both;'/>
    </div>
setelah itu save template.
untuk melihat hasilnya silahkan masuk ke tata letak,lalu lihat dibagian footer,jika ada 3 kolom kosong berarti proses nya berhasil,
oke,,selamat mencoba gan !!
semoga berhasil !!

Jangan Lupa Share jika Bermanfaat :)

0 komentar:

Post a Comment

*Komentar Tanpa Moderasi*
Silahkan berkomentar yang sopan, tidak mengandung unsur sara, pornografi.
Jika blog ini membantu, jangan lupa like Fanspage dan Follow Google+
Terima kasih

Copyright © 2013 Dhani's Blog All Right Reserved