Advanced HTML Sitemap Page in Blogger[10+ Features]

Automatic HTML Sitemap generator in blogger knows about How To Create HTML Sitemap Page In Blogger with many Advanced Features. Create Automated  HTML Sitemap Page for Blogger Website with lots of premium customization features. Even WordPress Plugin may not offers all these features available in our HTML Sitemap Generator Script for Blogger. So What are you waiting for? Let's Create Stylist, Amazing, Responsive, fully Customize options, with many more features.

So Guys, Welcome to our new Blogger Tutorial and with new amazing Blogger Script. Like our recent blogger scripts is loved by many Bloggers and YouTubers similarly this script also comes with amazing features. In this blogger tutorial, we will create a sitemap page for our blogger blog.

When we talk about the HTML Sitemap Page for blogger we don't get any advanced plugin for this. Some may say as it is unfortunate that Blogger does not provide any widgets for making a sitemap as compared to WordPress. Now If we compare to WordPress many plugins available but in the blogger blog, we even don't have 1% of it.

Advanced HTML Sitemap Page in Blogger

Create HTML Sitemap Page for your Website - Tutorial

In this tutorial, Create a blogger HTML sitemap page Sorted by post label, post publishes date also alphabetical order, and with the attribute “New” to those post freshly published, newest posts, number of post in labels, a different section for each label, post summary, images, and many more. Choose the one that is best for you.

So we Technical Arp are back with HTML Stylist and Responsive Sitemap Page Generator Script that contains many advanced features even WordPress Plugins may not offer all this but we can make in blogger. Therefore, to Create a Stylist Blogger Sitemap Page using small HTML lines of code read the complete article and follow it.

Before going forward to add a Sitemap page it is very important to know the benefits of a sitemap and the difference between an HTML sitemap and an XML sitemap also benefits your website visitor.

What Is a Sitemap?

A site map (or sitemap) is a list of pages of a website as the name suggests site map a map of your website content. A sitemap is a model of a website's content designed to help both users and search engines navigate the site. A site map is a visual or textually organized model of a Website's content that allows the users to navigate through the site to find the information they are looking for, just as a traditional geographical map helps people find places they are looking for in the real world. Similarly, visitors can get all your post information at one page and search engines can easily navigate on your site.

Basically, in simple words, sitemaps are organized hierarchically, for breaking down the Website's information into increasingly specific subject areas. Many sites have user-visible sitemaps that present a systematic view, typically hierarchical, of the site. These are intended to help visitors find specific pages, and can also be used by crawlers. Learn more about Sitemap from Sitemap.org

Alphabetically organized site maps, sometimes called site indexes, are a different approach.

Types of Sitemap for the website - HTML And XML Sitemaps

HTML sitemap is different from the XML sitemap

What Is XML Sitemap?

XML Sitemap is used by Search engines only, the Search engine uses their respective web crawlers (bots) to discover pages from links within the site and from other sites. XML Sitemap is an XML file attached to your website which supplies this data to crawlers in XML language so it is called XML Sitemap. The sitemap file consists of all posts URL with additional information regarding each URL. So Most Important is Search engine uses this data to index your posts in the best possible way. we submit to search engine XML Sitemap for improving on crawling rate or get quick indexing of our new blog post

What Is HTML Sitemap?

HTML sitemap is a regular HTML page that can be read by search engine bots as well as by visitors.  The main purpose of using HTML based sitemap is to represent all your posts in an organized manner so that your users can navigate all of your posts through a single page. HTML sitemaps ostensibly serve website visitors. The sitemaps include every page on the website – from the main pages to lower-level pages. An HTML sitemap is just a clickable list of pages on a website. HTML Sitemap shows a nicely organized of your published post on a page. This is what this tutorial is about, we're going to create an HTML sitemap page for our blogger blog,

So Let's Dive into the code section and follow all below simple steps.

---

STEPS TO CREATE HTML SITEMAP IN BLOGGER

Like all other Script we provide to you, all are simple and easy to understand and do modifications. So In this Script, we don't need to put any code here and there, means no need to Open the template file or to put some code in Layout HTML Widget

Let me tell you If you put any HTML/Javascript Widget from Blogger layout for small changes it will load on every page of your website even If we don't want that in some pages. If we want to add some functionality to the homepage using a widget them it will run on every post and pages. This can low down your website speed for unnecessary requests that we don't want Right!.

Therefore Technical Arp is providing you a very simple implementation to create an HTML Sitemap Page in Blogger without using widgets.

Html Sitemap Page Generator Script blogger

More Script: Instagram Photo and Video Downloader Script

So let's Start implementation and know all features for customizations.

1. Step 1: Go To Blogger Dashboard>>Pages>>New Page

2. Step 2: Enter "Sitemap" or something appropriate for you within the Page title subject.

3. Step 3: Click on Page Setting Section >> Check Do Not Allow, hide existing to disable comment option on this page, but if you wish to.

4. Step 4: Switch from Composer View to HTML View

5. Step 5: Enter the below codes before clear any default code contained in the HTML View than pasting the following code.

<link href='https://cdn.jsdelivr.net/gh/IamArpain/blogger-sitemap-generator-script/Script/arpain-sitemap-css.css' rel='stylesheet' type='text/css'/><br />
<style>
/*

Any Custom Style to change default design

*/
</style><br />
<br />

<div class="arpian-sitemap" id="arpian-sitemap">

<span class="loading">Load…</span>

</div>

<script>

var arpianSitemapData = {
blogUrl: "https://www.technicalarp.com", // Blog URL Place your Blog Url to get Post Data without / at end of URL Example: https://www.technicalarp.com
containerId: "arpian-sitemap", // Container ID
activeTab: 1, // The default active tab index (default: the first tab)
showDates: false, // `true` to show the post date
showSummaries: false, // `true` to show the posts summaries
numChars: 200, // Number of summary chars
showThumbnails: false, // `true` to show the posts thumbnails (Not recommended)
thumbSize: 40, // Thumbnail size
noThumb: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAA3NCSVQICAjb4U/gAAAADElEQVQImWOor68HAAL+AX7vOF2TAAAAAElFTkSuQmCC", // A "no thumbnail" URL
monthNames: [ // Array of month names you can use another Language Month If your blog is in other Language then English
"January",
"February",
"March",
"April",
"May",
"June",
"July",
"August",
"September",
"October",
"November",
"December"
],
newTabLink: true, // Open link in new window?
maxResults: 999, // Maximum post results 99999
cpreload: 0, // Load the feed after 0 seconds (option => time in milliseconds || "onload")
sortAlphabetically: false, // `false` to sort posts by published date & true for sorting Alphabetically
showNew: 7, // `false` to hide the "New!" mark in most recent posts, or define how many recent posts are to be marked
newText: ' &ndash; <em style="color:red;">New!</em>' // HTML for the "New!" text
};
</script>
<br />
<script src="https://cdn.jsdelivr.net/gh/IamArpain/blogger-sitemap-generator-script/Script/arpain-sitemap.js"></script>

Download this Code from Below Download Section

Step 6: That's it Really!!! Yes now Publish and Check your page made using HTML Sitemap Page Generator by Technical arp.

Step 7: Most Important Step - Share this Post and Keep Visiting our Website :) Comment If you face any problem.

NOTE: READ BELOW FEATURES AND CUSTOMIZATION OPTIONS

Is this really going to work, Ofcourse publish and check by yourself. Also, don't forget to put your blog URL. And want to more customization then read the below points.

Also Read:
Instagram Font Generator Script for Blogger

Google Drive Direct Download Link Generator Script Blogger

---

Features of Arpian Advanced HTML Sitemap Page Generator Script for Blogger

Blogging experts say, a google sitemap page is one of the most important pages on every blog. It helps to increase user engagement on our blog and makes it more user friendly. So it is important to make this post more attractive, responsive, error-free, fast loading, proper navigations, and more. Using our code you can create an amazing sitemap page you can generate from a very small line of code. So now let us do some more modification by exploring available options.

Blogger Html Sitemap page generator Script for Website

Popular script for blogger: Automatically Add Related Articles in the Middle of the Post

1. activeTab Option

After successfully Load of Sitemap on your page we can see the default Label activeTab is 1, so we can change it by passing the value.

activeTab: 1, // The default active tab index (default: the first tab)

2. showDates

The default value is false, so If you want to show the date of each post in a sitemap then change the value from false to true.

3. showSummaries

Similar to the date option Default value is false, so If you want to show a short summary of each blog post in a sitemap then change the value from false to true.

4. numChars

If you show a summary in the sitemap page then you can change the Number of Character to show in the sitemap but would recommend don't use the summary option

5. showThumbnails

This is a good option if you want to show Post Feature Images then make it true otherwise false

6. thumbSize

Size of thumbnail, default value is 40 but change according to your website design.

7. monthNames

This is an important option because to make New Blade in Post Title i.e new post will have a small animated representation at end of the title. So it is calculated based on months so don't put wrong spelling. Also if you are using this script in other languages like Spanish that change month in that language.

8. newTabLink

True if you want to open a clicked link in the new tab otherwise false for the same tab.

9. maxResults

Maximum Post you want to fetch and show in Blogger Sitemap Page

10. cpreload

If you want to load this Sitemap after some time then change the value, load the feed after 0 seconds (option => time in milliseconds || "onload")

11. sortAlphabetically

Very Useful Option, false to sort posts by published date & true for sorting Alphabetically

12. showNew

false to hide the "New!" mark in most recent posts, or define how many recent posts are to be marked.

13. newText

HTML for the "New!" text marked in most recent posts.

14. All Possible Options are provided to make the Blogger Advanced HTML Sitemap page.

Blogger Responsive and Attractive Sitemap Widget by Technical Arp Team, Free for changes but keep the original attribution. Comment and follow us for more scripts.

Also, Check more Scripts available on our website.

Download YouTube Video Downloader Script

Create Slam Book Friendship Website Php Script

Download HTML Sitemap Page Generator Script for Blogger Website 

We made HTML Sitemap Generator Script for Blogger in such a way that every blogger can use it in any year. So Check Demo and download also use on your website. Check Demo: Sitemap demo

• Scroll Down and you will find Download Button
• Click on it and Wait for 30 Seconds and Download Will Automatically Starts
• If not then click on Re-Download and now no waiting Download will Start.
• Also, Download More Script From Our Website.

HTML Sitemap Page in Blogger[10+ Features] Code Download

Click on Download Re-download

If it's not downloaded automatically, Please Try Again & Click to Re-Download. And IF Again not able to Download Please Inform via the Contact Form page of this blog.

Amazing Script: Voice to Text Converter Tool Script

For a complete demo of the script with a proper installation and usage guide please watch the complete video.

 HTML Sitemap Generator Script in Blogger

Video Coming soon

---

In Conclusion of Advanced HTML Sitemap Page in Blogger

By using the Html script sitemap page, visitors of your blog can easily navigate through all of your published posts under different groups they are interested in. After all your blog's page-views increase and the bounce rate decreases. Good for SEO :)

I personally use the sitemap page on my own blog for a long time, so I can say it is one of the most useful pages of the website. When visitors find out the content on your blog more useful, they search for more content like this on your blog and if a sitemap page is available on your blog then it is really helpful for them.

Now Last words about this blogger tutorial use this script and let us know the next script you want to comment on.

Also, Know about more scripts and useful articles:

Love Calculator Prank Website Php Script Download

All Festival Wishing Website Script Download Blogger

Google Drive Download Link Generator Script Blogger

Also Read

• Tweet
• Share
• Share
• Share

Related Post