CSS
/* Pagen Navigation with number */
#blog-pager {margin: 10px 0 20px 25px;clear:both !important;padding:0;font-size:11px;font-weight:bold;}
a.home-link,
#blog-pager-newer-link a,
#blog-pager-older-link a {background-color:#333;border: 1px solid #ddd;padding:0px 12px;line-height:28px;color:#fff;border-radius: 3px;}
#blog-pager-newer-link a {float:left;display:block;}
#blog-pager-older-link a {float:right;display:block;}
a.home-link {display:inline-block;}
#blog-pager-older-link a:hover,
#blog-pager-newer-link a:hover, a.home-link:hover {border: 1px solid #FF8100;}
.feed-links { clear: both;display:none;}
.displaypageNum a,.showpage a,.pagecurrent {padding: 8px 10px;margin-right: 3px;color: #fff;background-color: #333;border: 1px solid #ddd;display: inline-block;border-radius: 3px;}
.displaypageNum a:hover,.showpage a:hover, .pagecurrent {border: 1px solid #FF8100;color: #FF8100}
.showpageOf {display:none !important;}
/* Centered text */
.centered {
position: absolute;
top: 45%;
left: 50%;
transform: translate(-50%, -50%);
scroll-behavior: smooth;
}
Script
<div class='pagenavi'>
<script type='text/javascript'>
var pageNaviConf = {
perPage: 20,
numPages: 5,
firstText: "First",
lastText: "Last",
nextText: "Next",
prevText: "Prev"
}
</script>
<script type='text/javascript'>
//<![CDATA[
function pageNavi(o) {
var m = location.href,
l = m.indexOf("/search/label/") != -1,
a = l ? m.substr(m.indexOf("/search/label/") + 14, m.length) : "";
a = a.indexOf("?") != -1 ? a.substr(0, a.indexOf("?")) : a;
var g = l ? "/search/label/" + a + "?updated-max=" : "/search?updated-max=",
k = o.feed.entry.length,
e = Math.ceil(k / pageNaviConf.perPage);
if (e <= 1) {
return
}
var n = 1,
h = [""];
l ? h.push("/search/label/" + a + "?max-results=" + pageNaviConf.perPage) : h.push("/?max-results=" + pageNaviConf.perPage);
for (var d = 2; d <= e; d++) {
var c = (d - 1) * pageNaviConf.perPage - 1,
b = o.feed.entry[c].published.$t,
f = b.substring(0, 19) + b.substring(23, 29);
f = encodeURIComponent(f);
if (m.indexOf(f) != -1) {
n = d
}
h.push(g + f + "&max-results=" + pageNaviConf.perPage)
}
pageNavi.show(h, n, e)
}
pageNavi.show = function (f, e, a) {
var d = Math.floor((pageNaviConf.numPages - 1) / 2),
g = pageNaviConf.numPages - 1 - d,
c = e - d;
if (c <= 0) {
c = 1
}
endPage = e + g;
if ((endPage - c) < pageNaviConf.numPages) {
endPage = c + pageNaviConf.numPages - 1
}
if (endPage > a) {
endPage = a;
c = a - pageNaviConf.numPages + 1
}
if (c <= 0) {
c = 1
}
var b = '<span class="pages">Pages ' + e + ' of ' + a + "</span> ";
if (c > 1) {
b += '<a href="' + f[1] + '">' + pageNaviConf.firstText + "</a>"
}
if (e > 1) {
b += '<a href="' + f[e - 1] + '">' + pageNaviConf.prevText + "</a>"
}
for (i = c; i <= endPage; ++i) {
if (i == e) {
b += '<span class="current">' + i + "</span>"
} else {
b += '<a href="' + f[i] + '">' + i + "</a>"
}
}
if (e < a) {
b += '<a href="' + f[e + 1] + '">' + pageNaviConf.nextText + "</a>"
}
if (endPage < a) {
b += '<a href="' + f[a] + '">' + pageNaviConf.lastText + "</a>"
}
document.write(b)
};
(function () {
var b = location.href;
if (b.indexOf("?q=") != -1 || b.indexOf(".html") != -1) {
return
}
var d = b.indexOf("/search/label/") + 14;
if (d != 13) {
var c = b.indexOf("?"),
a = (c == -1) ? b.substring(d) : b.substring(d, c);
document.write('<script type="text/javascript" src="/feeds/posts/summary/-/' + a + '?alt=json-in-script&callback=pageNavi&max-results=99999"><\/script>')
} else {
document.write('<script type="text/javascript" src="/feeds/posts/summary?alt=json-in-script&callback=pageNavi&max-results=99999"><\/script>')
}
})();
//]]>
</script>
<div class='clear'/>
</div>
Tidak ada komentar
Posting Komentar