Hey Guys! Welcome back to Techly Series website.

Assuming You are observing the Stylish Sitemap Page Script on blogger. This is the Right Place to you. Since You can get this Script for free.

Today, in this article, I will Discuss with you about How to Create a Stylish Sitemap Page.

What is Sitemap

A sitemap is a document where you give data about the pages, recordings, and different documents on your site, and the connections between them. Web indexes like Google read this document to creep your webpage all the more productively.

A sitemap tells Google which pages and archives you accept are huge in your site, and moreover gives significant information about these records. For instance, when the page was last refreshed and any other language renditions of the page.

You can use a sitemap to give information about unequivocal kinds of content on your pages, including video, picture, and news content.

Assuming your site's pages are appropriately connected, Google can normally find the majority of your site. Appropriate connecting implies that all pages that you consider significant can be reached through some type of route, be that your site's menu or connections that you put on pages. All things considered, a sitemap can work on the creeping of bigger or more perplexing destinations, or more particular documents.

How to Create

So, to create Stylish Sitemap Page on blogger you need to follow the following process below precisely.

What's more, with the help of these steps, you can easily create this page in your blogger website.

Step 1

• You will go to your - Blogger Dashboard
• Go to Theme
• Go to - Edit HTML
• Search - </head> or &lt;/head&gt;
• Copy this CSS Code below and Paste on top of </head> or &lt;/head&gt;
• Save Theme

<style>
.Sitemap{border-radius:10px;padding:0.1px 30px 25px 30px;margin:20px 0;box-shadow:0 0 15px #000}
.Sitemap h5:before{font-family:fontawesome;content:'\f02c';font-size:16px;padding-right:6px}
.Post li{list-style:none;line-height:2}
.Post li:before{font-family:fontawesome;content:'\f101';padding-right:10px}
.Post li a{color:#000;cursor:not-allowed}
.Post li a:hover{color:#00008b}
.Post li a b{color:#00008b}
</style>
<script crossorigin='anonymous' src='https://kit.fontawesome.com/4ad360bfd2.js'/>

Step 2

• After Save Theme
• Create a new Page
• Copy this HTML & Javascript Code below and Paste in your blog - Page
• Just Replace https://yoursite.com
• Publish

<script>
var postTitle=new Array,postUrl=new Array,postPublished=new Array,postDate=new Array,postLabels=new Array,postRecent=new Array,sortBy="titleasc",numberfeed=0;function bloggersitemap(t){!function(){if("entry"in t.feed){var e=t.feed.entry.length;numberfeed=e,ii=0;for(var s=0;s<e;s++){for(var o,i=t.feed.entry[s],l=i.title.$t,r=i.published.$t.substring(0,10),p=0;p<i.link.length;p++)if("alternate"==i.link[p].rel){o=i.link[p].href;break}var a="";for(p=0;p<i.link.length;p++)if("enclosure"==i.link[p].rel){a=i.link[p].href;break}var n="";if("category"in i)for(p=0;p<i.category.length;p++){var b=(n=i.category[p].term).lastIndexOf(";");-1!=b&&(n=n.substring(0,b)),postLabels[ii]=n,postTitle[ii]=l,postDate[ii]=r,postUrl[ii]=o,postPublished[ii]=a,postRecent[ii]=s<10,ii+=1}}}}(),sortPosts(sortBy="titledesc"),sortlabel(),displayToc()}function sortPosts(t){function e(t,e){var s=postTitle[t];postTitle[t]=postTitle[e],postTitle[e]=s;s=postDate[t];postDate[t]=postDate[e],postDate[e]=s;s=postUrl[t];postUrl[t]=postUrl[e],postUrl[e]=s;s=postLabels[t];postLabels[t]=postLabels[e],postLabels[e]=s;s=postPublished[t];postPublished[t]=postPublished[e],postPublished[e]=s;s=postRecent[t];postRecent[t]=postRecent[e],postRecent[e]=s}for(var s=0;s<postTitle.length-1;s++)for(var o=s+1;o<postTitle.length;o++)"titleasc"==t&&postTitle[s]>postTitle[o]&&e(s,o),"titledesc"==t&&postTitle[s]<postTitle[o]&&e(s,o),"dateoldest"==t&&postDate[s]>postDate[o]&&e(s,o),"datenewest"==t&&postDate[s]<postDate[o]&&e(s,o),"orderlabel"==t&&postLabels[s]>postLabels[o]&&e(s,o)}function sortlabel(){sortPosts(sortBy="orderlabel");for(var t=0,e=0;e<postTitle.length;){temp1=postLabels[e],firsti=t;do{t+=1}while(postLabels[t]==temp1);if(e=t,sortPosts2(firsti,t),e>postTitle.length)break}}function sortPosts2(t,e){function s(t,e){var s=postTitle[t];postTitle[t]=postTitle[e],postTitle[e]=s;s=postDate[t];postDate[t]=postDate[e],postDate[e]=s;s=postUrl[t];postUrl[t]=postUrl[e],postUrl[e]=s;s=postLabels[t];postLabels[t]=postLabels[e],postLabels[e]=s;s=postPublished[t];postPublished[t]=postPublished[e],postPublished[e]=s;s=postRecent[t];postRecent[t]=postRecent[e],postRecent[e]=s}for(var o=t;o<e-1;o++)for(var i=o+1;i<e;i++)postTitle[o]>postTitle[i]&&s(o,i)}function displayToc(){for(var t=0,e=0;e<postTitle.length;){temp1=postLabels[e],document.write(""),document.write('<div class="Sitemap"><h5>'+temp1+'</h5><div class="Post">'),firsti=t;do{document.write("<li>"),document.write('<a " href="'+postUrl[t]+'">'+postTitle[t]),1==postRecent[t]&&document.write(" - <b>New!</b>"),document.write("</a></li>"),t+=1}while(postLabels[t]==temp1);if(e=t,document.write("</div></div>"),sortPosts2(firsti,t),e>postTitle.length)break}}
</script>

<script src="https://yoursite.com/feeds/posts/summary?alt=json-in-script&amp;max-results=9999&amp;callback=bloggersitemap" type="text/javascript"></script>

Final Words

You ought to indeed note by thinking in the remark box underneath. Or on the other hand you moreover bear to give some sort of Suggestion, likewise you can partake your conviction with me in the Comment Box beneath.

I didn't give this content to any individual who saw or replicated them. This content I've looked through a great deal and given by experience. So kindly don't note on this substance.

Assuming you experience any issues while copying this script you can impart me by Telegram and I'll attempt to help.