Sebelumnya, teman2 ada yang belum tahu apa itu navigasi halaman? Navigasi halaman yaitu fitur yang berfungsi sebagai rel untuk menuju ke halaman selanjutnya maupun ke halaman sebelumnya. Mungkin teman2 akan lebih jelas lagi kalau teman2 langsung pergi ke halaman google.com sekarang juga dan coba perhatikan angka2 halaman yg berada pada bagian paling bawah halaman google search tersebut. Nah, nomor2 halamn tersebutlah yang dinamakan navigasi halaman. Sebenarnya pihak blogger telah menyediakan fitur ini di blog kita sejak awal, akan tetapi bentuk navigasinya sederhana sekali yaitu berbentuk tulisan "Posting lama", "posting lebih baru", dll maka dari itu bagi teman2 yg ingin menampilkan blognya lebih ekspresif lagi maka bisa juga diterapkan trik yg satu ini.
Contoh tampilan
Cara membuatnya silahkan login dulu ke akun blogger, lalu klik tata letak >> Edit HTML ("expand widget templet" gak usah dicentang)
Selanjutnya letakkan kode berikut di atas tag ]]>
.showpageArea a {
text-decoration:underline;
}
.showpageNum a {
text-decoration:none;
border: 1px solid #cccccc;
margin:0 3px;
padding:3px;
}
.showpageNum a:hover {
border: 1px solid #cccccc;
background-color:#cccccc;
}
.showpagePoint {
color:#333;
text-decoration:none;
border: 1px solid #cccccc;
background: #cccccc;
margin:0 3px;
padding:3px;
}
.showpageOf {
text-decoration:none;
padding:3px;
margin: 0 3px 0 0;
}
.showpage a {
text-decoration:none;
border: 1px solid #cccccc;
padding:3px;
}
.showpage a:hover {
text-decoration:none;
}
.showpageNum a:link,.showpage a:link {
text-decoration:none;
color:#333333;
}
text-decoration:underline;
}
.showpageNum a {
text-decoration:none;
border: 1px solid #cccccc;
margin:0 3px;
padding:3px;
}
.showpageNum a:hover {
border: 1px solid #cccccc;
background-color:#cccccc;
}
.showpagePoint {
color:#333;
text-decoration:none;
border: 1px solid #cccccc;
background: #cccccc;
margin:0 3px;
padding:3px;
}
.showpageOf {
text-decoration:none;
padding:3px;
margin: 0 3px 0 0;
}
.showpage a {
text-decoration:none;
border: 1px solid #cccccc;
padding:3px;
}
.showpage a:hover {
text-decoration:none;
}
.showpageNum a:link,.showpage a:link {
text-decoration:none;
color:#333333;
}
Lalu letakkan kode berikut di atas kode tag

EmoticonEmoticon