Latest

How to Create HTML Sitemap Page for Blogger

When a blog site is maintained, it adds a number of posts to it.Over time, a lot of posts are added.So it's important if you bring all the articles into one page.Therefore, this sitemap is important for your site audience.This is important for a new person to your site looking for all the articles at once.You know about how to submit XML sitemap to Google Search Console. But that sitemap is for those crawlers to update about your blog on search engines. Here, we will guide you to make a simple sitemap page (a HTML page) for your blogger blog, which lists all your published posts according to your Labels.
Create HTML Sitemap Page for Blogger
How to Create HTML Sitemap Page for Blogger
You can enter all your articles for this sitemap page.At the same time, you do not need to update it again and again.Once you publish a new article on the blog, it is on that page.So you can maintain that page without any trouble.Even if someone new comes to your site, your old article can easily be found.And because of the code that we provide, the article has a different look, depending on the label given to you.If so, let's see how this is done for your site.

Creating a HTML Sitemap Page for a Blogger


1. First, go to blogger.com and go to your Dashboard.


2.The next step is to go to the pages tab and click New Page.
How to Create HTML Sitemap Page for Blogger

3. On the Page Title, Just name it as Sitemap which would make you a page like example.com/p/sitemap.html.One important step is, click on the Options on right side of the page and select Do not allow Comments option (It looks like a professional sitemap page if comments are disabled).
How to Create HTML Sitemap Page for Blogger

4.Click on HTML Editor (by default, it would be on Compose mode) and remove all the codes if present.Then copy the following code here & pase code.

<style>p.labels a{color:#08f;text-transform:uppercase;font-size:15px}a.post-titles{color:#08f}ol li{list-style-type:decimal;line-height:25px}</style><script>/*<![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(d){function c(){if("entry" in d.feed){var s=d.feed.entry.length;numberfeed=s;ii=0;for(var l=0;l<s;l++){var b=d.feed.entry[l];var r=b.title.$t;var i=b.published.$t.substring(0,10);var k;for(var p=0;p<b.link.length;p++){if(b.link[p].rel=="alternate"){k=b.link[p].href;break}}var a="";for(var p=0;p<b.link.length;p++){if(b.link[p].rel=="enclosure"){a=b.link[p].href;break}}var t="";if("category" in b){for(var p=0;p<b.category.length;p++){t=b.category[p].term;var q=t.lastIndexOf(";");if(q!=-1){t=t.substring(0,q)}postLabels[ii]=t;postTitle[ii]=r;postDate[ii]=i;postUrl[ii]=k;postPublished[ii]=a;if(l<10){postRecent[ii]=true}else{postRecent[ii]=false}ii=ii+1}}}}}c();sortBy="titleasc";sortPosts(sortBy);sortlabel();tocLoaded=true;displayToc2();document.write}function filterPosts(b){scroll(0,0);postFilter=b;displayToc(postFilter)}function allPosts(){sortlabel();postFilter="";displayToc(postFilter)}function sortPosts(g){function h(c,a){var b=postTitle[c];postTitle[c]=postTitle[a];postTitle[a]=b;var b=postDate[c];postDate[c]=postDate[a];postDate[a]=b;var b=postUrl[c];postUrl[c]=postUrl[a];postUrl[a]=b;var b=postLabels[c];postLabels[c]=postLabels[a];postLabels[a]=b;var b=postPublished[c];postPublished[c]=postPublished[a];postPublished[a]=b;var b=postRecent[c];postRecent[c]=postRecent[a];postRecent[a]=b}for(var e=0;e<postTitle.length-1;e++){for(var f=e+1;f<postTitle.length;f++){if(g=="titleasc"){if(postTitle[e]>postTitle[f]){h(e,f)}}if(g=="titledesc"){if(postTitle[e]<postTitle[f]){h(e,f)}}if(g=="dateoldest"){if(postDate[e]>postDate[f]){h(e,f)}}if(g=="datenewest"){if(postDate[e]<postDate[f]){h(e,f)}}if(g=="orderlabel"){if(postLabels[e]>postLabels[f]){h(e,f)}}}}}function sortlabel(){sortBy="orderlabel";sortPosts(sortBy);var d=0;var c=0;while(c<postTitle.length){temp1=postLabels[c];firsti=d;do{d=d+1}while(postLabels[d]==temp1);c=d;sortPosts2(firsti,d);if(c>postTitle.length){break}}}function sortPosts2(i,j){function h(c,a){var b=postTitle[c];postTitle[c]=postTitle[a];postTitle[a]=b;var b=postDate[c];postDate[c]=postDate[a];postDate[a]=b;var b=postUrl[c];postUrl[c]=postUrl[a];postUrl[a]=b;var b=postLabels[c];postLabels[c]=postLabels[a];postLabels[a]=b;var b=postPublished[c];postPublished[c]=postPublished[a];postPublished[a]=b;var b=postRecent[c];postRecent[c]=postRecent[a];postRecent[a]=b}for(var f=i;f<j-1;f++){for(var g=f+1;g<j;g++){if(postTitle[f]>postTitle[g]){h(f,g)}}}}function displayToc(x){var n=0;var q="";var t="Post Title";var i="Click to sort by title";var u="Date";var o="Click to sort by date";var v="Category";var p="";if(sortBy=="titleasc"){i+=" (descending)";o+=" (newest first)"}if(sortBy=="titledesc"){i+=" (ascending)";o+=" (newest first)"}if(sortBy=="dateoldest"){i+=" (ascending)";o+=" (newest first)"}if(sortBy=="datenewest"){i+=" (ascending)";o+=" (oldest first)"}if(postFilter!=""){p="Click to view all"}q+="<table>";q+="<tr>";q+='<td class="header1">';q+='<a href="javascript:toggleTitleSort();" title="'+i+'">'+t+"</a>";q+="</td>";q+='<td class="header2">';q+='<a href="javascript:toggleDateSort();" title="'+o+'">'+u+"</a>";q+="</td>";q+='<td class="header3">';q+='<a href="javascript:allPosts();" title="'+p+'">'+v+"</a>";q+="</td>";q+='<td class="header4">';q+="Read all";q+="</td>";q+="</tr>";for(var r=0;r<postTitle.length;r++){if(x==""){q+='<tr><td class="entry1"><a href="'+postUrl[r]+'">'+postTitle[r]+'</a></td><td class="entry2">'+postDate[r]+'</td><td class="entry3">'+postLabels[r]+'</td><td class="entry4"><a href="'+postPublished[r]+'">Read</a></td></tr>';n++}else{z=postLabels[r].lastIndexOf(x);if(z!=-1){q+='<tr><td class="entry1"><a href="'+postUrl[r]+'">'+postTitle[r]+'</a></td><td class="entry2">'+postDate[r]+'</td><td class="entry3">'+postLabels[r]+'</td><td class="entry4"><a href="'+postPublished[r]+'">Read</a></td></tr>';n++}}}q+="</table>";if(n==postTitle.length){var s='<span class="toc-note">Show All '+postTitle.length+" Posts<br/></span>"}else{var s='<span class="toc-note">Show '+n+" posts by category '";s+=postFilter+"' the "+postTitle.length+" Total Posts<br/></span>"}var w=document.getElementById("toc");w.innerHTML=s+q}function displayToc2(){var d=0;var c=0;while(c<postTitle.length){temp1=postLabels[c];document.write("<p/>");document.write('<p class="labels"><a href="/search/label/'+temp1+'">'+temp1+"</a></p><ol>");firsti=d;do{document.write("<li>");document.write('<a class="post-titles" href="'+postUrl[d]+'">'+postTitle[d]+"</a>");if(postRecent[d]==true){document.write(' - <strong><span style="color: rgb(255, 0, 0);">New!</span></strong>')}document.write("</li>");d=d+1}while(postLabels[d]==temp1);c=d;document.write("</ol>");sortPosts2(firsti,d);if(c>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 b=document.getElementById("toclink")}else{alert("Just wait... TOC is loading")}}function hideToc(){var d=document.getElementById("toc");d.innerHTML="";var c=document.getElementById("toclink");c.innerHTML='<a href="#" onclick="scroll(0,0); showToc(); Effect.toggle(\'toc-result\',\'blind\');">?? Display Table of Contents</a> <img src="https://1.bp.blogspot.com/-8JLCsdnQAhA/WqJtL5Twd8I/AAAAAAAAE5E/OXcWt6juCpUUbxzq_WsRhpOs73Jm7__IgCLcBGAs/s1600/new_icon.gif"/>'}function looptemp2(){for(var b=0;b<numberfeed;b++){document.write("<br>");document.write('Post Link : <a href="'+postUrl[b]+'">'+postTitle[b]+"</a><br>");document.write('Read all : <a href="'+postPublished[b]+'">'+postTitle[b]+"</a><br>");document.write("<br>")}};/*]]>*/</script><script src="https://www.sbmade.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=bloggersitemap"></script>

5.Then apply the URL of your site to sbmade.com in the code above.

6.Finally publish your page.

Additional customization.

1. You can give the desired color instead of the #08f above.They also apply to post title and label colors.

2.If you want to change the font size in the sitemap, you can change 15px number

3.In addition,if you want to number of posts to display, The following code can be used for that.For example, if you want to display the post 100, For that, change the number of numposts in the code.

<script type="text/javascript">/*<![CDATA[*/var numposts=100;var standardstyling=true;function showrecentposts(e){for(var d=0;d<numposts;d++){var f=e.feed.entry[d];var c=f.title.$t;var b;if(d==e.feed.entry.length){break}for(var a=0;a<f.link.length;a++){if(f.link[a].rel=="alternate"){b=f.link[a].href;break}}c=c.link(b);if(standardstyling){document.write("<li>")}document.write(c)}if(standardstyling){document.write("</li>")}};/*]]>*/</script><br /><ul><script src="https://www.sbmade.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script></ul>

4. Then apply the URL of your site to sbmade.com in the code above.

The Index of the posts are arranged alphabetically and the new posts get updated automatically to the sitemap as it gets published on your blog.

READ:
So you know about How to Create HTML Sitemap Page for Blogger, Hope you like the post, don’t forget to share it with your friends and leave a comment below if you are facing any problem at any step in the method discussed above.Thank you.

No comments