How To Create Sitemap Page in Blogger

Sitemap page is not much necessary for blogs but from some point of view it's better to have a sitemap page in menu. Sitemap page basically helps you to make the navigation easier and it also improves page rank of our blog due to make internal linking of our blog. It also helps search engine's crawler to index the content and webpage easier.

Working of Sitemap in blogger or websites

This is automated sitemap page which automatically adds the latest posts in itself without touching it so it's even better for us that we don't need to touch it just after implementing in blog, it will do all the task itself. In this sitemap page, you can see that posts are categorized by labels which is better for readers that they can find the things in that page easily. This sitemap page is developed with JavaScript and CSS .

Creating Sitemap Page in Blogger

It's the most easiest task to insert this in our blogs. Just follow the simple steps given below.

• Go To Blogger >> Dashboard >> Pages
• Create New Page >> Blank Page
• Insert Page Title of Yours Choice.
• Go To HTML Tab

• Copy The Code Below and Paste There in The HTML Tab.
<style type="text/css"> #toc{ width:99%; margin:5px auto; border:1px solid #2D96DF; -webkit-box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2); -moz-box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2); box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2); } .labl{ color:#FF5F00; font-weight:bold; margin:0 -5px; padding:1px 0 2px 11px; background:-moz-linear-gradient(right,#C2EAFE 0%,#055A85 40%); background:-webkit-gradient(linear,left 10,right 80,color-stop(0.20,#055A85),color-stop(1,#C2EAFE)); border:1px solid #2D96DF; border-radius:4px;-moz-border-radius:4px; -webkit-border-radius:4px;box-shadow:3px 3px 1px #bbb; -moz-box-shadow:3px 3px 1px #bbb;-webkit-box-shadow:3px 3px 1px #bbb;display:block; } .labl a{ color:#fff; } .labl:first-letter{t ext-transform:uppercase; } .new{ color:#FF5F00; font-weight:bold; font-style:italic; } .postname{ font-weight:normal; background:-moz-linear-gradient(right,#C2EAFE 0%,#fff 40%); background:-webkit-gradient(linear,left 80,right 10,color-stop(0.60,#fff),color-stop(1,#C2EAFE)); } .postname li{ border-bottom: #ddd 1px dotted; margin-right:5px } </style> <div id="toc"> <script src="https://931dc0a0b1610723e701efdeedfee9f38d96c540.googledrive.com/host/0BzpRhnOt-9avVTZfdHcxNEMzaXc/sitemap.js" type="text/javascript"></script> <script src="http://www.YOURBLOGDOMAIN.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc"> </script> </div> • Replace YOURBLOGDOMAIN With Your Blog Domain.
• Click "Publish" Button.

Conclusion :

I hope that this article would have helped you in understanding sitemap for blogger or websites. Please share your knowledge if you know more about this attribute. Your feedback and constructive contributions are always welcome.