How to Create a Sitemap Page in Blogger

What is Sitemap: A sitemap is a combination of all contents of a blog or website. Sitemap has many uses. Actually sitemap informs google about contents of your blog. Sitemap increases page rank of your site by increasing internal linking in your site. A sitemap also very helpful for the visitors as it's a easy way to navigate all contents quite easily. Besides a sitemap improves your websites ranking in many way.

Sitemap for Blogger: Though people are not very familiar with sitemap of a blogger powered blog, it's important to have a Sitemap page in menu bar.  Here I am going to describe how to create a blogger sitemap easily. This beautiful and clean sitemap page has been coded specially for Blogger. You can have a look here to See My Blog Sitemap page.

How to create blogger sitemap:

Step-1: Go to Blogger >> Dashboard >> Pages

Step-2: Create a page >> Blank Page >> Click on HTML

Step-3: Copy the below code and Paste inside the empty box.

<b><span style="color: red;">Sitemap page is now loading... It can take up to 30 seconds to load. Please wait...</span></b>
<!--techweb24.com sitemap starts from here-->
<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><br />
<div id="toc">
<script src="https://googledrive.com/host/0ByNodV_m9cVLR0pmWFgwZ1NmdW8/" type="text/javascript"></script>
<script src="http://www.techweb24.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc">
</script></div>

Step-4: Replace http://www.techweb24.com with your domain domain name. It can be a blogger domain also.

Step-5: Now you can disable commenting here by selecting 'Don't allow' from Reader's comment section.

Step-6: Now, it's done. Publish your page. Enjoy :)

• Tweet
• Share
• Share
• Share
• Share

Sign up here with your email