Cara Membuat Sitemap Halaman Statis Seperti Blog Arlinadzgn Di Blogger

Cara membuat sitemap halaman dengan tampilan seperti blog arlinadzgn dengan mudah, namun sebelumnya saya sudah membahas mengenai cara membuat sitemap dengan tampilan yang responsive di blogger,

Mengingatkan kembali bahwa sitemaps ini merupakan sebuah halaman statis bagi pengunjung blog yang gunanya dipergunakan untuk pengenalan bagi visitor dan bukan dipergunakan untuk alat bantu webmaster dalam mempermudah pengenalan peta situs.

Langsung saja cara penggunaanya adalah seperti biasanya Buka Blog > Buat Halaman Baru dengan Judul Terserah kalian lalu tempelkan kode dibawah ini dalam Mode HTML saat membuat halaman baru.

<div id="recentpostsae"></div><div id="recentpostnavfeed"></div><style scoped type="text/css">
#content,.single-posts article{background:transparent;box-shadow:none;padding:0}
.single-posts .entry-title{margin:10px auto 30px auto;text-align:center;background:rgba(0,0,0,0.08);color:#747d8c;display:table;padding:0 20px;border-radius:99em;font-size:16px}
.post-details,.breadcrumbs{display:none}
#recentpostnav{border:1px solid #585858;width:100%;margin:0 auto}
#recentpostsae{margin:0}
#recentpostsae .recentpostel{width:48.6%;background:#fff;display:inline-block;margin:0 20px 10px 0;padding:15px;overflow:hidden;box-shadow:0 2px 3px rgba(0,0,0,0.06),0 2px 3px rgba(0,0,0,0.1)}
#recentpostsae .recentpostel:nth-child(even){margin:0 0 10px 0}
#recentpostsae .recentpostel img{background:#ecf0f1;padding:0;float:left;margin-right:13px !important;width:72px}
#recentpostsae .recentpostel h6,.recentpostel h6 a{text-decoration:none;font-size:14px;font-weight:400;margin:0;color:#000}
#recentpostsae .recentpostel:hover{background-color:#fefefe;box-shadow:none;border:1px solid #ddd}
#recentpostsae .recentpostel p{font-size:12px;text-align:left;color:#555;line-height:normal;margin:5px 0}
#recentpostload{letter-spacing:-10px;text-align:center;background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgao8y0t4nONWAL84HMpPTIeSMNbs37dW1axZecLXEAY329tyMSsQSuKgg7HAXDo5T4Trx85prqnOsu6k7rGqzj1tiOUcHZloOcN1GHgWl_1aC8daC2r35ss77yfY4ubVVZjcSB35CSp1LU/s1600/ellipsis-preloader.gif) no-repeat 50% 50%;height:470px}
#recentpostnavfeed{display:table;padding:5px 10px 5px 0;text-align:left;margin:15px auto}
#recentpostnavfeed a{color:#141414;font-size:12px;font-weight:400;display:block;padding:5px 10px}
#recentpostnavfeed span{padding:0;cursor:pointer;transition:all .3s}
#recentpostnavfeed .next,#recentpostnavfeed .previous{position:relative;overflow:hidden;display:inline-block;background:#fff;color:#222;padding:10px 16px;font-size:1rem;border-radius:99em;box-shadow:0 2px 3px rgba(0,0,0,0.06),0 2px 3px rgba(0,0,0,0.1)}
#recentpostnavfeed .next{float:right;margin:0 0 0 10px}
#recentpostnavfeed .previous{float:left;margin:0 10px 0 0}
#recentpostnavfeed .home{text-align:center;display:table;background:#fff;color:#222;font-size:1rem;float:none;padding:10px 16px;border-radius:99em;margin:auto;box-shadow:0 2px 3px rgba(0,0,0,0.06),0 2px 3px rgba(0,0,0,0.1)}
#recentpostnavfeed a:hover,#recentpostnavfeed span.noactived{color:#ccc}
#recentpostnavfeed i{font-family:fontawesome;font-style:normal}
#recentpostnavfeed .next:hover,#recentpostnavfeed .previous:hover,#recentpostnavfeed .home:hover{background:#fff;color:#222;box-shadow:0 10px 21px rgba(0,0,0,0.15),0 6px 6px rgba(0,0,0,0.12)}
@media screen and (max-width:993px){#recentpostsae .recentpostel{width:100%;margin:0 0 10px 0}}
</style><br />
<script type='text/javascript'>
//<![CDATA[
var numfeed = 18;
var startfeed = 0;
var urlblog = "https://www.lewatinaja.com";
var charac = 0;
var urlprevious, urlnext;
function lewatinfeed(e,t){for(var n=e.split("<"),r=0;r<n.length;r++)-1!=n[r].indexOf(">")&&(n[r]=n[r].substring(n[r].indexOf(">")+1,n[r].length));return n=n.join(""),n=n.substring(0,t-1)}function showrecentpostsae(e){var t,n,r,a,i,s="";urlprevious="",urlnext="";for(var l=0;l<e.feed.link.length;l++)"previous"==e.feed.link[l].rel&&(urlprevious=e.feed.link[l].href),"next"==e.feed.link[l].rel&&(urlnext=e.feed.link[l].href);for(var d=0;d<numfeed&&d!=e.feed.entry.length;d++){t=e.feed.entry[d],n=t.title.$t;for(var l=0;l<t.link.length;l++)if("alternate"==t.link[l].rel){r=t.link[l].href;break}i="content"in t?t.content.$t:"summary"in t?t.summary.$t:"",a="media$thumbnail"in t?t.media$thumbnail.url:"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnotkl4nkSAZ_tHwCrwC1SMMdllQhOMYcZcGZdqf6snLnuj55_3IsHml5QwhsXdLSG0g6BE0fRqVyRcdyD5EQSQTx3KtFiIH2_fHB0p9QZbGB0lY5SSeQgjOJaE4u3dwhD-9sbsHxKt0CQ/s1600/no-image.png",s+="<div class='recentpostel'>",s+="<a href='"+r+"'><img src='"+a+"' /></a>",s+="<h6><a href='"+r+"'>"+n+"</a></h6>",s+="<p>"+lewatinfeed(i,charac)+"</p>",s+="</div>"}document.getElementById("recentpostsae").innerHTML=s,s="",s+=urlprevious?"<a href='javascript:navigasifeed(-1);' class='previous'><i class='fas fa-arrow-left'></i></a>":"<span class='noactived previous'><i class='fas fa-arrow-left'></i></span>",s+=urlnext?"<a href='javascript:navigasifeed(1);' class='next'><i class='fas fa-arrow-right'></i></a>":"<span class='noactived next'><i class='fas fa-arrow-right'></i></span>",s+="<a href='javascript:navigasifeed(0);' class='home'><i class='fas fa-home'></i></a>",document.getElementById("recentpostnavfeed").innerHTML=s}function navigasifeed(e){var t,n;-1==e?(t=urlprevious.indexOf("?"),n=urlprevious.substring(t)):1==e?(t=urlnext.indexOf("?"),n=urlnext.substring(t)):n="?start-index=1&max-results="+numfeed+"&orderby=published&alt=json-in-script",n+="&callback=showrecentpostsae",incluirscript(n)}function incluirscript(e){1==startfeed&&removerscript(),document.getElementById("recentpostsae").innerHTML="<div id='recentpostload'></div>",document.getElementById("recentpostnavfeed").innerHTML="";var t=urlblog+"/feeds/posts/default"+e,n=document.createElement("script");n.setAttribute("type","text/javascript"),n.setAttribute("src",t),n.setAttribute("id","lewatinlabel"),document.getElementsByTagName("head")[0].appendChild(n),startfeed=1}function removerscript(){var e=document.getElementById("lewatinlabel"),t=e.parentNode;t.removeChild(e)}onload=function(){navigasifeed(0)};
//]]>
</script> 

jangan lupa untuk mengganti domain yang berwarna oren tersebut dengan alamat domain kamu dan setelah itu klik publiskasikan.

Maka untuk hasil nya adalah seprti gambar di bawah ini :

Mudah bukan caranya, Nah seperti itulah cara membuat sitemaps seperti blog arlinadzgn dengan mudah jangan lupa untuk membagikan artikel ini ke media sosial kamu guna membangun website ini agar dapat memberikan informasi lainnya seputar script, template dan lain-lain kepada semua. terima kasih