How To Create Stylish New Sitemap Page in Blogger 2023

Mostly Blogger

Hello friends I welcome you to this blog post.
I will show you how to create a Sitemap page in Blogger Blog, with these simple steps.

Here we will show you step by step how to create a sitemap page for your blogger blog. First of all, we have to understand why we want a sitemap page for blogger blog. sitemap is the structure of our blog pages and posts. The sitemap page will also improve the user experience. When we add a sitemap page to our blogger/blog then our users make it easy to find the post they want to find. And most importantly, when the (Google Yahoo) Webmaster Tools tools crawler come to our website then the crawl is easily done.

Also Read This Posts: 

˃ How much traffic required for Adsense Approval 

˃ How to Fix My Blog Post Not Showing in Google Search 

˃ Blogger Breadcrumb error fix in google webmaster Tool

These are the following steps:

Step1. Login to your blogger blog and go to the "Overview" from the left menu click on the "Pages" section now click on "New pages" as shown below.

Step2. First we right page title "Sitemap" then click to "HTML" button and delete whatever inside in HTML the copy and paste the code and rename blog address and click on the "Publish" button.

Code Script:

 <div class="tabbed-toc" id="tabbed-toc"></div>  

 <script>  

 var tabbedTOC={blogUrl:"Past Your Blog Url",containerId:"tabbed-toc",activeTab:1,showDates:!0,showSummaries:!1,numChars:200,showThumbnails:!0,thumbSize:60,noThumb:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAA3NCSVQICAjb4U/gAAAADElEQVQImWOor68HAAL+AX7vOF2TAAAAAElFTkSuQmCC",monthNames:["January","February","March","April","May","June","July","August","September","October","November","December"],newTabLink:!0,maxResults:99999,preload:0,sortAlphabetically:!0,showNew:7,newText:' – <em style="color:red;">New</em>'};  

 </script>  

 <script src="https://cdn.jsdelivr.net/gh/Indzign/InSEO@master/daftarisikeren.js"></script>  

 <style scoped="" type="text/css">  

 .tabbed-toc{margin:0 auto;position:relative;background:linear-gradient(-45deg,#EE7752,#E73C7E,#23A6D5,#23D5AB);background-size:400% 400%;animation:Gradient 15s ease infinite}  

 .tabbed-toc .loading{display:block;padding:2px 12px;color:#fff}  

 .tabbed-toc ul,.tabbed-toc ol,.tabbed-toc li{margin:0;padding:0;list-style:none}  

 .tabbed-toc .toc-tabs{width:20%;float:left}  

 .tabbed-toc .toc-tabs li a{display:block;overflow:hidden;color:#fff;text-decoration:none;padding:12px;font-size:13px;transition:all .3s}  

 .tabbed-toc .toc-tabs li a:hover{background-color:rgba(0,0,0,0.05)}  

 .tabbed-toc .toc-tabs li a.active-tab{background:rgba(0,0,0,0.05);position:relative;z-index:5;margin:0 -1px 0 0}  

 .tabbed-toc .toc-content,.tabbed-toc .toc-line{width:80%;float:right;background-color:#fff;box-sizing:border-box}  

 .tabbed-toc .toc-line{float:none;display:block;position:absolute;top:0;right:0;bottom:0}  

 .tabbed-toc .panel{position:relative;z-index:5}  

 .tabbed-toc .panel li a{color:#1277cb;display:block;position:relative;font-weight:500;font-size:14px;padding:6px 12px;overflow:hidden}  

 .tabbed-toc .panel li time{display:block;font-weight:normal;font-size:11px;color:#666;float:right}  

 .tabbed-toc .panel li .summary{display:block;padding:10px 12px 10px;font-size:13px}  

 .tabbed-toc .panel li .summary img.thumbnail{float:left;display:block;margin:5px 8px 0 0;width:72px;height:72px;background-color:#fafafa}  

 .tabbed-toc .panel li{background-color:#f9f9f9;margin:0}  

 .tabbed-toc .panel li:nth-child(even){background-color:#fff}  

 .tabbed-toc .panel li a:hover,.tabbed-toc .panel li a:focus,.tabbed-toc .panel li.bold a{background-color:rgba(0,0,0,0.03);outline:none}  

 .tabbed-toc .panel li a em{background:#f39c12;color:#fff!important;font-style:initial;font-size:11px;margin:0 0 0 5px;padding:2px 10px;border-radius:22px}  

 .tabbed-toc .panel li:before{display:none}  

 .nightmode .tabbed-toc .toc-content,.nightmode .tabbed-toc .toc-line{background-color:rgba(0,0,0,0.1)}  

 .nightmode .tabbed-toc{background:rgba(0,0,0,0.1)}  

 .nightmode .tabbed-toc .panel li{background:rgba(255,255,255,.05)}  

 .nightmode .tabbed-toc .panel li:nth-child(even){background:rgba(255,255,255,.1)}  

 @-webkit-keyframes Gradient{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}  

 @-moz-keyframes Gradient{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}  

 @keyframes Gradient{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}  

 @media (max-width:768px){.tabbed-toc .toc-tabs,.tabbed-toc .toc-content{overflow:hidden;width:auto;float:none;display:block}.tabbed-toc .toc-tabs li{display:inline;float:left}.tabbed-toc .toc-tabs li a.active-tab{background-color:rgba(64,64,64,0.1)}.tabbed-toc .toc-content{border:none}.tabbed-toc .toc-line,.tabbed-toc .panel li time{display:none}}  

 </style> 

Thanks For Visit My Blog Reading This Post.

Ignore this:

how to add sitemap in blogger, blogger sitemap, how to enable sitemap in blogger, blogger sitemap 2020, blogger sitemap generator XML, blogger sitemap generator 2020 blog sitemap example, how to add blogger to google search console,