How to Create HTML Sitemap Page in Blogger

HTML Sitemap Page in Blogger:  HTML Sitemap(table of contents) of a blog provides an easy navigation for readers to easily view all the blog's post in one place, helps search crawlers to crawl the entire blog properly, increases the crawling of a blog and its indexing rate.  In this post, you'll get to know how to create HTML sitemap page in blogger. Adding an HTML sitemap in your blogger blog can influence your blog's rank in search engines. Also, HTML sitemap in a website creates a strong internal linking of the blog's pages which brings about a good search engine optimization.


Also Read: How to Add HTML Parse Tool To Blogger
                    How to Upload Blogger Template

 Other than the about us, contact us pages on your blog, another important page that must be included in your blog is the HTML sitemap page or table of contents page. In the page, all your posts are arranged according to their label, making it easy to go through them unlike if they were in blog archives. Follow this blogging tip to create an HTML sitemap in your blog.

Also Read:  How to Add  Read More Attribution Links to Copied Text in Blogger
                    How to Add Custom Robots Header Tags in Blogger

How to Create a Sitemap or Table of Contents in Blogger

  • Go to your blogger dashboard.
  • Navigate to' Pages'.
  • Click on  'New Page'.
  • Set the editor on 'HTML'  mode.
  • Copy the code below and paste inside the editor. how to create table of contents in blogger


<script type='text/javascript'>

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 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 = "titledesc";
    sortPosts(sortBy);
    sortlabel();
    displayToc();
}

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() {
    var a = 0;
    var b = 0;
    while (b < postTitle.length) {
        temp1 = postLabels[b];
        document.write("");
        document.write('<div class="post-archive"><h4>' + temp1 + '</h4><div class="ct-columns">');
        firsti = a;
        do {
            document.write("<p>");
            document.write('<a " href="' + postUrl[a] + '">' + postTitle[a] + "");
            if (postRecent[a] == true) {
                document.write(' - <strong><span>New!</span></strong>')
            }
            document.write("</a></p>");
            a = a + 1
        } while (postLabels[a] == temp1);
        b = a;
        document.write("</div></div>");
        sortPosts2(firsti, a);
        if (b > postTitle.length) {
            break
        }
    }
}

</script>

<script src="http://yourblog.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=bloggersitemap"></script>


  • In the code above, Replace the higlighted URL in with yours.
  • Publish the page and you've successfully created an HTML sitemap page in Blogger for all labels.




Do you like this post? Please link back to this article by copying one of the codes below.

URL Of Post:


HTML Link Code:

BB (forum) link code:

Comments

  1. Hi Gracia,
    Html sitemap is essencial to any blog it shows all your posts, labels and pages to search engines, thereby allowing their bots crawl our sites with ease, it's good you shared a tip to add it to blogger blogs.

    I know a method to add it though, but it's quite different from your method. Will give you method a try.
    Thanks for sharing, and enjoy the weekend.
    Merry Xmas :)

    ReplyDelete
    Replies
    1. Hello Larry,

      Yes an HTML sitemap in a blog goes a long way to help in SEO. Would also like to learn how your method. Wish you a great week ahead

      Delete
  2. Great tutorial! I don't use blogger myself, but I get lots of questions about it. It's good to know about tutorials like these so I have a place to send people for answers. :)

    ReplyDelete
  3. Replies
    1. Hello Dainty,

      did you replace the URL from the code with your website's URL? Also, ensure you pasted the code in the 'HTML mode' of the text editor and not the compose mode.

      Used the same code to implement my sitemap page which you see being displayed as on of the tabs. Anyway, I'll check out the code again for any errors.

      Thanks for stopping by.

      Delete
  4. So a sitemap page affects my pagerank? Hmmm, that is good to know. Thanks for the info, sis.

    ReplyDelete
  5. sorry Grace for some reasons i can't seem to copy the code. why so ?

    ReplyDelete
    Replies
    1. Hi Nnamdi,

      Sorry about that, as at the time you tried to copy it, techlass.com was still undergoing some work, hence the inability to copy some or all codes. As of now, these codes can be copied.

      Delete
  6. https://googledrive.com/host/0ByNodV_m9cVLR0pmWFgwZ1NmdW8
    Try to fix this?!
    This has an error.

    plus the code is not working.

    ReplyDelete

Post a Comment

Please share your views on this topic with Grace Joseph by leaving a comment.