Mengubah "Footer" Menjadi "Fixed-Footer"
Anda tahu Footer? Footer adalah bagian yang paling bawah dari sebuah blog. (Begini doang mah nggak usah dijelasin hehehe). Footer memang selalu ada di setiap template, tapi pernahkah anda melihat Fixed-Footer? Fixed-Footer tidak terlalu berbeda dengan Footer yang biasa, hanya saja posisi Fixed-Footer akan terus bertumpu tetap pada saat scroll digerakkan dan inilah yg menjadi keistimewaannya Fixed-Footer……Wes…poko’e ngono lah…makin dijelaskan makin pusing aku
Saat ini, baru sedikit yang mengganti footer biasa dengan fixed-footer. Yang baru saya ketahui adalah blogmenjerit, anangku, dan blog saya sendiri. Bagi yang sudah kebelet mengikuti tutorialnya, ikuti saya. Bagi yang kebelet kencing, silahkan pipis dulu :D).
1.Msuk ke Dashboard->Layout->Edit-HTML.
2.Sediakan template cadangan apabila tutorial ini gagal dengan cara ketik REG [spasi] template mengklik link Download Template Lengkap.
3.Centangi kotak Expand Template Widget.
4.Cari kode ]]></b:skin>, kalau sudak ketemu tambahkan kode ini atasnya
#fixed-footer p.info {
float: right;
padding-right:40px;
line-height: 1.2;
height: 100%;
vertical-align: bottom;
}
#fixed-footer p {
float: left;
margin: 0px;
padding-top:4px;
padding-left:40px;
vertical-align: bottom;
line-height: 1.2;
}
#fixed-footer a {
color: #333;
}
#fixed-footer {
align: center;
position: fixed;
border-top: 1px solid #ddd;
border-bottom: 5px solid #f5f5f5;
background-color: #f5f5f5;
width: 100%;
left: 0px;
text-align: left;
color: #888;
font-family: Verdana;
font-size: 11px;
z-index:10000;
opacity: 0.9;
filter: alpha(opacity: 90);
bottom:0;
}
5.Cari kode di bawah ini
<div id=’footer‘>
<b:section class=’footer‘ id=’footer‘>
</b:section>
</div>
Ganti semua kode yang ditebalkan dengan fixed-footer
Tetapi, bagaimana bila kodenya seperti ini
<div id=’footer-wrap1′><div id=’footer-wrap2′>
<b:section class=’footer‘ id=’footer‘>
</b:section>
</div>
Maka, ganti hanya kode yg miring dan bergaris bawah saja.
Simpan template……Selesai…wets..tunggu dulu bro…masih ada satu pekerjaan lagi, yaitu menambahkan elemen halaman. Makanya, trik ini membutuhkan stamina dan fisik yg kuat untuk menyelesaikannya :O.
6.Sekarang, kita berpindah ke submenu Elemen Halaman. Silahkan kik Tambah Elemen Halaman, lalu pilih HTML/Javascript. Copy-paste kode ini lalu masukkan ke elemen halaman blog anda.
<center>Gudang-HTML is Powered by <a href=”http://www.blogger.com/”>Blogger</a> | Created and Maintained by <a href=”mailto:istifajar@o-om.com”>Istifajar</a> <a href=”ymsgr:sendIM?awe_dunk”> <img src=”http://opi.yahoo.com/online?u=awe_dunk&m=g&t=0&l=us”/>
</a> Best viewed in Firefox 1.5+ at 1024×768 or higher resolution</center>
Silahkan anda obrak-abrik sendiri sesuai keinginan…..Lalu simpan dan lihat blog anda sekarang….
Met weekend :)
Sumber:blogmenjerit.blogspot.com











Blog aku juga pake Fix Footer tapi bukan taro dibawah tapi diatas .
saya rasa ada yang tak kena dengan tutorial ini, sila check balik.
kod ini
#fixed-footer p.info {
.
.
.
}
#fixed-footer p {
.
.
.
}
hanya diguna jika tulisan anda ada <p class="info"></p>
terima kasih :-)
@ blogmenjerit: terima kasih sudah memberitahukan :)
boss, mw nanya neh, gmn caranya bwt kotak komentar kayak punya boss ini?
kasih pencerahan donk!
di pelajari lebih dalam lagi ah….
Leave your response!
Terbaru
Ads Berner
Comments
BuZZ mE
UserOnline
TOP Bulan ini
Categories
Archives
se_LINK-an
Tag Cloud
WP Cumulus Flash tag cloud by Roy Tanck requires Flash Player 9 or better.
Random Posts
Most Commented
Most Viewed