Banyak sekali para blogger yang kebingungan bagaimana menampilkan multi page di blognya? Ada beberapa penyebab mungkin saja terlalu banyak artikel, sehingga dengan diberikannya Multi Page ini akan mempermudah para pengunjung melihat postingan lama dan baru. Karena belajar dari pengalaman, bila menggunakan default dari blogger yakni Older Post dan Newest Post para pengunjung kurang tertarik untuk melihatnya.
1. Login ke Dashboard anda > pilih Tata letak dan pilih Edit HTML.
2. Check pada Expand Widget Templates dan cari kode beikut dengan menekan Ctrl+F :
]]></b:skin>
3. Setelah ketemu, copy kode berikut tepat di atas kode yang di cari tadi :
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;
}
4. Lalu,cari lagi kode seperti ini:
</body>
5. Jika sudah ketemu, tepat diatasnya letakkan script dibawah ini:
<b:if cond='data:blog.pageType != "item"'>
<script type='text/javascript'>
var pageCount=5;
var displayPageNum=5;
var upPageWord ='Previous';
var downPageWord ='Next';
</script>
<script src='http://blogergadgets.googlecode.com/files/blogger-page-navi.v1.js' type='text/javascript'/>
</b:if>
<script type='text/javascript'>
var pageCount=5;
var displayPageNum=5;
var upPageWord ='Previous';
var downPageWord ='Next';
</script>
<script src='http://blogergadgets.googlecode.com/files/blogger-page-navi.v1.js' type='text/javascript'/>
</b:if>
6. Langkah terakhir,carilah kode berikut:
'data:label.url'
7. Jika sudah ketemu, hapus kode tersebut dan gantilah kode berikut:
'data:label.url + "?&max-results=5"'
8. Sekarang simpan templates anda dan anda bisa lihat hasilnya.
Tags: