Sitemap of a blog helps search crawlers to crawl the entire blog
properly. It helps to increase our blog crawling and indexing. Previously, I
have shared a tutorial about How to Submit Blogger Sitemapto Google Webmaster Tools. That sitemap is in .XML format
which we use to submit in Google Webmaster Tool which is only for search
engines so that they can index all of our blog posts. Today in this tutorial I
am going to share a trick by which you can create a HTML sitemap for your blog readers so that they
can easily select a post to read. If you use HTML sitemap in your blog wisely
then you can increase your blog page rank also. You can show all of your blog
posts at single sitemap page or you can use sitemap for particular label.
Whatever your need is, this tutorial will help you. So, let see how to add a
sitemap page in blogger.
Creating Sitemap Page for All Labels
If you want to show
all of your blog posts at same page then follow below steps one by one.
1.
Go to your blogger blog.
2.
Now Navigate to Pages > New Page > Blank Page.
3.
Switch it to HTML mode.
4.
Paste below code in
the post body.
<script type=”text/javascript”>
var numposts = 100;
var standardstyling = true;
function showrecentposts(json) {
for (var i = 0; i < numposts; i++) {
var entry = json.feed.entry[i];
var posttitle = entry.title.$t;
var posturl;
if (i == json.feed.entry.length) break;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == ‘alternate’) {
posturl = entry.link[k].href;
break;
}}
posttitle = posttitle.link(posturl);
if (standardstyling) document.write(‘<li>’);
document.write(posttitle);}
if (standardstyling) document.write(‘</li>’);
}
</script>
<ul>
<script src=”http://www.allin1pk.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999″></script>
</ul>
5.
Replace www.allin1pk.com with your own blog URL.
6.
Click Publish button.
7.
That’s it.
Creating Sitemap Page for Particular Label
If you want to show
posts from specific labels, like in this page “SEO Tips for Bloggers”, then
instead of the above code, use below code.
<script type=”text/javascript”>
var numposts = 100;
var standardstyling = true;
function showrecentposts(json) {
for (var i = 0; i < numposts; i++) {
var entry = json.feed.entry[i];
var posttitle = entry.title.$t;
var posturl;
if (i == json.feed.entry.length) break;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == ‘alternate’) {
posturl = entry.link[k].href;
break;
}}
posttitle = posttitle.link(posturl);
if (standardstyling) document.write(‘<li>’);
document.write(posttitle);}
if (standardstyling) document.write(‘</li>’);
}
</script>
<ul>
<script src=”http://www.allin1pk.com/feeds/posts/default/-/Label%20Name?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999″></script>
</ul>
Replace www.allin1pk.com with your blog URL and Label%20Name with your label name.
Remember: If you are using single word as your
label name like “SEO” then put SEO there but if you
are using more than one word, then put %20 between
each word.
For example: if the
label name is Blogger Tricks, then put Blogger%20Tricks.
The label name is case
sensitive, so take care of it. Means don’t put seo in
the place of SEO. The code will not work in that
case.
Final Words!
This was the little
trick about how to make HTML sitemap page in Blogger for particular label or
for all labels. I hope you guys like this tutorial. Feel free to leave comment
below this post to share your views and feedback.
Post a Comment