How to Add an HTML Sitemap with Live Search & Category Filters

If your Blogger site is growing and you’re publishing content regularly, chances are your archive is getting harder to navigate. Readers might struggle to find older posts, and valuable content can easily get buried. That’s exactly where an HTML sitemap with search and filtering becomes incredibly useful.

Instead of a plain list of links, this advanced sitemap gives your visitors a powerful way to explore your blog. They can browse all posts in one place, filter them by category, or search by keywords to instantly narrow down results. Even better, newly published content automatically appears at the top. So your sitemap always stays fresh without manual updates.

Installation Instructions

Setting up this sitemap might look complex at first glance, but once you follow the steps carefully, it becomes easy. You’ll essentially create a dedicated page, paste a complete code block, and tweak a few settings to match your blog.

Step 1 — Create a New Page

1. Log in to your Blogger Dashboard.
2. Go to Pages in the left sidebar
3. Click + NEW PAGE
4. Give the page a title (e.g., "Sitemap" or "Archive")

Step 2 — Switch to HTML View

1. In the page editor, click the Pencil icon (or "Compose view") in the top left corner
2. Select HTML view
3. Delete any existing code in the editor and paste the entire code (HTML, Script, and Style)

     <div class="sm-topbar">
     <div class="sm-search-wrapper">
       <input class="sm-search" id="search" placeholder="Search posts..." type="search"/>
       <div class="sm-search-icon">
         <svg viewBox="0 0 512 512"><path d="M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z" fill="currentColor"/></svg>
       </div>
     </div>
       
      <div class="sm-filters">
       <select id="sort">
         <option value="published">Latest Posts</option>
         <option value="updated">Latest Updated</option>
       </select>
   
       <select id="category">
         <option value="">All</option>
       </select>
     </div>
   </div>
   
   <div class="sm-count" id="count">Loading...</div>
   <div class="sm-posts" id="posts"></div>
   <div id="load-more-container" style="text-align:center; padding: 20px;">
     <button id="load-more-btn" class="sm-btn-more">Load More</button>
   </div>
   
   <script>//<![CDATA[
   const blogURL = window.location.protocol + "//" + window.location.hostname;
   const postsPerLoad = 30;
   const manualLabels = ["Anime", "Blogger", "Comics", "Recommendations", "Social Media", "Tutorial"];
   let nextPage = 1;
   let currentLabel = "";
   let currentSort = "published";
   let searchQuery = "";
   
   const _0x3e9b02=_0x2b7d;(function(_0xd988b8,_0x3da1ff){const _0x438684=_0x2b7d,_0x89f2d6=_0xd988b8();while(!![]){try{const _0x3b6268=parseInt(_0x438684(0x276))/(0x2e7*0xa+0x1*-0xd49+-0xfbc)*(-parseInt(_0x438684(0x224))/(0x1826+-0x1642*-0x1+-0x2e66))+-parseInt(_0x438684(0x25f))/(-0x25d0+0x1ee3*-0x1+-0xa*-0x6df)*(parseInt(_0x438684(0x275))/(-0x7*-0x547+0x2*-0x2f6+-0x1*0x1f01))+-parseInt(_0x438684(0x281))/(0xd0*0x2f+-0x641+-0x1fea)*(-parseInt(_0x438684(0x22d))/(0x6*0x432+0x1*-0x1282+0x22*-0x32))+-parseInt(_0x438684(0x25d))/(0xaeb+-0xba6+0x1*0xc2)+-parseInt(_0x438684(0x288))/(-0x2d5*0x7+0x1*0x148d+-0x59*0x2)+-parseInt(_0x438684(0x20b))/(-0x199a*-0x1+0x2bd*0x4+-0x1*0x2485)*(parseInt(_0x438684(0x28d))/(-0x1b90+-0x269a+0x4234))+parseInt(_0x438684(0x283))/(0xd*0x72+0x13*-0x13+-0x2*0x22b);if(_0x3b6268===_0x3da1ff)break;else _0x89f2d6['push'](_0x89f2d6['shift']());}catch(_0x31a98a){_0x89f2d6['push'](_0x89f2d6['shift']());}}}(_0x1ee2,0x185b8+-0x64487*-0x1+-0x8*-0x28c));function initManualLabels(){const _0x5415d1=_0x2b7d,_0x3dff04={'zejTZ':_0x5415d1(0x203),'tyFLp':_0x5415d1(0x219)},_0x7138cb=document[_0x5415d1(0x262)+_0x5415d1(0x278)](_0x3dff04[_0x5415d1(0x26c)]);manualLabels[_0x5415d1(0x213)](_0x32d461=>{const _0x3e900a=_0x5415d1,_0x59f02b=document[_0x3e900a(0x241)+_0x3e900a(0x22b)](_0x3dff04[_0x3e900a(0x269)]);_0x59f02b[_0x3e900a(0x22a)]=_0x32d461,_0x59f02b[_0x3e900a(0x21d)+'t']=_0x32d461,_0x7138cb[_0x3e900a(0x23e)+'d'](_0x59f02b);});}async function loadPosts(_0x2468e3=!(-0x207d+0x1a+0x2064)){const _0x12ebb2=_0x2b7d,_0x18d499={'uFrez':_0x12ebb2(0x238),'OqUkV':function(_0xf76de3,_0x3399e6){return _0xf76de3!==_0x3399e6;},'lsPer':_0x12ebb2(0x227),'SvxGN':_0x12ebb2(0x27e)+_0x12ebb2(0x27f)+_0x12ebb2(0x26b)+_0x12ebb2(0x257)+_0x12ebb2(0x229)+_0x12ebb2(0x22e)+_0x12ebb2(0x204)+_0x12ebb2(0x26f)+_0x12ebb2(0x260)+'&s','lIPAT':function(_0x43b713,_0x1f0d14){return _0x43b713+_0x1f0d14;},'DaPNr':_0x12ebb2(0x24d),'jOIYz':_0x12ebb2(0x23c),'EyXdz':_0x12ebb2(0x214),'kKXAi':_0x12ebb2(0x1f4)+_0x12ebb2(0x208),'GHEDw':_0x12ebb2(0x1fc)+_0x12ebb2(0x277),'KsmWM':_0x12ebb2(0x24f),'rGBru':function(_0x1af8b3,_0x20b90f){return _0x1af8b3*_0x20b90f;},'PlaGM':function(_0x5e13af,_0x308e30){return _0x5e13af-_0x308e30;},'SBsCo':function(_0x268ef3,_0x1edbf3){return _0x268ef3===_0x1edbf3;},'SXZmO':_0x12ebb2(0x21a),'LLFhB':_0x12ebb2(0x217)+_0x12ebb2(0x243),'rxsWs':function(_0x13816c,_0x7ac06e){return _0x13816c(_0x7ac06e);},'ZDbLc':_0x12ebb2(0x254),'oDkXr':_0x12ebb2(0x271),'AHoMx':_0x12ebb2(0x1ee),'vUjtD':function(_0x98215b,_0x3334d7){return _0x98215b<_0x3334d7;},'ZtuTw':_0x12ebb2(0x252)+_0x12ebb2(0x28c),'sciQM':_0x12ebb2(0x225),'xkzlr':_0x12ebb2(0x216)},_0x3f29a9=document[_0x12ebb2(0x262)+_0x12ebb2(0x278)](_0x18d499[_0x12ebb2(0x239)]);let _0x1c1235=_0x18d499[_0x12ebb2(0x27c)](blogURL,_0x18d499[_0x12ebb2(0x25b)]);currentLabel&&(_0x1c1235+=_0x18d499[_0x12ebb2(0x27c)](_0x18d499[_0x12ebb2(0x23a)],currentLabel)),_0x1c1235+=_0x12ebb2(0x200)+_0x12ebb2(0x25e)+'s='+postsPerLoad+(_0x12ebb2(0x24a)+_0x12ebb2(0x1ff))+_0x18d499[_0x12ebb2(0x27c)](_0x18d499[_0x12ebb2(0x1f1)](_0x18d499[_0x12ebb2(0x287)](nextPage,-0x2023+0x1*-0x10e8+0x4*0xc43),postsPerLoad),-0xd2b+0xa*0x264+0x4*-0x2af),_0x18d499[_0x12ebb2(0x274)](_0x18d499[_0x12ebb2(0x223)],currentSort)&&(_0x1c1235+=_0x18d499[_0x12ebb2(0x1f9)]);const _0x2b189a=await _0x18d499[_0x12ebb2(0x279)](fetch,_0x1c1235),_0x2b50aa=await _0x2b189a[_0x12ebb2(0x28f)](),_0x536d41=_0x2b50aa[_0x12ebb2(0x27b)][_0x12ebb2(0x259)+_0x12ebb2(0x28a)+_0x12ebb2(0x244)]['$t'],_0x1e013f=document[_0x12ebb2(0x262)+_0x12ebb2(0x278)](_0x18d499[_0x12ebb2(0x207)]);_0x2468e3&&(_0x1e013f[_0x12ebb2(0x248)]='',_0x3f29a9[_0x12ebb2(0x270)]=_0x18d499[_0x12ebb2(0x24b)],_0x3f29a9[_0x12ebb2(0x22c)]=!(-0x2*0xb12+-0x13b2+-0x29d7*-0x1));let _0x143c93=_0x2b50aa[_0x12ebb2(0x27b)][_0x12ebb2(0x1fe)]||[];if(searchQuery){const _0x2d211f=searchQuery[_0x12ebb2(0x209)+'e']();_0x143c93=_0x143c93[_0x12ebb2(0x1f0)](_0x190f2e=>{const _0x13357d=_0x12ebb2,_0x19be4a=_0x190f2e[_0x13357d(0x26d)]['$t'][_0x13357d(0x209)+'e'](),_0x481c93=_0x190f2e[_0x13357d(0x219)]?_0x190f2e[_0x13357d(0x219)][_0x13357d(0x236)](_0x21383a=>_0x21383a[_0x13357d(0x228)][_0x13357d(0x209)+'e']()):[];return _0x19be4a[_0x13357d(0x231)](_0x2d211f)||_0x481c93[_0x13357d(0x263)](_0x5c9315=>_0x5c9315[_0x13357d(0x231)](_0x2d211f));}),document[_0x12ebb2(0x262)+_0x12ebb2(0x278)](_0x18d499[_0x12ebb2(0x206)])[_0x12ebb2(0x270)]=_0x143c93[_0x12ebb2(0x1f6)]+(_0x12ebb2(0x284)+_0x12ebb2(0x233))+searchQuery+'\x22';}else document[_0x12ebb2(0x262)+_0x12ebb2(0x278)](_0x18d499[_0x12ebb2(0x206)])[_0x12ebb2(0x270)]=_0x536d41+(_0x12ebb2(0x226)+_0x12ebb2(0x1f7));_0x18d499[_0x12ebb2(0x258)](_0x143c93[_0x12ebb2(0x1f6)],postsPerLoad)&&(_0x3f29a9[_0x12ebb2(0x270)]=_0x18d499[_0x12ebb2(0x285)],_0x3f29a9[_0x12ebb2(0x22c)]=!(0x859+0x1*-0x125d+0x281*0x4),_0x3f29a9[_0x12ebb2(0x222)][_0x12ebb2(0x1f8)]=_0x18d499[_0x12ebb2(0x21c)],_0x3f29a9[_0x12ebb2(0x222)][_0x12ebb2(0x24c)]=_0x18d499[_0x12ebb2(0x27a)]),_0x143c93[_0x12ebb2(0x213)](_0x632888=>{const _0x6dd8ef=_0x12ebb2,_0x432701=_0x632888[_0x6dd8ef(0x26e)][_0x6dd8ef(0x23d)](_0x4403b1=>_0x6dd8ef(0x21b)===_0x4403b1[_0x6dd8ef(0x256)])[_0x6dd8ef(0x21e)];let _0x226da5='';if(_0x632888[_0x6dd8ef(0x215)+_0x6dd8ef(0x232)])_0x226da5=_0x632888[_0x6dd8ef(0x215)+_0x6dd8ef(0x232)][_0x6dd8ef(0x255)];else{if(_0x632888[_0x6dd8ef(0x230)]&&_0x632888[_0x6dd8ef(0x230)]['$t'][_0x6dd8ef(0x231)](_0x18d499[_0x6dd8ef(0x1f5)])){const _0x417993=_0x632888[_0x6dd8ef(0x230)]['$t'][_0x6dd8ef(0x20c)](/src=["']([^"']+)["']/);_0x226da5=_0x417993?_0x417993[0x3f*-0x3+-0x5*0x6a9+0x15*0x19f]:'';}}_0x226da5=_0x18d499[_0x6dd8ef(0x237)]('',_0x226da5)?_0x226da5[_0x6dd8ef(0x253)](/\/s[0-9]+(-c)?\//,_0x18d499[_0x6dd8ef(0x235)]):_0x18d499[_0x6dd8ef(0x21f)];let _0x4d7efe='';_0x632888[_0x6dd8ef(0x220)]?_0x4d7efe=_0x632888[_0x6dd8ef(0x220)]['$t']:_0x632888[_0x6dd8ef(0x230)]&&(_0x4d7efe=_0x632888[_0x6dd8ef(0x230)]['$t'][_0x6dd8ef(0x253)](/<[^>]*>?/gm,'')),_0x4d7efe=_0x18d499[_0x6dd8ef(0x27c)](_0x4d7efe[_0x6dd8ef(0x27d)](-0x1ec4+0x215+0x1caf,0x39*-0x29+0x58f+0x184*0x3),_0x18d499[_0x6dd8ef(0x272)]);const _0x2407a4=new Date(_0x632888[_0x6dd8ef(0x20d)]['$t'])[_0x6dd8ef(0x28b)+_0x6dd8ef(0x268)](),_0x63ab35=document[_0x6dd8ef(0x241)+_0x6dd8ef(0x22b)](_0x18d499[_0x6dd8ef(0x245)]);_0x63ab35[_0x6dd8ef(0x261)]=_0x18d499[_0x6dd8ef(0x246)],_0x63ab35[_0x6dd8ef(0x248)]=_0x6dd8ef(0x250)+_0x6dd8ef(0x218)+_0x632888[_0x6dd8ef(0x26d)]['$t']+(_0x6dd8ef(0x1f3)+_0x6dd8ef(0x205)+_0x6dd8ef(0x201))+_0x226da5+(_0x6dd8ef(0x221)+_0x6dd8ef(0x266)+_0x6dd8ef(0x210)+_0x6dd8ef(0x273)+_0x6dd8ef(0x25a)+_0x6dd8ef(0x202)+_0x6dd8ef(0x289))+_0x632888[_0x6dd8ef(0x26d)]['$t']+_0x6dd8ef(0x280)+_0x432701+(_0x6dd8ef(0x1fd)+_0x6dd8ef(0x25c))+_0x632888[_0x6dd8ef(0x26d)]['$t']+(_0x6dd8ef(0x265)+_0x6dd8ef(0x20a)+_0x6dd8ef(0x266)+_0x6dd8ef(0x26a)+_0x6dd8ef(0x286)+_0x6dd8ef(0x20e)+_0x6dd8ef(0x242)+_0x6dd8ef(0x28e)+_0x6dd8ef(0x20f)+_0x6dd8ef(0x1fa))+_0x4d7efe+(_0x6dd8ef(0x1f2)+_0x6dd8ef(0x273)+_0x6dd8ef(0x212)+'\x22>')+_0x2407a4+(_0x6dd8ef(0x247)+_0x6dd8ef(0x24e)),_0x1e013f[_0x6dd8ef(0x23e)+'d'](_0x63ab35);}),nextPage++;}document[_0x3e9b02(0x262)+_0x3e9b02(0x278)](_0x3e9b02(0x249))[_0x3e9b02(0x240)]=function(){const _0x24447e=_0x3e9b02,_0x26a375={'sxjdV':function(_0x51d032,_0x797ec4){return _0x51d032(_0x797ec4);}};currentSort=this[_0x24447e(0x22a)],nextPage=0x1388+0x6aa+-0x1a31,_0x26a375[_0x24447e(0x1fb)](loadPosts,!(-0x2b*-0x48+0x58d+-0x11a5*0x1));},document[_0x3e9b02(0x262)+_0x3e9b02(0x278)](_0x3e9b02(0x219))[_0x3e9b02(0x240)]=function(){const _0x27126d=_0x3e9b02,_0x30f528={'TUBbF':function(_0x4ff72b,_0x302c2e){return _0x4ff72b(_0x302c2e);}};currentLabel=this[_0x27126d(0x22a)],nextPage=-0x14*-0x14e+0x1a5e+0x1*-0x3475,_0x30f528[_0x27126d(0x23b)](loadPosts,!(-0x89b*-0x3+0x76d*0x1+-0x353*0xa));},document[_0x3e9b02(0x262)+_0x3e9b02(0x278)](_0x3e9b02(0x267))[_0x3e9b02(0x282)]=function(){const _0x49f278=_0x3e9b02,_0x418457={'vqbmM':function(_0x53b24e,_0x31ad5e){return _0x53b24e(_0x31ad5e);}};searchQuery=this[_0x49f278(0x22a)],nextPage=0x1754+-0x347*-0x1+-0x1a9a*0x1,_0x418457[_0x49f278(0x1ef)](loadPosts,!(-0x1*0x12f9+0x1cf7+-0x9fe));},document[_0x3e9b02(0x262)+_0x3e9b02(0x278)](_0x3e9b02(0x1f4)+_0x3e9b02(0x208))[_0x3e9b02(0x23f)]=function(){const _0x567cf7=_0x3e9b02,_0x2709c7={'HMuQs':_0x567cf7(0x271),'ZaiuH':_0x567cf7(0x234),'ueqBA':function(_0x1e9249){return _0x1e9249();}};if(this[_0x567cf7(0x22c)])return;this[_0x567cf7(0x270)],(this[_0x567cf7(0x270)]=_0x2709c7[_0x567cf7(0x264)],_0x2709c7[_0x567cf7(0x22f)](loadPosts)[_0x567cf7(0x251)](()=>{const _0x12f38f=_0x567cf7;this[_0x12f38f(0x22c)]||(this[_0x12f38f(0x270)]=_0x2709c7[_0x12f38f(0x211)]);}));};function _0x2b7d(_0x2acf77,_0x423946){_0x2acf77=_0x2acf77-(-0x1fc+0x15cf+-0x3*0x5f7);const _0x7b2754=_0x1ee2();let _0x4ca8bb=_0x7b2754[_0x2acf77];return _0x4ca8bb;}function _0x1ee2(){const _0x2da760=['info\x22>\x0a\x20\x20\x20','HMuQs','s=\x22sm-date','forEach','sm-post','media$thum','default','&orderby=u','t=\x22','category','updated','alternate','sciQM','textConten','href','SvxGN','summary','\x22>\x0a\x20\x20<div\x20','style','SXZmO','4KVjVPL','0.5','\x20total\x20pos','/s1600/','term','s?q=tbn:AN','value','ent','disabled','552KGiyMc','d9GcTxYv-U','ueqBA','content','includes','bnail','atching\x20\x22','Loading...','lsPer','map','OqUkV','<img','kKXAi','KsmWM','TUBbF','div','find','appendChil','onclick','onchange','createElem','x;\x20color:\x20','pdated','lts','jOIYz','EyXdz','</div>\x0a\x20\x20<','innerHTML','sort','&start-ind','oDkXr','cursor','...','/div>\x0a','/-/','\x0a\x20\x20<img\x20al','then','No\x20More\x20Po','replace','posts','url','rel','.com/image','vUjtD','openSearch','s=\x22sm-titl','GHEDw','_self\x22>','3740863kzrsAW','max-result','6ygVrnq','Z6qZKuCrIA','className','getElement','some','ZaiuH','</a></div>','class=\x22sm-','search','teString','zejTZ','snippet\x22\x20s','n0.gstatic','tyFLp','title','link','jjbUDpy8Jc','innerText','Load\x20More','DaPNr','\x20<div\x20clas','SBsCo','476224nizkqp','460606bnAgSK','ts/default','ById','rxsWs','xkzlr','feed','lIPAT','substring','https://en','crypted-tb','\x22\x20href=\x22','24405OUxUGj','oninput','35074248dmQNHn','\x20results\x20m','ZtuTw','tyle=\x22font','PlaGM','5461872qxrohE','-label=\x22','$totalResu','toLocaleDa','sts','300shzIMq','#666;\x20marg','json','count','vqbmM','filter','rGBru','</div>\x0a\x20\x20\x20','\x22\x20class=\x22s','load-more-','uFrez','length','ts\x20found','opacity','LLFhB','\x204px;\x22>','sxjdV','/feeds/pos','\x22\x20target=\x22','entry','ex=','?alt=json&','rc=\x22','e\x22><a\x20aria','option','a7D6ImswxK','m-thumb\x22\x20s','AHoMx','ZDbLc','btn','toLowerCas','\x0a\x20\x20\x20\x20<div\x20','223623ZqAUtw','match','published','-size:\x2013p','in-bottom:'];_0x1ee2=function(){return _0x2da760;};return _0x1ee2();}
   
   initManualLabels();
   loadPosts(true);
   //]]></script>
   
   <style>
   :root{--sm-bg:#ffffff;--sm-text:#1e293b;--sm-card:#e8e8e8;--sm-accent:#4f46e5;--sm-border:#ccc;}body.dark-mode{--sm-bg:#0f0f0f;--sm-text:#eee;--sm-card:#1a1a1a;--sm-accent:#818cf8;--sm-border:#282828;}.sm-topbar{display:flex;gap:10px;flex-wrap:wrap;}.sm-topbar select,.sm-topbar input{padding:8px;border-radius:6px;border:1px solid var(--sm-border);background:var(--sm-card);color:var(--sm-text);}.sm-search{flex:1;}@media (max-width:768px){.sm-topbar{flex-direction:column;}.sm-filters{display:flex;gap:10px;}.sm-search{width:100%;}.sm-search-wrapper{width:100%;};}@media (max-width:650px){.sm-snippet{display:none!important;}.sm-title a{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;line-height:1.4;};}.sm-count{padding:10px;font-size:14px;opacity:0.8;}.sm-posts{overflow-y:auto;}.sm-post{display:flex;gap:12px;margin-bottom:10px;border-radius:10px;}.sm-thumb{width:120px;height:70px;flex-shrink:0;border-radius:6px;object-fit:cover;}.sm-info{flex:1;}.sm-title{font-weight:bold;margin-bottom:5px;}.sm-date{font-size:12px;opacity:0.7;color:var(--sm-text);}.sm-snippet{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;line-height:1.4;margin:5px 0;}.sm-search-wrapper{position:relative;flex:1;display:flex;align-items:center;}.sm-search{width:100%;padding-left:35px !important;}.sm-search-icon{position:absolute;left:10px;width:16px;height:16px;color:var(--sm-text);opacity:0.5;pointer-events:none;display:flex;align-items:center;justify-content:center;}.sm-search-icon svg{width:100%;height:100%;}.sm-search:focus + .sm-search-icon{opacity:1;color:var(--sm-accent);}.sm-search-icon{transition:all 0.2s ease;}.sm-btn-more{padding:10px 25px;background-color:var(--sm-accent);color:#white;border:none;border-radius:6px;cursor:pointer;font-weight:bold;transition:opacity 0.2s;}.sm-btn-more:hover{opacity:0.8;}.sm-posts{overflow-y:visible;}
   </style>

Step 3 — Save and Publish

1. Click Publish (or "Update" if you already saved it).
2. Check the live page to ensure the posts are loading.

What You Must Change

For the sitemap to work with your specific blog, you need to modify a few lines in the <script> section.

1. Manual Label List (Required)

Find this line:

const manualLabels = ["Anime", "Blogger", "Comics", "Recommendations", "Social Media", "Tutorial"];

2. Posts Per Load (Optional)

const postsPerLoad = 30;

3. Styling (Optional)

You can customize colors in this <style> section to match it with your theme colors.

Understanding the Features

• Real-Time Search: The search bar filters titles, labels, and post content locally from the fetched results.
• Load More: Instead of showing a broken "Load More" button or an empty loading spinner, it automatically switches to "No More Posts".
• Thumbnail Fallback: If a post doesn't have a "Featured Image," the script will automatically search the post body for the first <img> tag. If no image is found, it uses a default placeholder.
• Dark Mode Ready: The CSS uses CSS Variables (:root). If your main blog theme uses a .dark-mode/.dark class on the <body>, the sitemap will automatically switch colors to match.
• Mobile Friendly: This sitemap is fully responsive, hidden long snippets on small screens, and optimized titles for readability.

Result

Your sitemap will now:

• Show all posts dynamically
• Allow filtering by category
• Support keyword search
• Load more posts on scroll
• Stay updated automatically

Tips

• Add this page to your navigation menu
• Name it:
• “Sitemap”
• “All Posts”
• “Browse”

And that’s it! Adding this Advanced Searchable Sitemap to your Blogger site is a great way to improve content discovery, user engagement, and site navigation. Now your readers can find exactly what they are looking for in seconds, whether they are searching by keyword or filtering through your categories.