MEMBUAT FOOTER BAR STATIS

Footer bar statis yang dimaksudkan adalah tampilan bar yang berada di paling bawah halaman blog ini dan tak tergeser(statis) ketika scroll digerakkan. Yang perlu anda ketahui adalah bahwa kode css di bawah adalah hasil copy-paste dari script css footer bar yang terpasang di blog ini, jadi tampilannya akan sama persis, keculai anda sedikit melakukan perubahan untuk link-linknya.

Pertama yaitu Login Blog anda, Dari Dasbor Klik Tata Letak Lalu klik Edit HTML
Baiklah langsung kita mulai, yang pertama anda copy kode css di bawah ini:

#navbar-footer p {
float: left;
margin: 0px;
padding-top:4px;
padding-left:10px;
vertical-align: middle;
line-height: 1.2;
}
#navbar-footer {
align: center;
position: fixed;
border-top: 1px solid #ddd;
border-bottom: 5px solid #ffffff;
background-color: #ddd;
width: 100%;
left: 0px;
text-align: left;
color: #888;
font-family: Verdana;
font-size: 10px;
z-index:10000;
opacity: 0.9;
filter: alpha(opacity: 90);
bottom:0;
}
#footer-right {
text-align:right;
font-family:verdana;
font-size:14px;
font-color:#000000;
padding-right:30px;
}

Setelah itu paste-kan kode di bawah tag <![CDATA[

Kemudian copy lagi kode html di bawah ini:

<div id='navbar-footer'> <p> <table border='0' cellpadding='0' cellspacing='0' width='100%'> <tr> <td align='left' valign='middle'>© 2009 <a href='http://khamardos.co.cc/' title='Welcome To Here ...'>Khamardos's Site</a><br/> Hosted by <a href='http://www.blogger.com' title='blogger'>Blogger</a><br/> Thanks For All My Friend At SmanSa Pekanbaru . . . </td> <td align='right' valign='center'> <div align='right' id='footer-right'> <a href='http://khamardos.blogspot.com/search/label/friendster'>Friendster</a> <a href='http://khamardos.blogspot.com/search/label/facebook'>Facebook</a> <a href='http://khamardos.blogspot.com/search/label/Tip%20n%20Trik'>Tips n Trick</a> <a href='http://khamardos.blogspot.com/search/label/komputer'>Komputer</a> <a href='http://khamardos.blogspot.com/search/label/hacking'>Hacking</a> <a href='http://khamardos.blogspot.com/search/label/Belajar'>Belajar</a> <a href='http://khamardos.blogspot.com/search/label/Musik'>Musik</a> <a href='http://khamardos.blogspot.com/search/label/dll'>Dll</a></div> <td align='left' valign='middle' width='40'> <a href='#' title='Kembali Keatas !!!'> <img height='50' src='http://i655.photobucket.com/albums/uu271/spantibelspku/blog/top2.png' width='50'/> </a> </td> </td> </tr> </table> </p> </div> <script type='text/javascript'> var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www."); document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E")); </script> <script type='text/javascript'> try { var pageTracker = _gat._getTracker("UA-6583208-1"); pageTracker._trackPageview(); } catch(err) {}</script>

Lalu paste-kan di atas tag </body>

SELAMAT MENCOBA
Keberhasilan anda merupakan kebanggaan kami terimakasih

Cari Postingan yang lainnya

* Cara Membuat Footer Multi Kolom
* Cursor di ikuti oleh teks

Cara menampilkan Top Comment Berjalan

* Cursor Untuk Mempercantik Link

Membuat Pintu Blog

* Membuat Teks Berjalan

Membuat selamat datang sebelum masuk Blog

* Link dengan efek pelangi

Membuat Tulisan Berjalan di Taskbar

* Membuat Menu Horizontal

Membuat Readmore Gaya Baru

* Membuat sidebar kotak-kotak

Pasang Playlist di Blog

* Mambuat TV di Blog

Gambar yang selalu dibawah

* Marque Bulak Balik

Cara menulis Code Script d Postingan

* Membuat Banner Berjalan

Membuat Daftar Link

* Pasang TV Online di Face Book

Membuat Tombol Next pada Halaman Blog

* Membuat Readmore di Postingan

Membuat Readmore tanpa Code