Cara Membuat Daftar Isi Blog (Sitemap) Berdasarkan Label/Kategori
April 12, 2014
Cara Membuat Daftar Isi Blog (Sitemap, Table of Content) Simple Fast Loading Berdasarkan Label/Kategori.
MEMBUAT daftar isi blog (peta situs, sitemap, table of content) berdasarkan label atau kategori posting sangat baik untuk mesin pencari juga user.
Menu daftar isi blog akan memudahkan pembaca mengakses bagian-bagian atau konten blog secara cepat dan mencari tulisana, artikel, atau posting yang mereka butuhkan.
Demo: Contoh Daftar Isi Blog
Menu navigasi daftar isi ini juga dianjurkan Google guna memudahkan user menjelajahi blog kita. Google memang "selalu berpihak" pada user. Apa yang disukai user, disukai pula oleh Google. Hidup user!!!! :)
Menu daftar isi blog akan memudahkan pembaca mengakses bagian-bagian atau konten blog secara cepat dan mencari tulisana, artikel, atau posting yang mereka butuhkan.
Demo: Contoh Daftar Isi Blog
Fungsi Daftar Isi Blog
Menurut Social Media Tutorial, daftar isi juga bagus untuk optimisasi mesin pencari (Good for SEO) karena menyajikan kata kunci yang benar yang sudah digunakan (provided correct keywords have been used).
Fungsi lainnya, terjemahin sendiri ya :)
NOTE!
Ganti alamat blognya (warna merah) dengan alamat blog Anda.
Kode Alternatif:
Itu dia Cara Membuat Daftar Isi Blog (Sitemap) Berdasarkan Label/Kategori.
Cara memasangnya:
1. Klik Halaman (Page) > klik Halaman Baru (New Page)
2. Isi judul dengan Daftar Isi atau Sitemap
3. Klik mode HTML
4. Copas kode berikut ini:
5. Ganti alamat blog https://contohblognih.blogspot.co.id/ dengan kepunyaan Anda.
5. Langsun Publikasikan! Jangan klik Compose! Awas! Langsung aja Publish!
Kini daftar isi blog Anda sudah muncul.
Selain sitemap daftar isi berdasarkan label (kategori) dan berdasarkan tanggal, masih banyak kode daftar isi di luar sana yang di-share oleh para blogger yang baik hati dan tidak sombong :)
Ada juga format daftar isi blog yang "interaktif" dan (mungkin) lebih menarik, seperti yang di-share oleh My Blogger Lab dan HiFiFan. Moggo... dipilih....!
Demikian Cara Membuat Daftar Isi Blog (Sitemap) Berdasarkan Label/Kategori plus-plus.
Good Luck & Happy Blogging! (www.contohblog.com).*
- Delivers a good overview of the information that awaits the reader
- Avoids duplicate posts in diverse labels and remove the bewilderment of search engine bots.
- Supports for creating internal links of blog posts, which boost up page rank
- It can be used as “Related posts” link, on any blog-post.
- Last, but not the least, to show a certain requirement of the blog posts to explore under Specific label.
Cara Membuat Daftar Isi Blog Simple Berdasarkan Label
- Klik menu "Page" (Halaman) di Dashboard Blog
- Klik New Page (Halaman Baru)
- Isi nama halaman dengan Sitemap, Peta Situs, atau Daftar Isi
- Klik tombol mode HTML
- Copy dan Paste kode daftar isi di bawah ini.
- Klik Publish!
Kode Daftar Isi Blog
Ini kode daftar isi yang CB gunakan untuk sitemap blog ini seperti bisa diilihat contohnya di halaman Sitemap.
Jangan lupa, paste di mode HTML. Klik dulu mode HTML, lalu copas kode, dan langsung publish! Jangan klik mode Compose ya!
Jangan lupa, paste di mode HTML. Klik dulu mode HTML, lalu copas kode, dan langsung publish! Jangan klik mode Compose ya!
Ini kodenya:
<style>
p.labels a{color: #242424; text-transform: uppercase;font-size: 15px;}
a.post-titles {color: #0000FF;}
.sitemap-link {display:none}
ol li{list-style-type:decimal;line-height:25px;}
</style>
<script type="text/javascript">//<![CDATA[ var postTitle=new Array();var postUrl=new Array();var postPublished=new Array();var postDate=new Array();var postLabels=new Array();var postRecent=new Array();var sortBy="titleasc";var tocLoaded=false;var numChars=250;var postFilter="";var numberfeed=0;function bloggersitemap(a){function b(){if("entry" in a.feed){var d=a.feed.entry.length;numberfeed=d;ii=0;for(var h=0;h<d;h++){var n=a.feed.entry[h];var e=n.title.$t;var m=n.published.$t.substring(0,10);var j;for(var g=0;g<n.link.length;g++){if(n.link[g].rel=="alternate"){j=n.link[g].href;break}}var o="";for(var g=0;g<n.link.length;g++){if(n.link[g].rel=="enclosure"){o=n.link[g].href;break}}var c="";if("category" in n){for(var g=0;g<n.category.length;g++){c=n.category[g].term;var f=c.lastIndexOf(";");if(f!=-1){c=c.substring(0,f)}postLabels[ii]=c;postTitle[ii]=e;postDate[ii]=m;postUrl[ii]=j;postPublished[ii]=o;if(h<10){postRecent[ii]=true}else{postRecent[ii]=false}ii=ii+1}}}}}b();sortBy="titleasc";sortPosts(sortBy);sortlabel();tocLoaded=true;displayToc2();document.write('</br><div class="sitemap-link"><a href="http://contohblognih.blogspot.com/2014/04/cara-membuat-daftar-isi-blog-sitemap.html" style="font-size: 10px; text-decoration:none; color: #5146CD;" target="_blank">Cara Membuat Daftar Isi Blog</a></div>')}function filterPosts(a){scroll(0,0);postFilter=a;displayToc(postFilter)}function allPosts(){sortlabel();postFilter="";displayToc(postFilter)}function sortPosts(d){function c(e,g){var f=postTitle[e];postTitle[e]=postTitle[g];postTitle[g]=f;var f=postDate[e];postDate[e]=postDate[g];postDate[g]=f;var f=postUrl[e];postUrl[e]=postUrl[g];postUrl[g]=f;var f=postLabels[e];postLabels[e]=postLabels[g];postLabels[g]=f;var f=postPublished[e];postPublished[e]=postPublished[g];postPublished[g]=f;var f=postRecent[e];postRecent[e]=postRecent[g];postRecent[g]=f}for(var b=0;b<postTitle.length-1;b++){for(var a=b+1;a<postTitle.length;a++){if(d=="titleasc"){if(postTitle[b]>postTitle[a]){c(b,a)}}if(d=="titledesc"){if(postTitle[b]<postTitle[a]){c(b,a)}}if(d=="dateoldest"){if(postDate[b]>postDate[a]){c(b,a)}}if(d=="datenewest"){if(postDate[b]<postDate[a]){c(b,a)}}if(d=="orderlabel"){if(postLabels[b]>postLabels[a]){c(b,a)}}}}}function sortlabel(){sortBy="orderlabel";sortPosts(sortBy);var a=0;var b=0;while(b<postTitle.length){temp1=postLabels[b];firsti=a;do{a=a+1}while(postLabels[a]==temp1);b=a;sortPosts2(firsti,a);if(b>postTitle.length){break}}}function sortPosts2(d,c){function e(f,h){var g=postTitle[f];postTitle[f]=postTitle[h];postTitle[h]=g;var g=postDate[f];postDate[f]=postDate[h];postDate[h]=g;var g=postUrl[f];postUrl[f]=postUrl[h];postUrl[h]=g;var g=postLabels[f];postLabels[f]=postLabels[h];postLabels[h]=g;var g=postPublished[f];postPublished[f]=postPublished[h];postPublished[h]=g;var g=postRecent[f];postRecent[f]=postRecent[h];postRecent[h]=g}for(var b=d;b<c-1;b++){for(var a=b+1;a<c;a++){if(postTitle[b]>postTitle[a]){e(b,a)}}}}function displayToc(a){var l=0;var h="";var e="Post Title";var m="Click to sort by title";var d="Date";var k="Click to sort by date";var c="Category";var j="";if(sortBy=="titleasc"){m+=" (descending)";k+=" (newest first)"}if(sortBy=="titledesc"){m+=" (ascending)";k+=" (newest first)"}if(sortBy=="dateoldest"){m+=" (ascending)";k+=" (newest first)"}if(sortBy=="datenewest"){m+=" (ascending)";k+=" (oldest first)"}if(postFilter!=""){j="Click to view all"}h+="<table>";h+="<tr>";h+='<td class="header1">';h+='<a href="javascript:toggleTitleSort();" title="'+m+'">'+e+"</a>";h+="</td>";h+='<td class="header2">';h+='<a href="javascript:toggleDateSort();" title="'+k+'">'+d+"</a>";h+="</td>";h+='<td class="header3">';h+='<a href="javascript:allPosts();" title="'+j+'">'+c+"</a>";h+="</td>";h+='<td class="header4">';h+="Read all";h+="</td>";h+="</tr>";for(var g=0;g<postTitle.length;g++){if(a==""){h+='<tr><td class="entry1"><a href="'+postUrl[g]+'">'+postTitle[g]+'</a></td><td class="entry2">'+postDate[g]+'</td><td class="entry3">'+postLabels[g]+'</td><td class="entry4"><a href="'+postPublished[g]+'">Read</a></td></tr>';l++}else{z=postLabels[g].lastIndexOf(a);if(z!=-1){h+='<tr><td class="entry1"><a href="'+postUrl[g]+'">'+postTitle[g]+'</a></td><td class="entry2">'+postDate[g]+'</td><td class="entry3">'+postLabels[g]+'</td><td class="entry4"><a href="'+postPublished[g]+'">Read</a></td></tr>';l++}}}h+="</table>";if(l==postTitle.length){var f='<span class="toc-note">Show All '+postTitle.length+" Posts<br/></span>"}else{var f='<span class="toc-note">Show '+l+" posts by category '";f+=postFilter+"' the "+postTitle.length+" Total Posts<br/></span>"}var b=document.getElementById("toc");b.innerHTML=f+h}function displayToc2(){var a=0;var b=0;while(b<postTitle.length){temp1=postLabels[b];document.write("<p/>");document.write('<p class="labels"><a href="/search/label/'+temp1+'">'+temp1+"</a></p><ol>");firsti=a;do{document.write("<li>");document.write('<a class="post-titles" href="'+postUrl[a]+'">'+postTitle[a]+"</a>");if(postRecent[a]==true){document.write(' - <strong><span style="color: rgb(255, 0, 0);">New!</span></strong>')}document.write("</li>");a=a+1}while(postLabels[a]==temp1);b=a;document.write("</ol>");sortPosts2(firsti,a);if(b>postTitle.length){break}}}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 a=document.getElementById("toclink")}else{alert("Just wait... TOC is loading")}}function hideToc(){var a=document.getElementById("toc");a.innerHTML="";var b=document.getElementById("toclink");b.innerHTML='<a href="#" onclick="scroll(0,0); showToc(); Effect.toggle(\'toc-result\',\'blind\');">?? Display Table of Contents</a> <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAluPMYg5uUmqlrOoEfJI2LMEA5w-df1314YzizGqqGENJS7Reqm3j8RUu-pqe3FxlvynWGsOk366wgTEV4I2fbpUZ-ov2ndTl0r9IipZ7KjqYCCTjwAUdkpF2juQO8v23vJxQooZpE-_Q/s1600/new_icon.gif"/>'}function looptemp2(){for(var a=0;a<numberfeed;a++){document.write("<br>");document.write('Post Link : <a href="'+postUrl[a]+'">'+postTitle[a]+"</a><br>");document.write('Read all : <a href="'+postPublished[a]+'">'+postTitle[a]+"</a><br>");document.write("<br>")}}; //]]>
</script>
<script src="https://contohblognih.blogspot.com/feeds/posts/default?max-results=9999&alt=json-in-script&callback=bloggersitemap"></script>
NOTE!
Ganti alamat blognya (warna merah) dengan alamat blog Anda.
Kode Alternatif:
<style>
p.labels a {color: #fff;text-transform: uppercase;font-size: 15px;font-weight: 600;border-bottom: 1px solid #ddd;display: block;padding: 8px;background: #555;}
a.post-titles {color: #0000FF;}
ol li{list-style-type:decimal;line-height:25px;}
.sitemap-link{display:none}
</style>
<script type="text/javascript">
//<![CDATA[ var postTitle=new Array();var postUrl=new Array();var postPublished=new Array();var postDate=new Array();var postLabels=new Array();var postRecent=new Array();var sortBy="titleasc";var tocLoaded=false;var numChars=250;var postFilter="";var numberfeed=0;function bloggersitemap(a){function b(){if("entry" in a.feed){var d=a.feed.entry.length;numberfeed=d;ii=0;for(var h=0;h<d;h++){var n=a.feed.entry[h];var e=n.title.$t;var m=n.published.$t.substring(0,10);var j;for(var g=0;g<n.link.length;g++){if(n.link[g].rel=="alternate"){j=n.link[g].href;break}}var o="";for(var g=0;g<n.link.length;g++){if(n.link[g].rel=="enclosure"){o=n.link[g].href;break}}var c="";if("category" in n){for(var g=0;g<n.category.length;g++){c=n.category[g].term;var f=c.lastIndexOf(";");if(f!=-1){c=c.substring(0,f)}postLabels[ii]=c;postTitle[ii]=e;postDate[ii]=m;postUrl[ii]=j;postPublished[ii]=o;if(h<10){postRecent[ii]=true}else{postRecent[ii]=false}ii=ii+1}}}}}b();sortBy="titleasc";sortPosts(sortBy);sortlabel();tocLoaded=true;displayToc2();document.write('</br><div class="sitemap-link"><a href="http://contohblognih.blogspot.com/2014/04/cara-membuat-daftar-isi-blog-sitemap.html" style="font-size: 10px; text-decoration:none; color: #5146CD;" target="_blank">Cara Membuat Daftar Isi Blog</a></div>')}function filterPosts(a){scroll(0,0);postFilter=a;displayToc(postFilter)}function allPosts(){sortlabel();postFilter="";displayToc(postFilter)}function sortPosts(d){function c(e,g){var f=postTitle[e];postTitle[e]=postTitle[g];postTitle[g]=f;var f=postDate[e];postDate[e]=postDate[g];postDate[g]=f;var f=postUrl[e];postUrl[e]=postUrl[g];postUrl[g]=f;var f=postLabels[e];postLabels[e]=postLabels[g];postLabels[g]=f;var f=postPublished[e];postPublished[e]=postPublished[g];postPublished[g]=f;var f=postRecent[e];postRecent[e]=postRecent[g];postRecent[g]=f}for(var b=0;b<postTitle.length-1;b++){for(var a=b+1;a<postTitle.length;a++){if(d=="titleasc"){if(postTitle[b]>postTitle[a]){c(b,a)}}if(d=="titledesc"){if(postTitle[b]<postTitle[a]){c(b,a)}}if(d=="dateoldest"){if(postDate[b]>postDate[a]){c(b,a)}}if(d=="datenewest"){if(postDate[b]<postDate[a]){c(b,a)}}if(d=="orderlabel"){if(postLabels[b]>postLabels[a]){c(b,a)}}}}}function sortlabel(){sortBy="orderlabel";sortPosts(sortBy);var a=0;var b=0;while(b<postTitle.length){temp1=postLabels[b];firsti=a;do{a=a+1}while(postLabels[a]==temp1);b=a;sortPosts2(firsti,a);if(b>postTitle.length){break}}}function sortPosts2(d,c){function e(f,h){var g=postTitle[f];postTitle[f]=postTitle[h];postTitle[h]=g;var g=postDate[f];postDate[f]=postDate[h];postDate[h]=g;var g=postUrl[f];postUrl[f]=postUrl[h];postUrl[h]=g;var g=postLabels[f];postLabels[f]=postLabels[h];postLabels[h]=g;var g=postPublished[f];postPublished[f]=postPublished[h];postPublished[h]=g;var g=postRecent[f];postRecent[f]=postRecent[h];postRecent[h]=g}for(var b=d;b<c-1;b++){for(var a=b+1;a<c;a++){if(postTitle[b]>postTitle[a]){e(b,a)}}}}function displayToc(a){var l=0;var h="";var e="Post Title";var m="Click to sort by title";var d="Date";var k="Click to sort by date";var c="Category";var j="";if(sortBy=="titleasc"){m+=" (descending)";k+=" (newest first)"}if(sortBy=="titledesc"){m+=" (ascending)";k+=" (newest first)"}if(sortBy=="dateoldest"){m+=" (ascending)";k+=" (newest first)"}if(sortBy=="datenewest"){m+=" (ascending)";k+=" (oldest first)"}if(postFilter!=""){j="Click to view all"}h+="<table>";h+="<tr>";h+='<td class="header1">';h+='<a href="javascript:toggleTitleSort();" title="'+m+'">'+e+"</a>";h+="</td>";h+='<td class="header2">';h+='<a href="javascript:toggleDateSort();" title="'+k+'">'+d+"</a>";h+="</td>";h+='<td class="header3">';h+='<a href="javascript:allPosts();" title="'+j+'">'+c+"</a>";h+="</td>";h+='<td class="header4">';h+="Read all";h+="</td>";h+="</tr>";for(var g=0;g<postTitle.length;g++){if(a==""){h+='<tr><td class="entry1"><a href="'+postUrl[g]+'">'+postTitle[g]+'</a></td><td class="entry2">'+postDate[g]+'</td><td class="entry3">'+postLabels[g]+'</td><td class="entry4"><a href="'+postPublished[g]+'">Read</a></td></tr>';l++}else{z=postLabels[g].lastIndexOf(a);if(z!=-1){h+='<tr><td class="entry1"><a href="'+postUrl[g]+'">'+postTitle[g]+'</a></td><td class="entry2">'+postDate[g]+'</td><td class="entry3">'+postLabels[g]+'</td><td class="entry4"><a href="'+postPublished[g]+'">Read</a></td></tr>';l++}}}h+="</table>";if(l==postTitle.length){var f='<span class="toc-note">Show All '+postTitle.length+" Posts<br/></span>"}else{var f='<span class="toc-note">Show '+l+" posts by category '";f+=postFilter+"' the "+postTitle.length+" Total Posts<br/></span>"}var b=document.getElementById("toc");b.innerHTML=f+h}function displayToc2(){var a=0;var b=0;while(b<postTitle.length){temp1=postLabels[b];document.write("<p/>");document.write('<p class="labels"><a href="/search/label/'+temp1+'">'+temp1+"</a></p><ol>");firsti=a;do{document.write("<li>");document.write('<a class="post-titles" href="'+postUrl[a]+'">'+postTitle[a]+"</a>");if(postRecent[a]==true){document.write(' - <strong><span style="color: rgb(255, 0, 0);">New!</span></strong>')}document.write("</li>");a=a+1}while(postLabels[a]==temp1);b=a;document.write("</ol>");sortPosts2(firsti,a);if(b>postTitle.length){break}}}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 a=document.getElementById("toclink")}else{alert("Just wait... TOC is loading")}}function hideToc(){var a=document.getElementById("toc");a.innerHTML="";var b=document.getElementById("toclink");b.innerHTML='<a href="#" onclick="scroll(0,0); showToc(); Effect.toggle(\'toc-result\',\'blind\');">?? Display Table of Contents</a> <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAluPMYg5uUmqlrOoEfJI2LMEA5w-df1314YzizGqqGENJS7Reqm3j8RUu-pqe3FxlvynWGsOk366wgTEV4I2fbpUZ-ov2ndTl0r9IipZ7KjqYCCTjwAUdkpF2juQO8v23vJxQooZpE-_Q/s1600/new_icon.gif"/>'}function looptemp2(){for(var a=0;a<numberfeed;a++){document.write("<br>");document.write('Post Link : <a href="'+postUrl[a]+'">'+postTitle[a]+"</a><br>");document.write('Read all : <a href="'+postPublished[a]+'">'+postTitle[a]+"</a><br>");document.write("<br>")}}; //]]>
</script>
<script src="/feeds/posts/default?max-results=9999&alt=json-in-script&callback=bloggersitemap"></script>
Itu dia Cara Membuat Daftar Isi Blog (Sitemap) Berdasarkan Label/Kategori.
Cara Membuat Daftar Isi Blog lainnya
Cara Membuat Daftar Isi Blog lainnya adalah berikut ini.Tampilannya seperti ini:Cara memasangnya:
1. Klik Halaman (Page) > klik Halaman Baru (New Page)
2. Isi judul dengan Daftar Isi atau Sitemap
3. Klik mode HTML
4. Copas kode berikut ini:
<style>
#show-cat{float:left;margin-right:20px;width:30%;height:auto;overflow-x:hidden;overflow-y:auto;line-height:15px}
#show-cat ul{margin:0;border-top:1px solid #ccc;padding:0}
#show-cat ul li{list-style-type:none;margin:0;border-right:1px solid #ccc;border-bottom:1px solid #ccc;border-left:1px solid #ccc;padding:0}
#show-cat ul li a{display:block;padding:10px} #show-cat ul li a,#navi-cat a{background:#fff;color:#d80556;text-decoration:none}
#show-cat ul li a,#navi-cat a,#navi-cat span{font-size:15px}
#show-cat ul li a:hover,#navi-cat a:hover{background:#ccc;color:#fff}
#show-post{float:left;width:65%}
#show-post ul li{list-style-type:none;padding-bottom:15px}
#navi-cat{padding:20px 0}
#navi-cat a{margin-right:10px;border:1px solid #ccc}
#navi-cat a,#navi-cat span{padding:5px 10px}
#navi-cat span{float:right}
</style>
<div id='show-cat'></div>
<div id='show-post'>
<script type='text/javaScript'> var cat_home='https://contohblognih.blogspot.co.id/';cat_numb=11;cat_pre='Prev';cat_nex='Next'; var cat_name;var cat_start;var cat_class; function show_post2(a){var tt=a.feed.openSearch$totalResults.$t;dw='';dw+='<ul>';for(var i=0;i<cat_numb&&i<a.feed.entry.length;i++){var entry=a.feed.entry[i];cat_title=entry.title.$t;for(var j=0;j<entry.link.length;j++){if(entry.link[j].rel=='alternate'){var cat_url=entry.link[j].href}}dw+='<li>';dw+=(cat_start+i)+'. <a href="'+cat_url+'" rel="nofollow" title="'+cat_title+'">'+cat_title+'</a>';dw+='</li>'}dw+='</ul>';dw+='<div id="navi-cat">';if(cat_start>1){dw+='<a href="" onclick="show_post(\''+cat_name+'\',\''+(cat_start-cat_numb)+'\',\''+cat_class+'\');return false" title="'+cat_pre+'">'+cat_pre+'</a>'}if((cat_start+cat_numb-1)<tt){dw+='<a href="" onclick="show_post(\''+cat_name+'\',\''+(cat_start+cat_numb)+'\',\''+cat_class+'\');return false" title="'+cat_nex+'">'+cat_nex+'</a>'}dw+='<span>'+cat_start;if(cat_start!=tt){dw+=' – '+(cat_start+i-1)}dw+=' / '+tt+'</span>';dw+='</div>';document.getElementById('show-post').innerHTML=dw+'<style type="text/css">.cat-'+cat_class+' a{background:#bbb!important;color:#fff!important}<\/style>'}function show_post(a,b,c){var d=document.getElementsByTagName('head')[0];e=document.createElement('script');e.type='text/javascript';e.setAttribute('src',cat_home+'/feeds/posts/default/-/'+a+'?alt=json-in-script&start-index='+b+'&max-results='+cat_numb+'&callback=show_post2');d.appendChild(e);cat_name=a;cat_start=parseInt(b),cat_class=c}function show_cat(a){var cat=a.feed.category;dw='';dw+='<ul>';for(var i=0;i<cat.length-1;i++){for(var j=i+1;j<cat.length;j++){if(cat[i].term>cat[j].term){cat_hv=cat[i].term;cat[i].term=cat[j].term;cat[j].term=cat_hv}}}for(var i=0;i<cat.length;i++){dw+='<li class="cat-'+i+'">';dw+='<a href="" onclick="show_post(\''+cat[i].term+'\',\'1\',\''+i+'\');return false" title="';dw+=cat[i].term;dw+='">';dw+=cat[i].term;dw+='</a>';dw+='</li>'}dw+='</ul>';document.getElementById('show-cat').innerHTML=dw}document.write('<script type="text/javascript" src="'+cat_home+'/feeds/posts/default?alt=json-in-script&max-results=0&callback=show_cat"><\/script>'); </script> </div>
<div style='clear:both'>
</div>
5. Langsun Publikasikan! Jangan klik Compose! Awas! Langsung aja Publish!
Kini daftar isi blog Anda sudah muncul.
Lihat juga: Cara Membuat Daftar Isi Blog (Sitemap) Tabulasi
TAMPILAN DAFTAR ISI BLOG TABULASI
Kode Daftar Isi Berdasarkan Tanggal Publikasi
Berikut ini kode daftar isi blog berdasarkan tanggal publikasi posting. Lihat Demo Daftar Isi plus Tanggal.
<style>
#w-sitemap-wrapper {font-size:13px}
#w-sitemap-wrapper li {position:relative;padding:.385em 0 .385em 6.923em;border-top:none;border-bottom:1px solid #f6f6f6}
#w-sitemap-wrapper span {position:absolute;left:0;color:#bd8b56}
#w-sitemap-wrapper a {font-weight:bold}
#w-sitemap-loading-msg {height:100px;line-height:100px;text-align:center;font-weight:bold;letter-spacing:1px;font-size:18px;color:#bbbbbb}
</style>
<script>
(function(c,m){var h=window;var l=document;var e="w-sitemap-wrapper";var g="w-sitemap-loading-msg";var b=h.location;var n=b.protocol;var f=b.hostname;var k=0;l.write("<div id='"+e+"'><ol></ol><div id='"+g+"'>"+m+"</div></div>");var a=l.getElementById(e);var d=l.getElementById(g);var j=l.getElementById(e).getElementsByTagName("ol")[0];function i(o){var p=l.createElement("script");p.src=n+"//"+f+"/feeds/posts/summary?alt=json-in-script&callback=wijs_get_sitemap&start-index="+o+"&max-results=150";a.appendChild(p)}h.wijs_get_sitemap=function(E){var A=E.feed.entry;var u=parseInt(E.feed.openSearch$totalResults.$t);var x=A.length;var w="";for(var s=0;s<x;s++){var o=A[s];var C=o.title.$t;var p;var D=o.link;var y=D.length;for(var r=0;r<y;r++){if(D[r].rel==="alternate"){p=D[r].href;break}}var z=o.published.$t;var q=z.substring(0,4);var t=z.substring(5,7);var v=z.substring(8,10);var B=c.replace("dd",v).replace("mm",t).replace("yyyy",q);w+="<li><span>"+B+"</span><a href='"+p+"'>"+C+"</a></li>"}j.innerHTML+=w;k+=x;if(k<u){i(k+1)}else{d.parentNode.removeChild(d)}};i(1)})("dd/mm/yyyy","Loading......");</script>
#w-sitemap-wrapper {font-size:13px}
#w-sitemap-wrapper li {position:relative;padding:.385em 0 .385em 6.923em;border-top:none;border-bottom:1px solid #f6f6f6}
#w-sitemap-wrapper span {position:absolute;left:0;color:#bd8b56}
#w-sitemap-wrapper a {font-weight:bold}
#w-sitemap-loading-msg {height:100px;line-height:100px;text-align:center;font-weight:bold;letter-spacing:1px;font-size:18px;color:#bbbbbb}
</style>
<script>
(function(c,m){var h=window;var l=document;var e="w-sitemap-wrapper";var g="w-sitemap-loading-msg";var b=h.location;var n=b.protocol;var f=b.hostname;var k=0;l.write("<div id='"+e+"'><ol></ol><div id='"+g+"'>"+m+"</div></div>");var a=l.getElementById(e);var d=l.getElementById(g);var j=l.getElementById(e).getElementsByTagName("ol")[0];function i(o){var p=l.createElement("script");p.src=n+"//"+f+"/feeds/posts/summary?alt=json-in-script&callback=wijs_get_sitemap&start-index="+o+"&max-results=150";a.appendChild(p)}h.wijs_get_sitemap=function(E){var A=E.feed.entry;var u=parseInt(E.feed.openSearch$totalResults.$t);var x=A.length;var w="";for(var s=0;s<x;s++){var o=A[s];var C=o.title.$t;var p;var D=o.link;var y=D.length;for(var r=0;r<y;r++){if(D[r].rel==="alternate"){p=D[r].href;break}}var z=o.published.$t;var q=z.substring(0,4);var t=z.substring(5,7);var v=z.substring(8,10);var B=c.replace("dd",v).replace("mm",t).replace("yyyy",q);w+="<li><span>"+B+"</span><a href='"+p+"'>"+C+"</a></li>"}j.innerHTML+=w;k+=x;if(k<u){i(k+1)}else{d.parentNode.removeChild(d)}};i(1)})("dd/mm/yyyy","Loading......");</script>
Selain sitemap daftar isi berdasarkan label (kategori) dan berdasarkan tanggal, masih banyak kode daftar isi di luar sana yang di-share oleh para blogger yang baik hati dan tidak sombong :)
Ada juga format daftar isi blog yang "interaktif" dan (mungkin) lebih menarik, seperti yang di-share oleh My Blogger Lab dan HiFiFan. Moggo... dipilih....!
Demikian Cara Membuat Daftar Isi Blog (Sitemap) Berdasarkan Label/Kategori plus-plus.
Good Luck & Happy Blogging! (www.contohblog.com).*
Previous
« Prev Post
« Prev Post
Next
Next Post »
Next Post »
terima kasih infonya, saya dah pasang nih sitemap
ReplyDeletesiiip..... goog luck........
Deletetapi kok saya coba ga bs ya.. itu kode no 1 sama no 2 di gabung atau gimana sih bos...
ReplyDeletepilih satu kode aja.....ubah dulu alamat url nya....
Deletesaya sudah ubah alamat url nya tapi tetap tidak bisa. pls advised. thx
ReplyDeleteKlik "New Page" > klik tombol Mode "HTML" (JANGAN "Compose"), paste kodenya, dan PUBLISH! Good luck......!
Deletesaya sudah praktikkan koo gak muncul d blognya, padahal udah ganti URL dan versi HTML
Deletethank's gan mantap...
ReplyDeleteSaya sudah praktekkan gan. thank's
ReplyDeletekok gak muncul ya mbak, masalahnya apa, saya udah pastekan di html, masih gak bisa. mohon pencerahanya
ReplyDeletepaste di Mode HTML.... CB cek malah "The requested URL / was not found on this server. That’s all we know" tuh blognya :)
DeleteSukses gan, makasih ya atas tutorialnya :)
ReplyDeleteGan, gmn cara membuat link seperti di blog ini? makasih banyak bantuannya.
ReplyDeleteLink yang mana.....?
DeleteCara Membuat Daftar isi Blog Keren dan Cantik memang menjadi keinginan para blogger ya sob, hal itu sebagai salah satu penarik pengunjung. oya terima kasih atas artikel yang bermanfaat ini, Salam hangat
ReplyDeleteSepakat...! Salam hangat kembali :)
DeleteExcellent Post thanks a lot man You can Also Visit my Blog and See the Sitemap http://www.gobloggertricks.com/p/sitemap.html
ReplyDeleteterima kasih banyak sangat keren yang kode kedua bang langsung saya pasang di blog hehe
ReplyDeletejangan lupa kunbalnya ya arifinbp.blogspot.com
simple, jadi gk berat-beratin blog :D
ReplyDeletemakasih (y)
Keren mas tips triknya..dlu juga saya pake kode html sitemap ini tp blognya lupa password jd gbsa dibuka hehe...
ReplyDeletenice info :) thanks
makasih infonya mas, tapi saya punya masalah, dengan halaman pagenya bukan /p/dafta-isi.html tapi /p/blog-page_47.html cara ubahnya bagaimana mas? ditunggu balasannya
ReplyDeletehttp://areakostnetwork.blogspot.com/p/blog-page_47.html
Bikin baru aja, hapus yang itu, begitu klik New Page, langsung isi judul halamannya dgn "Daftar Isi" atau "Sitemap"
DeleteYap.. Bener mas. Buat judulnya terlebih dahulu, jangan langsung nulis dikolom tulisan. Ini permasalahan diwaktu saya masih newbie dulu sih. *sekarang masih newbie.
Deletesaya mau tanya mas, kenapa laman saya kok tidak mau muncul ya ? padahal sudah saya isi seperti cara yang ada di atas,
ReplyDeletemohon bantuannya
www.cakarlele.com
URL-nya ganti dengan url cakarlele....
DeleteHahahaa sejak kapan lele punya cakar, yang ada mah kumis :(
Deletesilakan........ :)
ReplyDeletethank gan infonya,
ReplyDeletekunjungi juga blog ane :D berbagi ilmu
mantab gan. langsung diterapkan
ReplyDeleteyang alternatif, mantaaaappp gann... cek dah di blog ane...
ReplyDeletemakasih gan :D
Terima Kasih atas tutorialnya CB Blogger,
ReplyDeleteSitemap sudah berhasil saya pasang di blog saya
akhirnya ini yang saya cari-cari ketemu juga :D , makasih sudah mengasih tahu tutorialnya
ReplyDeleteMantep gan artikelnya ... Makasih share ilmunya
ReplyDeletemakasih banget mas, keren abis yang cara 1, saya ijin modifikasi yah mas, karena mau cocokin sama tampilan blog saya.... :)
ReplyDeletemaklum newbie, jadi masih fokus tampilan dlu... hehehe
Jangan terlalu banyak menghabiskan waktu hanya untuk menyetel tampilan blog mas. Waktu yang berharga terbuang sia-sia.
DeleteSolusinya... Sering-sering baca dan pahami dulu tutorial tentang bagaimana tampilan blog yang baik dan benar. Sekiranya sudah paham, baru deh dicoba dan diterapkan pada tampilan blog. Otomatis dengan pengetahuan yang kita pahami tadi, waktu untuk menyetel tampilan lebih cepat. (Memasang dan Menyetel Ulang Tampilan Template Blog Sangat Menguras Waktu).
Pesan khusus... Cari template blogger yang memang udah nyatu dihati, sehingga dikemudian hari tidak mengganti-ganti template lagi. Bahaya loh ganti template terus-terusan. Dampaknya ke trafik pengunjung.
Nah, jika template yang diganti tersebut memang lebih SEO, silahkan diganti saja. Awalnya trafik down (jatuh), itu wajar. Dikemudian hari, pengunjung blog semakin meningkat.
Nah... Yang paling utama sih konten yang berkualitas. Jadi usahakan waktu yang berharga tersebut untuk membuat konten (artikel).
Thanks! CB: Jika ada kesalahan kalimat, tolong diperbaiki :D
min cara buat url kyk gmn http://contohblognih.blogspot.com/p/disclaimer.html gmn yak? maaf newbie :)
ReplyDeletesama seperti buat daftar isi, di laman page baru, lalu buat judul disclaimer atau ketentuan layanan, isinya menjelaskan ketentuan blog agan. jgn lupa kunjungannya http://areakostnetwork.blogspot.com
DeleteSukses besar!
ReplyDeleteJadi semakin tertata deh blog ane....
Mas Kalo berdasarkan 1 label aja gimana mas ?
ReplyDeleteUbah... /feeds/posts/default?max.... menjadi ..../feeds/posts/-/Label?max....
DeleteWah ilmu yang sangat bermanfaat bagi Newbe Pemula seperti Saya ini gan. ijin Copas Gan.. :)
ReplyDeleteJangan copas, nanti dibanned sama google... :)
Deletesukses terus contohblognih saya banyak belajar dari sini untuk membuat blog saya menarik, mohon review blog saya ya sob, bagaimana komentarnya, karena saya butuh masukan, saya masih pemula :)
ReplyDeletegan '' menu page '' nya itu lokasinya dmana ??
ReplyDeletebiasanya di "nav" atau "navigasi", deretan "Home", "About", dll. Cari *Ctrl+F) di "Template" > "Edit HTML"
Deletekeren benar tampilannya. mksh atas tutornya !
ReplyDeletecara nentuin daftarnya misal blogging apa aja gmn ya gan?
ReplyDeleteUdah saya coba, cara ngeliatnya gimana ya? kok ga keliatan isi sitemap nya?
ReplyDeleteAnda pake wordpress, cara membuat daftar isi (sitemap) ini buat blogspot....
DeleteKalo tips buat wordpress ada ga ya?
ReplyDeleteAda, silakan cek:
Deletehttp://en.support.wordpress.com/archives-shortcode/#customization
Makasih banget Tutor nya >_< Keren bgt dan pas buat blog aku
ReplyDeleteLope-Lope deh :*
keren mas
ReplyDeleteterima kasih sekali, sangat membantu
ReplyDeleteBagus. Bisa dicoba.
ReplyDeleteTerima kasih gan
admin cb blogger, cara buat kotak komentar yg warna warni itu gimana cara buatnya?
ReplyDeleteterus bisa juga utk dijadikan top artikel yg warna-warni spt itu jga?
itu scriptnya dipasang dimana mas?
ReplyDeletesilakan dibaca lagi tulisannya :)
Deleteizin share gan
ReplyDeletegan,kalo mau buat daftar isi menurut abjad bagaimana utk style yg 1?
ReplyDeletehttp://contohblognih.blogspot.com/2015/01/Daftar-Isi-Sitemap-Blog-Tabulasi.html
Deletegan, kok gue coba, malah, letaknya bukan di arsip, tp malah di postingan! gmn dong? apa gue ada yg salah ya?
ReplyDeleteJika agan bikin sebagai postingan seperti artikel blog iyalah keluarnya di postingan, coba agan klik di laman, kemudian klik laman baru, masukan judulnya, dan klik edit HTML disampingnya, ini contoh daftar isi saya
Deletehttp://areakostnetwork.blogspot.com/p/daftar-isi.html
mas umraici ,tolong minta kodenya. soalnya kode diatas tak coba gak ada yang bisa.cuma muncul judul daftar isi aja, isinya gak ada.terimakasih
Deletejika berkenan tolong kirim ke punakawanarif@gmail.com
gan mau nanya....
ReplyDeletekalau buat sitemap nya untuk 1 label aja bisa ga gan ?
Wow keren, kalau mau cuma satu label bagaimana yah? untk satu label dan bisa terlihat semua postingan dalam satu label itu? maaf masih baru, mohon bantuannya...
ReplyDeleteSangat Bermanfaat :)
ReplyDeleteyang ane udah tampil gan (label sama postingan), cuman nomornya yang ga tampil, itu gimana ya gan?
ReplyDeletekode "ol" di dalam templatenya bermasalah alias belum disetting
Deletemalam gan..
ReplyDeletegan,mau tnya ne : cara buat katalog seperti di atas gimana ya
contoh nya : Home, tips seo, templates, desain, posting tips,adsense dsb yang seperti diatas gimana ya.
maklum masih newbie :)
http://contohblognih.blogspot.com/2014/12/Membuat-Menampilkan-Halaman-Statis-Blog-Navigasi-Menu.html
DeleteUntuk Kode HTML site map di antara ke3 tsb kira" yg terbaik untuk/menurut "GOOGLE" yg mana ya mas Bro ??
ReplyDeleteTrims
yang pertama, yg lebih simple...........
DeleteSippp dah Mas Bro.. Thanks infonya
Deleteitu biar sesuai abjad gmna ya ?
ReplyDeleteIntuk daftar isi alfabetis, coba kode yang ada di sini:
Deletehttp://mybloggercontrol.blogspot.com/2012/11/list-posts-in-alphabetical-order.html
http://contohblognih.blogspot.com/2015/07/daftar-isi-blog-berdasarkan-abjad.html
DeleteTerima kasih..blog CB banyak bantu saya dari segi template dan seo ya..
ReplyDeleteLupa..saya dari malaysia tapi banyak belajar dari blog CB..
Terima kasih ya...
You are welcome... :)
Deletewah hasilnya bagus banget, saya pakai yang no.2 makasih banyak...
ReplyDeletehasilnya lebih rapih master thank you Owner CB :)
ReplyDeletegan, maaf .. kok ga bisa .. ?
ReplyDeletenanya lagi min, kalo cuman nampilin daftar satu label aja bisa ga?
ReplyDeletesoalnya label punya ane banyak dan isinya banyak pula.
ane sendiri pegel scroll bawah mulu.
bisa aja pake yang tabulasi tapi loadingnya sedikit lebih lama dari pada yang simple ini.
terima kasih sebelumnya :)
terimah kasih ya atas artikelnya
ReplyDeleteKeren Bos, thanks tutorialnya
ReplyDeleteMantep gan, makasih nih tutornya lengkap banget
ReplyDeleteLangsung Paraktek dah
saya comot yang pertama aja gan
ReplyDeletemakasih mas, saya coba ya
ReplyDeleteTerimakasih mas....ijin nyobi
ReplyDeleteMakasih infonya gan...ijin praktek
ReplyDeleteMaksih infonya gan...ane coba dulu neh...
ReplyDeleteMakasih Mas tutorial cara buat sitemapnya
ReplyDeleteLebih bagus ni, makasih min sudah ane pasang di blog ane. Mantep tampilannya.
ReplyDeleteTerima kasih admin contohblog.com, template sitemap ini kami gunakan di blog kami pajakita.net
ReplyDeletekalau kita membuat sitemap, dan kita pasang di homepage apa tidak berpengaruh dengan duplikat link pada postingan gan?
ReplyDeleteMantap banget bos ...
ReplyDeleteSangat membantu saya artikel ini, khususnya untuk pembuatan daftar isi di blog
hasilnya bagus alhamdulillah,
ReplyDeleteAda di tips lainnya, silakan ketik sitemap di kotak pencarian
ReplyDeleteBerhasil gan... hatur nuhun
ReplyDeleteMantap gan,, shankyou...
ReplyDeleteMakasih gan infonya menarik banget nih. Salam kenal dari newbie
ReplyDeleteGan Semua JS yang Sumbernya Dari google code atau host google kok di ane gak tampil ya, ada backup Script JS nya gak ya, Soalnya kalo sumber Js nya dari tempat lain bisa muncul
ReplyDeletegoogle code sudah OFF, jangan pake kode yang ngelink ke Google Code
Deletehttp://www.contohblog.com/2016/08/pengaruh-google-code-dihentikan-pada-blogger.html
Sitemap saya yg dulu dari CB sudah tidak berjalan dan kembali kesini cari yg baru dan ada ,terima kasih salam bos
ReplyDeletemantap banyak pilihan. dari beberapa ssitemap gak berhasil akhirnya disini ada yg berhasil hehe
ReplyDeletevenomku dot com
mas saya sudah coba praktek semua cara membuat sitemap di blog saya yg beralamatkan xxxx.blogspot.co.id baik yang js nya dari google code atau yang lainnya, saya sudah praktekan dengan membuat page baru dan pilih html code dan pastekan kodenya.tapi sitemap saya tetap tidak muncul, page/halamannya kosong blong. kenapa ya mas
ReplyDeleteGoogle Code sudah ditutup Google
DeleteCoba gunakan file js ini editan ane sendiri. Demonya ada di blog ane areakost.net
Deletehttps://rawgit.com/umraici/sitemap/master/sitemap.js
yg nomor 1 masih work sob. ane baru pasang
Deletekode no 1 masih work tapi kode no 2 ngga work om. mkasih om. ane pake yg no 1 ajj :)
ReplyDeleteterimakasih mas buat tutorial yang ini, saya udah bisa buat daftar isinya.
ReplyDeletemohon maaf mw tanya, di bawah setelah daftar isi masih ada link "Cara Membuat daftar Isi", Itu Wajib ada ato boleh menghapusnya.
klo boleh ngapus gmna caranya...
Terimakasih
Tambahkan kode berikut ini di bagian bawah:
Delete<style>
.sitemap-link{display:none}
</style>
makasih banayak gan...
DeleteOh ternyata boleh dihapus ya mas, thanks infonya.
ReplyDeletemakasih gan tutorialnya, blog saya sudah mempunyai daftar isi
ReplyDeletegan mau nanya tutorial di atas udah saya praktekin tapi kok gk muncul secara otomatis ya gan ?
ReplyDeletemaksih gan,langsung saya pakai..dan jreeeeng sudah muncul..
ReplyDeletegan, cara supaya artikel bisa berdiri sendiri di template yang sudah ada menubar(bawaan dari sono) gimana ya ?,
ReplyDeleteMantab agan boss CB..work di blog saya makasih tips nya keren..
ReplyDeletemohon bantuannya.. saya udh pilih alternatif yang no 1, tapi hasilnya error, setelah kode "http" saya gnti menjadi "https" ada perubahan, tapi "blank" tidak ada daftar isi yang muncul. knpa ya?
ReplyDeletemas untuk daftar isi berdasarkan tanggal postingan, tolong scriptnya di upload di yourjavascript [dot] com, soalnya kalo selain di script yg di upload di yourjavascript hasilnya jadinya 'blank' mas gak muncul apa2. makasih sebelumnya
ReplyDeletetrims gan izin parkatekkan di blog ana, sangat bermanfaat sekali
ReplyDeletekok saya gak bisa?
ReplyDeleteudah di mode html padahal
Kok dibagian bawah pasti keluar link orang ,biar hilang bagaimana ?
ReplyDeleteHelp gan punya ane, kagak bisa muncul sitemapnya. Kodenya udh ane copas di mode html. pas mau publish muncul tulisan ini
ReplyDelete"Terjadi kesalahan saat mencoba menyimpan atau memublikasikan postingan Anda. Coba lagi. Tutup
Laman ini berisi sumber daya HTTP yang dapat menyebabkan konten campuran memengaruhi keamanan dan pengahalaman pengguna jika blog
dilihat melalui HTTPS.
Perbaiki Tutup Info lengkap
"
Fast respon gan.
Terimakazih Aa
ReplyDeletethanks
ReplyDelete"Terjadi kesalahan saat mencoba menyimpan atau memublikasikan postingan Anda. Coba lagi. Tutup
ReplyDeleteLaman ini berisi sumber daya HTTP yang dapat menyebabkan konten campuran memengaruhi keamanan dan pengahalaman pengguna jika blog
dilihat melalui HTTPS.
Perbaiki Tutup Info lengkap
ijin sruput gan..top.work di template blog saya
ReplyDeletegan apa sitemap di blog berbeda dengan sitemap di webmaster..?
ReplyDeleteBeda kode. Tips di atas untuk membuat sitemap halana daftar isi (table of content). Isinya sih sama dengan sitemap di Webmaster, cuma beda kode doang
Deleteterimakasih atas tipsnya sudah saya coba dan ternyata worked, mudah untuk diikuti terutama bagi blogger pemula seperti saya, tapi ada yang mau saya tanyakan mas, kan sitemap nya sudah jadi yah tapi ko saya mau masukkan ke navigasi header saya gak bisa ya? walaupun linknya sudah diinput tetap pas kolom sitemapnya di klik tampilannya kosong, itu harus dibagaimanakan ya?? terimakasih
ReplyDeleteJika masih menggunakan blogspot, coba ubah alamat blognya dalam kode di atas dari http menjadi https (tambah s)
Deleteterimakasih mas, worked dan tampilan blog saya jadi keren :D, kemarin ini saya salah buat sitemap nya di postingan bukan dihalaman, ternyata pas dipindah ke halaman langsung worked, semoga sukses terus, kalo sompet mampir2 ya mas ke blog saya, makasih :)
DeleteSitemap nya gk muncul di blog ku yang kedua tapi muncul di blog pertama dan itu code scriptnya sdh bnr. Penyebabnya ini karena apa?
ReplyDeletekagak bisa kang, saya coba gagal trus
ReplyDeleteGan gimana cara nya buat label nya terbalik...
ReplyDeletecontoh
10
9
8
7
bukan
1
2
3
Pengen coba juga
DeleteOra usah neko-neko mas, jangan bikin susah :)
DeleteCara merubah icon NEW!! Gimana ya Mas?
ReplyDeleteCari kode NEW! dan ganti dengan kata lain yang dikehendaki
Deletethanks
ReplyDeletepunyaku gak bisa keluar terus gan.... blog mediapii.my.id
ReplyDeletekok ndak bisa ya bang
ReplyDelete