Secara umum, navigasi untuk pindah halaman di blogspot biasanya
menggunakan link dengan teks "Older Posts (posting lama)" dan "Newer
Posts (posting baru)". Beda dengan wordpress yang navigasinya bisa
berbentuk angka sehingga bisa memudahkan untuk loncat beberapa halaman
ke postingan yg lama maupun baru.
Blogspot juga dapat mengganti Older Posts (Postingan Lama) dan Newer Posts (Postingan Baru) menjadi angka. Akan tetapi membutuhkan sedikit trik untuk melakukannya seperti gambar di bawah ini.
Ingat, untuk melakukan ini tidak diperkenankan Menghilangkan Link Older Posts atau Posting Lama pada postingan terdahulu, karena cara itu akan berakibat angka tidak akan muncul. Berikut ini cara Mengganti "Older Posts" Menjadi Angka:
1. Login Blogspot >> Template >> Edit HTML
2. Tekan ctrl + F untuk mencari kode: ]]></b:skin> dan letakkan kode berikut ini sebelum kode tersebut:
3. Kemudian cari kode: </body> dan letakkan kode dibawah ini sebelum kode tersebut.
4. Review dan save jika tidak terjadi error.
Selamat mencoba dan semoga berhasil.
Blogspot juga dapat mengganti Older Posts (Postingan Lama) dan Newer Posts (Postingan Baru) menjadi angka. Akan tetapi membutuhkan sedikit trik untuk melakukannya seperti gambar di bawah ini.
Ingat, untuk melakukan ini tidak diperkenankan Menghilangkan Link Older Posts atau Posting Lama pada postingan terdahulu, karena cara itu akan berakibat angka tidak akan muncul. Berikut ini cara Mengganti "Older Posts" Menjadi Angka:
1. Login Blogspot >> Template >> Edit HTML
2. Tekan ctrl + F untuk mencari kode: ]]></b:skin> dan letakkan kode berikut ini sebelum kode tersebut:
.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;
}
3. Kemudian cari kode: </body> dan letakkan kode dibawah ini sebelum kode tersebut.
<!--Page Navigation Starts-->
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<script type='text/javascript'>
var pageCount=5;
var displayPageNum=5;
var upPageWord ='Previous';
var downPageWord ='Next';
</script>
<script src='http://bloggergadgets.googlecode.com/files/blogger_pagenavi_min.js' type='text/javascript'/>
</b:if> </b:if>
<!--Page Navigation Ends -->
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<script type='text/javascript'>
var pageCount=5;
var displayPageNum=5;
var upPageWord ='Previous';
var downPageWord ='Next';
</script>
<script src='http://bloggergadgets.googlecode.com/files/blogger_pagenavi_min.js' type='text/javascript'/>
</b:if> </b:if>
<!--Page Navigation Ends -->
4. Review dan save jika tidak terjadi error.
Selamat mencoba dan semoga berhasil.
EmoticonEmoticon