Tạo SiteMap Dạng Bảng Kiểu 1 Cho Blogspot

Đây là sitemap dạng danh mục labels giúp khách thăm có cái nhìn tổng quan hơn về blog của bạn.Cài đặt cũng khá đơn giản
Để tạo tiện ích này ta vào thiết kế chọn thêm trang mới và chọn 1 trang trống rồi dán đoạn code sau vào và lưu lại còn cách bố trí trang này ở vị trí nào là tùy bạn.

Code:
<script type='text/javascript'>
//<![CDATA[
if (typeof jQuery == 'undefined') {
cekjq = {};
cekjq.s = document.createElement('script');
cekjq.s.src = 'http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js';
document.getElementsByTagName('head')[0].appendChild(cekjq.s)
}
var postTitle = new Array();
var postUrl = new Array();
var postMp3 = new Array();
var postDate = new Array();
var postLabels = new Array();
var postBaru = new Array();
var sortBy = "titleasc";
var tocLoaded = false;
var numChars = 250;
var postFilter = '';
var numberfeed = 0;

function loadtoc(json) {
function getPostData() {
if ("entry" in json.feed) {
var numEntries = json.feed.entry.length;
numberfeed = numEntries;
ii = 0;
for (var i = 0; i < numEntries; i++) {
var entry = json.feed.entry[i];
var posttitle = entry.title.$t;
var postdate = entry.published.$t.substring(0, 10);
var posturl;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
posturl = entry.link[k].href;
break
}
}
var postmp3 = '';
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'enclosure') {
postmp3 = entry.link[k].href;
break
}
}
var pll = '';
if ("category" in entry) {
for (var k = 0; k < entry.category.length; k++) {
pll = entry.category[k].term;
var l = pll.lastIndexOf(';');
if (l != -1) {
pll = pll.substring(0, l)
}
postLabels[ii] = pll;
postTitle[ii] = posttitle;
postDate[ii] = postdate;
postUrl[ii] = posturl;
postMp3[ii] = postmp3;
if (i < 10) {
postBaru[ii] = true
} else {
postBaru[ii] = false
};
ii = ii + 1
}
}
}
}
}
getPostData();
sortBy = "titleasc";
sortPosts(sortBy);
sortlabel();
tocLoaded = true;
displayToc2();
document.write('')
}
function filterPosts(filter) {
scroll(0, 0);
postFilter = filter;
displayToc(postFilter)
}
function allPosts() {
sortlabel();
postFilter = '';
displayToc(postFilter)
}
function sortPosts(sortBy) {
function swapPosts(x, y) {
var temp = postTitle[x];
postTitle[x] = postTitle[y];
postTitle[y] = temp;
var temp = postDate[x];
postDate[x] = postDate[y];
postDate[y] = temp;
var temp = postUrl[x];
postUrl[x] = postUrl[y];
postUrl[y] = temp;
var temp = postLabels[x];
postLabels[x] = postLabels[y];
postLabels[y] = temp;
var temp = postMp3[x];
postMp3[x] = postMp3[y];
postMp3[y] = temp;
var temp = postBaru[x];
postBaru[x] = postBaru[y];
postBaru[y] = temp
}
for (var i = 0; i < postTitle.length - 1; i++) {
for (var j = i + 1; j < postTitle.length; j++) {
if (sortBy == "titleasc") {
if (postTitle[i] > postTitle[j]) {
swapPosts(i, j)
}
}
if (sortBy == "titledesc") {
if (postTitle[i] < postTitle[j]) {
swapPosts(i, j)
}
}
if (sortBy == "dateoldest") {
if (postDate[i] > postDate[j]) {
swapPosts(i, j)
}
}
if (sortBy == "datenewest") {
if (postDate[i] < postDate[j]) {
swapPosts(i, j)
}
}
if (sortBy == "orderlabel") {
if (postLabels[i] > postLabels[j]) {
swapPosts(i, j)
}
}
}
}
}
function sortlabel() {
sortBy = "orderlabel";
sortPosts(sortBy);
var j = 0;
var i = 0;
while (i < postTitle.length) {
temp1 = postLabels[i];
firsti = j;
do {
j = j + 1
} while (postLabels[j] == temp1);
i = j;
sortPosts2(firsti, j);
if (i > postTitle.length) break
}
}
function sortPosts2(firstvar, lastvar) {
function swapPosts2(x, y) {
var temp = postTitle[x];
postTitle[x] = postTitle[y];
postTitle[y] = temp;
var temp = postDate[x];
postDate[x] = postDate[y];
postDate[y] = temp;
var temp = postUrl[x];
postUrl[x] = postUrl[y];
postUrl[y] = temp;
var temp = postLabels[x];
postLabels[x] = postLabels[y];
postLabels[y] = temp;
var temp = postMp3[x];
postMp3[x] = postMp3[y];
postMp3[y] = temp;
var temp = postBaru[x];
postBaru[x] = postBaru[y];
postBaru[y] = temp
}
for (var i = firstvar; i < lastvar - 1; i++) {
for (var j = i + 1; j < lastvar; j++) {
if (postTitle[i] > postTitle[j]) {
swapPosts2(i, j)
}
}
}
}
function displayToc(filter) {
var numDisplayed = 0;
var tocTable = '';
var tocHead1 = 'Judul Artikel';
var tocTool1 = 'Klik untuk sortir berdasarkan judul';
var tocHead2 = 'Tanggal';
var tocTool2 = 'Klik untuk Sortir bedasarkan tanggal';
var tocHead3 = 'Kategori';
var tocTool3 = '';
if (sortBy == "titleasc") {
tocTool1 += ' (descending)';
tocTool2 += ' (newest first)'
}
if (sortBy == "titledesc") {
tocTool1 += ' (ascending)';
tocTool2 += ' (newest first)'
}
if (sortBy == "dateoldest") {
tocTool1 += ' (ascending)';
tocTool2 += ' (newest first)'
}
if (sortBy == "datenewest") {
tocTool1 += ' (ascending)';
tocTool2 += ' (oldest first)'
}
if (postFilter != '') {
tocTool3 = 'Klik untuk menampilkan semua'
}
tocTable += '<table>';
tocTable += '<tr>';
tocTable += '<td class="toc-header-col1">';
tocTable += '<a href="javascript:toggleTitleSort();" title="' + tocTool1 + '">' + tocHead1 + '</a>';
tocTable += '</td>';
tocTable += '<td class="toc-header-col2">';
tocTable += '<a href="javascript:toggleDateSort();" title="' + tocTool2 + '">' + tocHead2 + '</a>';
tocTable += '</td>';
tocTable += '<td class="toc-header-col3">';
tocTable += '<a href="javascript:allPosts();" title="' + tocTool3 + '">' + tocHead3 + '</a>';
tocTable += '</td>';
tocTable += '<td class="toc-header-col4">';
tocTable += 'Download MP3';
tocTable += '</td>';
tocTable += '</tr>';
for (var i = 0; i < postTitle.length; i++) {
if (filter == '') {
tocTable += '<tr><td class="toc-entry-col1"><a href="' + postUrl[i] + '">' + postTitle[i] + '</a></td><td class="toc-entry-col2">' + postDate[i] + '</td><td class="toc-entry-col3">' + postLabels[i] + '</td><td class="toc-entry-col4">' + '<a href="' + postMp3[i] + '">' + 'Download' + '</a>' + '</td></tr>';
numDisplayed++
} else {
z = postLabels[i].lastIndexOf(filter);
if (z != -1) {
tocTable += '<tr><td class="toc-entry-col1"><a href="' + postUrl[i] + '">' + postTitle[i] + '</a></td><td class="toc-entry-col2">' + postDate[i] + '</td><td class="toc-entry-col3">' + postLabels[i] + '</td><td class="toc-entry-col4">' + '<a href="' + postMp3[i] + '">' + 'Download' + '</a>' + '</td></tr>';
numDisplayed++
}
}
}
tocTable += '</table>';
if (numDisplayed == postTitle.length) {
var tocNote = '<span class="toc-note">Menampilkan Semua ' + postTitle.length + ' Artikel<br/></span>'
} else {
var tocNote = '<span class="toc-note">Menampilkan ' + numDisplayed + ' artikel dengan kategori \'';
tocNote += postFilter + '\' dari ' + postTitle.length + ' Total Artikel<br/></span>'
}
var tocdiv = document.getElementById("toc");
tocdiv.innerHTML = tocNote + tocTable
}
function displayToc2() {
var j = 0;
var i = 0;
document.write('<div id="daftar-isi">');
while (i < postTitle.length) {
temp1 = postLabels[i];
document.write('<div class="sublabel">');
document.write('<div class="judul-label">' + temp1 + '</div>');
document.write('<div class="judul-list"><ol>');
firsti = j;
var tempposition = 'odd';
do {
if (tempposition == 'odd') {
document.write('<li class="data-list list-ganjil">');
tempposition = 'even'
} else {
document.write('<li class="data-list list-genap">');
tempposition = 'odd'
}
document.write('<a href="' + postUrl[j] + '">' + postTitle[j] + '</a>');
if (postBaru[j] == true) {
document.write(' - <strong><em><span style="color: rgb(255, 0, 0);">New !!</span> </em></strong>')
};
document.write('</li>');
j = j + 1
} while (postLabels[j] == temp1);
i = j;
document.write('</ol></div></div>');
sortPosts2(firsti, j);
if (i > postTitle.length) break
}
document.write('</div>')
}
function toggleTitleSort() {
if (sortBy == "titleasc") {
sortBy = "titledesc"
} else {
sortBy = "titleasc"
}
sortPosts(sortBy);
displayToc(postFilter)
}
function toggleDateSort() {
if (sortBy == "datenewest") {
sortBy = "dateoldest"
} else {
sortBy = "datenewest"
}
sortPosts(sortBy);
displayToc(postFilter)
}
function showToc() {
if (tocLoaded) {
displayToc(postFilter);
var toclink = document.getElementById("toclink")
} else {
alert("Just wait... TOC is loading")
}
}
function hideToc() {
var tocdiv = document.getElementById("toc");
tocdiv.innerHTML = '';
var toclink = document.getElementById("toclink");
toclink.innerHTML = '<a href="#" onclick="scroll(0,0); showToc(); Effect.toggle(' + "'toc-result','blind');" + '">¡í Menampilkan Daftar Isi</a> <img src="http://radiorodja.googlepages.com/new_1.gif"/>'
}
function looptemp2() {
for (var i = 0; i < numberfeed; i++) {
document.write('<br>');
document.write('Post Link    : ' + '<a href="' + postUrl[i] + '">' + postTitle[i] + '</a>' + '<br>');
document.write('Download mp3  : ' + '<a href="' + postMp3[i] + '">' + postTitle[i] + '</a>' + '<br>');
document.write('<br>')
}
}
//]]>
</script>
<script src="http://kartriderdautocrazy01.blogspot.com/feeds/posts/summary?max-results=1000&amp;alt=json-in-script&amp;callback=loadtoc">
</script>
<script type="text/javascript">
var accToc=true;
</script>
<script type='text/javascript'>
//<![CDATA[
eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('f $0=n.o();b g(){$0("#2-3 .1-5").p();$0("#2-3  .1-7").q("r","s");$0("#2-3 .1-5:h").t();$0("#2-3 .1-7:h").i("6");$0("#2-3 .1-7").u(b(){c(v){f a=$0(4).d();c((a.8(".1-5"))&&(a.8(":e"))){$0(4).d().j("9");$0(4).k("6");l m}c((a.8(".1-5"))&&(!a.8(":e"))){$0("#2-3  .1-5:e").w("9");$0("#2-3  .1-7").x("6");a.y("9");$0(4).i("6");l m}}z{$0(4).d().j("9");$0(4).k("6")}})}$0(A).B(b(){g()})',38,38,'jxToc|judul|daftar|isi|this|list|headactive|label|is|normal||function|if|next|visible|var|initAccToc|first|addClass|slideToggle|toggleClass|return|false|jQuery|noConflict|hide|css|cursor|pointer|show|click|accToc|slideUp|removeClass|slideDown|else|document|ready'.split('|'),0,{}))
//]]>
</script>
<style>
.judul-label{
background-color:#E5ECF9;
font-weight:bold;
line-height:1.4em;
margin-bottom:5px;
overflow:hidden;
white-space:nowrap;
vertical-align: baseline;
margin: 0 2px;
outline: none;
cursor: pointer;
text-decoration: none;
font: 14px/100% Arial, Helvetica, sans-serif;
padding: .5em 2em .55em;
text-shadow: 0 1px 1px rgba(0,0,0,.3);
-webkit-border-radius: .5em;
-moz-border-radius: .5em;
border-radius: .5em;
-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
-moz-box-shadow: 1px 1px 4px #AAAAAA;
box-shadow: 0 1px 2px rgba(0,0,0,.2);
color: #e9e9e9;
border: 2px solid white !important;
background: #6e6e6e;
background: -webkit-gradient(linear, left top, left bottom, from(#888), to(#575757));
background: -moz-linear-gradient(top,  #888,  #575757);
filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#888888', endColorstr='#575757');
}
.data-list{
line-height:1.5em;
margin-left:5px;
margin-right:5px;
padding-left:15px;
padding-right:5px;
white-space:nowrap;
text-align:left;
font-family:"Arial",sans-serif;
font-size:12px;
}
.list-ganjil{
background-color:#F6F6F6;
}
.headactive{
color: #fef4e9;
border: 2px solid white !important;
background: #1C8DFF;
background: -webkit-gradient(linear, left top, left bottom, from(#9dc2e7), to(#438cd2));
background: -moz-linear-gradient(top,  #9dc2e7,  #438cd2);
filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#9dc2e7', endColorstr='#438cd2');
}
</style>

Thay http://kartriderdautocrazy01.blogspot.com/ thành URL Blog của bạn
- max-results=1000 là số bài viết hiển thị.
Nhận xét

Không có nhận xét nào :