Friday, January 15, 2010

Membuat Navbar Footer

Triks kali ini saya ingin berbagi bagaimana cara membuat navbar footer, hehe emangnya navbar cuma ada diatas doang???. ya udahlah ga usah basa basi lagi langsung ajah.. ikuti petunjuknya dibawah ini :
  • Seperti biasa backup terlebih dahulu template anda untuk mencegah hal-hal yang tidak diinginkan.
  • Masuk ke Tata Letak/Edit Html.
  • Cari kode ]]></b:skin> lalu letakkan kode dibawah ini diatasnya.
    #navbar-footer p.info { float: right; padding-right:40px; line-height: 1.2; height: 100%; vertical-align: bottom; } #navbar-footer p { float: left; margin: 0px; padding-top:4px; padding-left:40px; vertical-align: bottom; line-height: 1.2; } #navbar-footer a { color: #333; } #navbar-footer { align: center; position: fixed; border-top: 1px solid #ddd; border-bottom: 10px 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; }
  • Stelah itu letakkan kode dibawah ini sebelum </body>
    <div id="navbar-footer"> <p> <img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEijGaXlD7ozSF_xUjO7ue4F9C7yhP1QxwR6LJY66NCIsK123z6FiOzWanaOgjN46Jl1V_8aQ1pE9FFYL33aaXclmVf8xTrrzdZgKidoRLsEZ1Rlu6zVWnoyTO5ON2vMD5Zak8zy7dJBUow/s400/anang.jpg"/>&#160;&#160;<a href="http://anangku.blogspot.com/index.html">Anang's Blog</a>&#160;&#169;&#160;2006-2008 <img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2jZ2j5Gqrgc_MCdR_MAXEd9o6G7GK9D1M24_KKBC8yJHQ_jeXEG1im-2myaqk7yeqoLb6qtlaMhaTyjrOPj5fY6YlhzGSivTgaWN9DduMS3yq_mMHI0B7WT-r5TVtbwZifFJOQBFMHYU/s400/signature.gif"/></p> <p class="info">Powered by <a href="http://www.blogger.com">Blogger</a> | Created and Maintained by <a href="http://www.friendster.com/anangku" target="_blank">Anang</a><br/>Best viewed in Firefox 1.5+ at 1024x768 or higher resolution <br/> </p> </div>
  • Ganti semua tulisan yang berwarna merah sesuai dengan kenginan anda.
  • Save Template anda. (sumber)
nah semoga bermanfaat ya.. selamat mencoba..

0 komentar:

Post a Comment

saran, komentar dan kritikan anda sangat berharga buat saya, terima kasih.