How to Create a Sitemap Page in Blogger [ 100 % Working ]

Sitemap of a blog and website posts get index to search engine easily and search engine generate traffic which is very important for a blog or website to survive.

I have previously written a post relates to submitting sitemap to Google Master Tool and this template is created in .xml format which is perfect to search engine but if you want to your return to access sitemap page which gives them accessibility to easy select a post and read you must create HTML sitemap page.

So how to create a sitemap page for your blog or website:

So everyone know first step is to go to blogger.com
Now go to Pages
Create New Page
Click on HTML and Paste the Below code

<div dir="ltr" style="text-align: left;" trbidi="on">
 
<style type="text/css">  
#bp_toc {    background: #FFFFFF;    border: 0 solid #000000;    margin-top: 10px;    padding: 10px 0;    width: 100%;}h3.bp_toc_title {    font-size: 28px;    line-height: 30px;    padding-top: 40px;    margin: 0 0 20px;}#bp_tocm {    margin-right: 30px;}#bp_toc a {    text-decoration: none !important;}#bp_toc a:hover {    text-decoration: underline !important;}.toc-header-col1, .toc-header-col2, .toc-header-col3 {    background: #4e4949;    border-bottom: 5px solid #dfdfdf;    padding: 10px;    width: 50%;}.toc-entry-col2 {    border-left: 2px solid #FFFFFF;    border-right: 2px solid #FFFFFF;}.toc-header-col2 {    border-left: 2px solid #FFFFFF;    border-right: 2px solid #FFFFFF;    width: 15%;}.toc-header-col3 {    width: 35%;}.toc-header-col1 a:link, .toc-header-col1 a:visited, .toc-header-col2 a:link, .toc-header-col2 a:visited, .toc-header-col3 a:link, .toc-header-col3 a:visited {    color: #EBEBEB;    font-size: 14px;    font-style: normal;    font-weight: bold;    line-height: 1.4em;    text-decoration: none;    border-collapse: separate;}.toc-header-col1 a:hover, .toc-header-col2 a:hover, .toc-header-col3 a:hover {    text-decoration: underline;}.toc-entry-col1, .toc-entry-col2, .toc-entry-col3 {    background: #F8F8F8;    border-bottom: 2px solid #FFFFFF;    padding: 10px;}.toc-entry-col2 {    border-left: 2px solid #FFFFFF;    border-right: 2px solid #FFFFFF;}.toc-entry-col1 a, .toc-entry-col2 a, .toc-entry-col3 a {    color: #45818E;    font-family: 'Verdana',Arial,sans-serif;    font-size: 12px;}.toc-note {    background-color: #4e4949;    color: #EBEBEB;    display: inline-block;    font-size: 14px;    padding: 10px;    text-align: center;    font-weight: 600;    text-transform: uppercase;    border-bottom: 1px solid #dfdfdf;}</style><br /><div id="bp_tocm">
<div id="bp_toc">
<script type="text/javascript">//<![CDATA[var postTitle=[],postUrl=[],postDate=[],postSum=[],postLabels=[],sortBy="datenewest",tocLoaded=!1,numChars=250,postFilter="",tocdiv=document.getElementById("bp_toc"),totalEntires=0,totalPosts=0; function loadtoc(c){if("entry"in c.feed){var d=c.feed.entry.length;totalEntires+=d;totalPosts=c.feed.openSearch$totalResults.$t;if(totalPosts>totalEntires){var b=document.createElement("script");b.type="text/javascript";startindex=totalEntires+1;b.setAttribute("src","/feeds/posts/summary?start-index="+startindex+"&max-results=500&alt=json-in-script&callback=loadtoc");tocdiv.appendChild(b)}for(b=0;b<d;b++){for(var a=c.feed.entry[b],e=a.title.$t,k=a.published.$t.substring(0,10),l,f=0;f<a.link.length;f++)if("alternate"== a.link[f].rel){l=a.link[f].href;break}var g="content"in a?a.content.$t:"summary"in a?a.summary.$t:"",g=g.replace(/<\S[^>]*>/g,"");if(g.length>numChars)var g=g.substring(0,numChars),h=g.lastIndexOf(" "),g=g.substring(0,h)+"...";h="";if("category"in a){for(f=0;f<a.category.length;f++)h+="<a href=\"javascript:filterPosts('"+a.category[f].term+"');\" title=\"Click here to select all posts with label '"+a.category[f].term+"'\">"+a.category[f].term+"</a>, ";a=h.lastIndexOf(",");-1!=a&&(h=h.substring(0, a))}postTitle.push(e);postDate.push(k);postUrl.push(l);postSum.push(g);postLabels.push(h)}}totalEntires==totalPosts&&(tocLoaded=!0,showToc());sortPosts(sortBy);tocLoaded=!0}function filterPosts(c){postFilter=c;displayToc(postFilter)}function allPosts(){postFilter="";displayToc(postFilter)} function sortPosts(c){function d(a,b){var c=postTitle[a];postTitle[a]=postTitle[b];postTitle[b]=c;c=postDate[a];postDate[a]=postDate[b];postDate[b]=c;c=postUrl[a];postUrl[a]=postUrl[b];postUrl[b]=c;c=postSum[a];postSum[a]=postSum[b];postSum[b]=c;c=postLabels[a];postLabels[a]=postLabels[b];postLabels[b]=c}for(var b=0;b<postTitle.length-1;b++)for(var a=b+1;a<postTitle.length;a++)"titleasc"==c&&postTitle[b]>postTitle[a]&&d(b,a),"titledesc"==c&&postTitle[b]<postTitle[a]&&d(b,a),"dateoldest"==c&&postDate[b]> postDate[a]&&d(b,a),"datenewest"==c&&postDate[b]<postDate[a]&&d(b,a)} function displayToc(c){var d=0,b,a="Click to sort by title",e="Click to sort by date",k="";"titleasc"==sortBy&&(a+=" (descending)",e+=" (newest first)");"titledesc"==sortBy&&(a+=" (ascending)",e+=" (newest first)");"dateoldest"==sortBy&&(a+=" (ascending)",e+=" (newest first)");"datenewest"==sortBy&&(a+=" (ascending)",e+=" (oldest first)");""!=postFilter&&(k="Click to show all posts");b="<table>
<tr>";b+='<td class="toc-header-col1">';b+='<a href="javascript:toggleTitleSort();" title="'+a+'">POST TITLE</a>'; b+="</td>";b+='<td class="toc-header-col2">';b+='<a href="javascript:toggleDateSort();" title="'+e+'">POST DATE</a>';b+="</td>";b+='<td class="toc-header-col3">';b+='<a href="javascript:allPosts();" title="'+k+'">LABELS</a>';b+="</td>";b+="</tr>
";for(a=0;a<postTitle.length;a++)""==c?(b+='
<tr><td class="toc-entry-col1"><a href="'+postUrl[a]+'" title="'+postSum[a]+'">'+postTitle[a]+'</a></td><td class="toc-entry-col2">'+postDate[a]+'</td><td class="toc-entry-col3">'+postLabels[a]+"</td></tr>
",d++): (z=postLabels[a].lastIndexOf(c),-1!=z&&(b+='
<tr><td class="toc-entry-col1"><a href="'+postUrl[a]+'" title="'+postSum[a]+'">'+postTitle[a]+'</a></td><td class="toc-entry-col2">'+postDate[a]+'</td><td class="toc-entry-col3">'+postLabels[a]+"</td></tr>
",d++));b+="</table>
";c=d==postTitle.length?'<div class="toc-note">
Displaying all '+postTitle.length+" posts<br/></div>
":'<div class="toc-note">
Displaying '+d+" posts labeled '"+(postFilter+"' of "+postTitle.length+" posts total<br/></div>
");tocdiv.innerHTML= c+b}function toggleTitleSort(){sortBy="titleasc"==sortBy?"titledesc":"titleasc";sortPosts(sortBy);displayToc(postFilter)}function toggleDateSort(){sortBy="datenewest"==sortBy?"dateoldest":"datenewest";sortPosts(sortBy);displayToc(postFilter)}function showToc(){tocLoaded?(displayToc(postFilter),document.getElementById("toclink")):alert("Just wait... TOC is loading")} function hideToc(){document.getElementById("toc").innerHTML="";document.getElementById("toclink").innerHTML='<a href="#" onclick="scroll(0,0); showToc(); Effect.toggle(\'toc-result\',\'blind\');">\u00bb Show Table of Contents</a> <img src="http://chenkaie.blog.googlepages.com/new_1.gif"/>'};//]]></script><script src="/feeds/posts/summary?alt=json-in-script&max-results=500&callback=loadtoc" type="text/javascript"></script></div>
</div>
</div>

</script>

Put Post Title as Sitemap
Now Click on Publish button
Done

LLive Preview Here

Comment Below for Any Help.

How to Create a Sitemap Page in Blogger [ 100 % Working ]

Next

Newer Post

Previous

Older Post