"Blogger Footer Navbar"

Blogger Footer Navbar

 Agust'1nd, 2010 By Nanda

Bila anda ingin memodifikasi tampilan blog anda dan menampilkan navbar (navigational bar) seperti yang ada di bagian bawah atau footer dari Anang's Blog ini. Navbar tersebut senantiasa muncul pada bagian bawah blog kita, meskipun halaman tergulung (scrolled) ke atas maupun ke bawah.

Nah, untuk membuatnya berikut ini akan saya tunjukkan beberapa langkah-langkahnya. Pertama sekali tentunya anda harus login dulu ke akun Blogger anda. Buka Dasbor dan klik pada menu Layout dilanjutkan dengan menu Edit HTML dan beri tanda centang pada Expand Template Widget. Lalu pastekan kode CSS berikut ini persis sebelum tanda ]]>:

#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;
}

Langkah selanjutnya, masukkan kode berikut persis sebelum :


Ganti semua yang berhuruf tebal warna merah sesuai dengan keyakinan anda.. Halah.. Sesuai dengan blog dan identitas anda... Avatar, tandatangan, URL Blog/Friendster terserah anda...! Oke?

Selamat mencoba!
READ MORE - "Blogger Footer Navbar"
Langganan: Postingan (Atom)