- Back to Home »
- Blogger , Tutorial »
- Membuat Menu Navigasi Di Postingan Blog Keren
Posted by : jalzae
Tuesday, June 26, 2012
Menu Navigasi ... Menu yang tidak kalah penting yang harus di dalam blog... kenapa?? tentu saja agar Visitor mudah "Blogwalking" di Blog kita tentunya ^_^
Lalu bagaimana menu navigasi yang baik di dalam blog??
Tentu menu itu mungkin kita bisa menambahkan efek yang agak berbeda di blog kita agar orang lain terus mengunjungi blog kita ^_^
LAngsung Cabut yuk... mau menu navigasi kaya jalz??Kalau bingung Baca ini
Contoh demo bisa dilihat disini coba Kalian Ke Footer PAge tersebut... Sorot ujung layar bawah.. Pasti ada menu navigasi muncul disana
Demo Gambar
Langsung Check out Cara Bikinya yaw
1.Masuk Ke Blogger kamu
2. Masuk Ke Design/Template
3.Centang
4. Cari /b:skin [Gunakan CTRL+F agar lebih cepat]
5.Masukkan Kode Berikut
blog pager Jalz
*/.pager
{
width:800px;
margin:0 auto;
padding:10px 0 0;
}
#blog-pager
{
text-align:center;
clear:both;
text-transform:uppercase;
margin:0;
padding:0;
}
#blog-pager a { margin: 0 0 0 5px; overflow: hidden; position: fixed; text-indent: -9999px; width: 80px; height: 80px; z-index: 9; -moz-transition: all 0.5s ease 0s; -webkit-transition: all 0.5s ease 0s; -o-transition: all 0.5s ease 0s; transition: all 0.5s ease 0s; bottom: 1%; opacity: 0.1; }
#blog-pager a:hover { opacity: 1; }
.blog-pager-older-link { background: url(http://4.bp.blogspot.com/-18bHuKvg5ao/TnGg6N1EtWI/AAAAAAAAA6A/ZhKPackZ4WQ/s400/Next.png ) no-repeat scroll 0 0 transparent; right: 5px; }
.blog-pager-newer-link { background: url(http://4.bp.blogspot.com/-QbeWH7P8OSE/TnGg_zIB6nI/AAAAAAAAA6I/TmNTauVcj3U/s400/Prev.png ) no-repeat scroll 0 0 transparent; left: 0; }
6.Save Template Mu
Ingat!!!
Kode berikut juga harus kamu ganti dengan pager !!
<div class="pager">
<b:include name="nextprev">
<b:include name="nextprev">
jika default template anda sudah seperti diatas.. maka tampilan akan jadi 100%
Good Luck!