Sitemap atau biasa disebut dengan daftar isi sering digunakan oleh website atau blog agar pembaca bisa lebih mudah dalam mencari artikel di dalam website/blog tersebut. Mungkin sudah banyak para bloger yg menyajikan cara membuat sitemap diblog, tak ada salahnya saya juga menambahkan artikel tentang cara membuat sitemap tapi dengan tampilan yg agak berbeda.
Langsung saja bagaimana caranya simak baik2 tulisan saya:
Pertama pilih laman baru dan copykan kode dibawah ini:
<div style="-moz-border-radius: 7px 7px 7px 7px; background-color: white; border: 1px solid rgb(33, 33, 33); height: auto; margin: 0px;overflow: auto; padding: 10px; text-align: justify; width: auto;" ><div id="cl_option">Loading.... </div><div id="cl_content_list"></div><script type="text/javascript">
var jumlah_kata_dalam_ringkasan = 500;
var cl_summlen = jumlah_kata_dalam_ringkasan;
var all_entries; var entries; var all_labels = []; var json;
function createEntries(json){
var entries_obj_list = [];
var entries = json.feed.entry;
for(var i=0; i<entries.length; i++){
var entry = entries[i];
var entry_obj = new Object;
entry_obj.id = entry.id.$t;
entry_obj.title = entry.title.$t;
entry_obj.href = getEntryHref(entry);
entry_obj.content = getEntryContent(entry);
entry_obj.labels = getEntryLabels(entry);
entry_obj.published = entry.published.$t.substr(0, 10);
entries_obj_list.push(entry_obj);
}
return entries_obj_list;
}
function getEntryById(id){
for(var i=0; i<all_entries.length; i++){
if(all_entries[i].id == id){return all_entries[i];}
} return null;
}
function getEntryContent(entry){
return entry.content ? entry.content.$t : entry.summary.$t;
}
function getEntryHref(entry){
var links = entry.link;
for(var i=0; i<links.length; i++){
if(links[i].rel == "alternate"){return links[i].href;}
}
return null;
}
function getEntryLabels(entry){
var labels = [];
var categories = entry.category;
if(!categories){return labels;}
for(var i=0; i<categories.length; i++){
var label = categories[i].term;
if(!isExists(all_labels, label)){all_labels.push(label);} // while collecting all labels
labels.push(label);
}
return labels;
}
function getSomeEntries(cmp){
entries = [];
for(var i=0; i<all_entries.length; i++){
var entry = all_entries[i];
if(cmp(entry)){entries.push(entry);}
}
return entries;
}
function isExists(array, val){
for(var i=0; i<array.length; i++){
if(array[i] == val){return true;}
} return false;
}
function onLoadFeed(json_arg){
json = json_arg;
setTimeout("onLoadFeedTimeout()", 100);
}
function onLoadFeedTimeout(){
entries = createEntries(json);
all_entries = entries;
showHeaderOption();
showEntries(entries);
}
function showEntries(entries){
var s = "";
for(var i=0; i<entries.length; i++){
var entry = entries[i];
s += "<br/>";
s += titleCode(entry);
s += "<span style='font-size:90%'>Label: " + labelsCode(entry);
s += " on " + publishedDateCode(entry) + "</span>";
s += "<br/>";
}
document.getElementById("cl_content_list").innerHTML = s;
}
function showHeaderOption(){
var s = "";
s += "<table>";
s += "<tr>";
s += "<td style='text-align:left'>Urut Berdasarkan ";
s += "<td><select onchange='sortBy(this.value.substr(1), this.value.substr(0,1))'>";
s += "<option value='0published'/>Tanggal Publikasi";
s += "<option value='1title'/>Judul Posting";
s += "</select>";
s += "<tr>";
s += "<td style='text-align:left'>Pilihan Kategori ";
s += "<td><select onchange='showPostsWLabel(this.value)' id='cl_labels'>";
s += "<option value='*'/>Semua Kategori ";
for(var i=0; i<all_labels.length; i++){
var label = all_labels[i];
s += "<option value='"+label+"'/>" + label;
}
s += "</select>";
s += "</table>";
document.getElementById("cl_option").innerHTML = s;
}
function shortenContent(entry){
var content = entry.content;
content = stripHTML(content);
if(content.length > cl_summlen){
content = content.substr(0, cl_summlen);
if(content.charAt(content.length-1) != " "){content = content.substr(0, content.lastIndexOf(" ")+1);}
content += "...";
}
entry.content = content;
return content;
}
function showHideSummary(obj){
var p = obj.nextSibling;
while(p.className != "cl_content"){p = p.nextSibling;}
var id = p.id;
var entry = getEntryById(id);
var content = shortenContent(entry);
if(p.innerHTML == ""){
p.innerHTML = content + "<br/>";
obj.innerHTML = "▼";
obj.title = "Sembunyikan Ringkasan";
} else {
p.innerHTML = "";
obj.innerHTML = "►";
obj.title = "Tampilkan Ringkasan";
}
}
function sortBy(attribute, asc){
var cmp = function(entry1, entry2){
if(entry1[attribute] == entry2[attribute]){return 0;}
else if(asc=='1'){return entry1[attribute].toLowerCase() > entry2[attribute].toLowerCase();}
else{return entry1[attribute].toLowerCase() < entry2[attribute].toLowerCase();}
}
entries.sort(cmp);
showEntries(entries);
}
function stripHTML(s) {
var c;
var intag = false; var newstr = "";
for(var i=0; i<s.length; i++){
c = s.charAt(i);
if(c=="<"){intag = true;}
else if(c==">"){intag = false;}
if(c == ">"){newstr += " ";}
else if(!intag){newstr += c;}
}
return newstr;
}
function labelsCode(entry){
var s = "";
if(entry.labels.length == 0){return " (tidak berlabel) ";}
for(var j=0; j<entry.labels.length; j++){
var label = entry.labels[j];
s += "<a href='javascript:showPostsWLabel(\""+label+"\")' ";
s += "title='See post with label \""+label+"\"'>" + label + "</a>";
s += (j != entry.labels.length-1) ? ", " : "";
}
return s;
}
function publishedDateCode(entry){
var y = entry.published.substr(0, 4);
var m = entry.published.substr(5, 2);
var d = entry.published.substr(8, 2);
var s = "<a href='javascript:showPostsInDate(\""+y+"\")' title='See all post on "+y+"'>" + y + "</a>/";
s += "<a href='javascript:showPostsInDate(\""+y+"-"+m+"\")' title='See all post on "+y+"/"+m+"'>" + m + "</a>/";
s += "<a href='javascript:showPostsInDate(\""+y+"-"+m+"-"+d+"\")'title='See all post on "+y+"/"+m+"/"+d+"'>" + d + "</a>";
return s;
}
function titleCode(entry){
var s = "<span title='Tampilkan Ringkasan' onclick='showHideSummary(this)' style='cursor:pointer'>►</span> ";
s += "<b><a href='"+entry.href+"'>" + entry.title + "</a></b> <br/>";
s += "<span class='cl_content' id='"+entry.id+"'></span>";
return s;
}
function showPostsInDate(date){
var cmp = function(entry){return entry.published.indexOf(date) == 0;}
var entries = getSomeEntries(cmp);
showEntries(entries);
}
function showPostsWLabel(label){
var cmp = function(entry){
if(label == "*"){return true;}
for(var i=0; i<entry.labels.length; i++){
if(entry.labels[i] == label){return true;}
}
return false;
}
var entries = getSomeEntries(cmp);
showEntries(entries);
document.getElementById("cl_labels").value = label;
}
</script>
<script src="http://daftarhargaterkini.blogspot.com/feeds/posts/default?alt=json-in-script&callback=onLoadFeed&max-results=9999"></script></div>
<a href="http://daftarhargaterkini.blogspot.com/2012/03/tutorial-blog-membuat-sitemap-blog.html" target="_blank">Cara buat sitemap ini</a>
Ganti tulisan yg berwarna merah http://daftarhargaterkini.blogspot.com dengan nama blog sobat. Sekarang sobat sudah punya sitemap baru diblognya.Selamat ya...hehe.
Untuk contohnya bisa anda lihat disini
|
|
kudil
|
|
0 komentar:
Posting Komentar