Pagenation With sitemap
by dharlaferdana
HTML
<div id="tabbed-toc">
</div>
<div id="itempager" style="position:relative;"><div id="pagination"></div><div id="totalposts"></div>
CSS
#tabbed-toc .toc-tab-item-4,#tabbed-toc .toc-tab-item-11,#tabbed-toc .toc-tab-item-12 {
display:none;
cursor:not-allowed;
}
.post-body {
margin:0;
padding:0;
border-top:1px solid #444;
border-bottom:1px solid #222;
}
#tabbed-toc {
margin:5px auto 0;
background-color:#292929;
border-top:1px solid #222;
border-bottom:1px solid #444;
overflow:hidden;
position:relative;
color:#888;
}
#tabbed-toc .loading {margin:20px 47%;}
#tabbed-toc ul,#tabbed-toc ol,#tabbed-toc li {
margin:0 0;
padding:0 0;
list-style:none;
}
#tabbed-toc .toc-tabs {
width:20%;
float:left;
border-top:1px solid #444;
border-bottom:1px solid #222;
}
#tabbed-toc .toc-tabs li a {
display:block;
font:normal bold 10px/28px Helmet,Freesans,Sans-Serif;
height:28px;
overflow:hidden;
text-overflow:ellipsis;
color:#ccc;
border-top:1px solid #222;
border-bottom:1px solid #444;
text-transform:uppercase;
text-decoration:none;
padding:0 10px;
margin:0 5px;
cursor:pointer;
}
#tabbed-toc .toc-tabs li a:hover {
background-color:#222;
color:white;
padding:0 20px;
margin:0 -5px;
}
#tabbed-toc .toc-tabs li a.active-tab {
background-color:#555;
color:#C4DEF0;
font-size:13px;
font-weight:bold;
border-top:1px solid #444;
border-bottom:1px solid #444;
border-right:1px solid #222;
-webkit-box-shadow:-2px 2px 2px rgba(0,0,0,.5);
-moz-box-shadow:-2px 2px 2px rgba(0,0,0,.5);
box-shadow:-2px 2px 2px rgba(0,0,0,.5);
position:relative;
z-index:5;
padding:0 15px;
margin:-1px -1px 0 0;
}
#tabbed-toc .toc-content,#tabbed-toc .divider-layer {
width:80%;
float:right;
background-color:#333;
border-left:1px solid #222;
border-right:1px solid #444;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
}
#tabbed-toc .divider-layer {
float:none;
display:block;
position:absolute;
top:0;
right:0;
bottom:0;
-webkit-box-shadow:0 0 7px rgba(0,0,0,.7);
-moz-box-shadow:0 0 7px...
JavaScript
var tabbedTOC = {
blogUrl: "http://kom4.blogspot.com",
activeTab: 1,
showDates: true,
showSummaries: true,
numChars: 50,
showThumbnails: true,
thumbSize: 40,
noThumb: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAA3NCSVQICAjb4U/gAAAADElEQVQImWOor68HAAL+AX7vOF2TAAAAAElFTkSuQmCC",
monthNames: ["Januari", "Februari", "Maret", "April", "Mei", "Juni", "Juli", "Agustus", "September", "Oktober", "November", "Desember"],
newTabLink: true,
maxResults: 20,
preload: onload,
totalPostLabel: "Jumlah posting:",
jumpPageLabel: "Halaman",
prevText: "Sebelumnya",
nextText: "Berikutnya",
minpage: 6,
maxpage: 10,
firstpage: 0,
pagernum: 0,
postsnum: 0,
actualpage: 1,
postsperpage: 99999,
labelSorter: "JQuery",
loadingText: "Loading...",
sortByLabel: false,
sortAlphabetically: true,
showNew: false,
rmoreText: "Selengkapnya ►",
newText: " - <em style='color:red;'>New!</em>",
_results: document.getElementById('tabbed-toc'),
_pagination: document.getElementById('pagination'),
_totalposts: document.getElementById('totalposts')
};
var tabbedTOC_defaults = {
blogUrl: "http://kom4.blogspot.com/",
activeTab: 1,
showDates: false,
showSummaries: false,
numChars: 200,
showThumbnails: false,
thumbSize: 40,
noThumb: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAA3NCSVQICAjb4U/gAAAADElEQVQImWOor68HAAL+AX7vOF2TAAAAAElFTkSuQmCC",
monthNames: ["Januari", "Februari", "Maret", "April", "Mei", "Juni", "Juli", "Agustus", "September", "Oktober", "November", "Desember"],
newTabLink: true,
maxResults: 99999,
preload: 0,
totalPostLabel: "Jumlah posting:",
jumpPageLabel: "Halaman",
prevText: "Sebelumnya",
nextText: "Berikutnya",
minpage: 6,
maxpage: 10,
firstpage: 0,
pagernum: 0,
postsnum: 0,
actualpage: 1,
postsperpage: 3,
...