Menampilkan Judul Sitemap Sesuai dengan Alphabet

Postingan Kali Ini admin akan berbagi mengenai seputar sitemap ,Apasih Sitemap itu Berikut Penjelasanya .

Sitemap Atau Peta Situs adalah sebuah widget blog yang akan mempermudah pengunjung mengetahui Isi dari stus kita Tentunya selain dengan Navigasi.

Sitemap Yang akan admin bagikan kali ini tentunya sangat Fast Load dan Responsive ,Di tambah dengan Susunan Judulnya yang sesuai abjad membuat sitemap ini menjadi wah dan semakin mudah di baca Oleh pengunjung.

Saya Sangat berterimakasih kepada Mbak Igniel Selaku pemilik Blog Igniel.com Karena telah membuat sitemap yang sangat Simple,dan mudah di mengerti ini.

Oke Langsung Saja Kita Ke Tahap Pembuatan Sitemap Ini 

1.Pertama Login Ke akun Blogger Kalian Masing-masing
2.Masuk ke mode EDIT HTML Dan letakkan Kode Berikut tepat di atas ]]><b:skin>atau</style>

/*
Blogger Sitemap Simple Title Only Sort By Title (Alphabetically)
Original Post: https://www.igniel.com/2019/02/sitemap-daftar-isi-hanya-judul-abjad.html
*/
#sitemap4 .judul {font-size:150%; background-color:#008c5f; color:#fff; font-weight:500; text-align:center; margin-bottom:20px; padding:15px;}
#sitemap4 a {color:#666; text-decoration:none; transition:all .3s ease;}
#sitemap4 a:hover {color:#000;}
#sitemap4 ol {margin:0px; padding:0px;}
#sitemap4 ol li {color:#666; font-weight:300; list-style-type:decimal; margin:0px; padding:10px; line-height:1.5em; -webkit-margin-start:40px !important;}

BODY {max-width:800px; padding:10px; margin:auto; font-family: 'Roboto Condensed', sans-serif; font-size:14px;}

Lalu Pasang Kode berikut di Halaman Statis.Dalam Mode HTML Bukan Compose

<!--
Blogger Sitemap Simple Title Only Sort By Title (Alphabetically)
Original Post: https://www.igniel.com/2019/02/sitemap-daftar-isi-hanya-judul-abjad.html
-->
<div id="sitemap4">Loading....</div>
<script> //<![CDATA[
/* Blogger Sitemap Simple Title Only */
var start=1;var max=150;var sitemap4Arr=new Array();function runSitemap4(){var scpt=document.createElement('script');scpt.src='https://idtemplatez.blogspot.com/feeds/posts/summary?alt=json&callback=sitemap4&start-index='+start+'&max-results='+max;document.body.appendChild(scpt)} function sitemap4(root){var elem=document.getElementById('sitemap4');if(!elem)return;elem.innerHTML='';var feed=root.feed;if(feed.entry.length>0){for(var i=0;i0&&title&&title.length>0){sitemap4Arr.push({'url':url,'judul':title})}
break}}} if(feed.entry.length>=max){start+=max;runSitemap4()} else{var print='',a=sitemap4Arr.sort(function(a,b){return a.judul>b.judul?1:-1});for(var x=0;x'+a[x].judul+'
'} elem.innerHTML='


Total Post: '+a.length+'
'+print+'
'}}} runSitemap4();
//]]> </script>

Simpan Dan Lihat Hasilnya

Script di atas Murni menggunakan Javascript dan bukan Jquery.

Bagi Kalian Yang Penasaran Saya Memberikan demonya sebagai berikut:

DEMO