Sitemap (Daftar Isi) Blogger di Halaman Statis Hanya Satu Label Saja

Sitemap Daftar Isi Blogger di Halaman Statis Hanya Satu Label Saja

Sitemap ini bertujuan untuk menampilkan daftar isi dengan satu label yang spesifik. Tadinya saya pikir tidak ada yang mau menampilkan sitemap hanya dari satu label tertentu doang, eh ternyata ada beberapa orang yang request. Dan tidak perlu khawatir sitemap akan mentok 150 judul saja seperti yang dikeluhkan oleh mereka yang request. Katanya banyak tutorial untuk menampilkan daftar isi hanya satu label di luaran sana yang judulnya tidak tampil semua. Nah di script buatan igniel.com ini semua judul akan muncul.

Langkah pertama, tambahkan kode CSS berikut DI ATAS </style> atau ]]></b:skin>.

/* Blogger Sitemap One Label Title Only by igniel.com */
#sitemap6 {font-size:14px; font-weight:400;}
#sitemap6 .judul {font-size:150%; background-color:#008c5f; color:#fff; font-weight:600; text-align:center; margin-bottom:20px; padding:15px;}
#sitemap6 a {color:#666; text-decoration:none; transition:all .3s ease;}
#sitemap6 a:hover {color:#000;}
#sitemap6 ol {margin:0px; padding:0px;}
#sitemap6 ol li {color:#666; list-style-type:decimal; margin:0px; padding:10px; line-height:1.5em; -webkit-margin-start:40px !important;}

Langkah berikutnya buatlah sebuah halaman statis (page) baru dan langsung salin semua kode di bawah ini ke dalam text editor. Pastikan memilih mode HTML, bukan Compose. Kodenya murni Javascript ya, tidak perlu jQuery.

<div id="sitemap6">Loading....</div>
<script> //<![CDATA[
/* Blogger Sitemap One Label Title Only by igniel.com */
var label = 'Blogger';
var text = 'Total post with label';
var sortby = 'date'; /* 'date' OR 'title' */

eval(function(p,a,c,k,e,d){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--){d[e(c)]=k[c]||e(c)}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('i a=["\\f\\v\\g\\h\\r\\d","\\v\\g\\b\\e\\d\\b\\1f\\c\\b\\B\\b\\l\\d","\\f\\g\\v","\\m\\w\\b\\b\\j\\f\\m\\r\\u\\f\\d\\f\\m\\j\\b\\w\\e\\k\\c\\d\\m\\S\\m","\\1q\\e\\c\\d\\q\\I\\f\\u\\l\\R\\v\\e\\c\\c\\Z\\e\\v\\1c\\q\\f\\h\\d\\b\\B\\e\\r\\1a\\R\\f\\d\\e\\g\\d\\S\\h\\l\\j\\b\\1g\\q","\\R\\B\\e\\1g\\S\\g\\b\\f\\k\\c\\d\\f\\q","\\e\\r\\r\\b\\l\\j\\1y\\x\\h\\c\\j","\\Z\\u\\j\\P","\\f\\h\\d\\b\\B\\e\\r\\1a","\\W\\b\\d\\1f\\c\\b\\B\\b\\l\\d\\1C\\P\\1B\\j","\\h\\l\\l\\b\\g\\1A\\1z\\1D\\1E","","\\w\\b\\b\\j","\\c\\b\\l\\W\\d\\x","\\b\\l\\d\\g\\P","\\1K\\d","\\d\\h\\d\\c\\b","\\c\\h\\l\\1c","\\g\\b\\c","\\e\\c\\d\\b\\g\\l\\e\\d\\b","\\x\\g\\b\\w","\\r\\k\\f\\x","\\I\\k\\j\\k\\c","\\f\\u\\g\\d","\\p\\c\\h\\o\\p\\e\\y\\x\\g\\b\\w\\q\\t","\\k\\g\\c","\\t\\y\\d\\h\\d\\c\\b\\q\\t","\\t\\o","\\p\\m\\e\\o\\p\\m\\c\\h\\o","\\p\\j\\h\\Y\\y\\v\\c\\e\\f\\f\\q\\t\\I\\k\\j\\k\\c\\t\\o","\\y","\\1h\\y","\\p\\m\\j\\h\\Y\\o\\p\\u\\c\\o","\\p\\m\\u\\c\\o"];i T=1,H=1G,K=1F 1H();V M(){i U=O[a[1]](a[0]);U[a[2]]=a[3]+1b+a[4]+T+a[5]+H;O[a[7]][a[6]](U)}V 1x(X){i J=O[a[9]](a[8]);C(!J){1d};J[a[10]]=a[11];i A=X[a[12]];C(A[a[14]][a[13]]>0){N(i G=0;G<A[a[14]][a[13]];G++){i D=A[a[14]][G];i E=D[a[16]][a[15]];N(i z=0;z<D[a[17]][a[13]];z++){C(D[a[17]][z][a[18]]==a[19]){i F=D[a[17]][z][a[1o]];C(F&&F[a[13]]>0&&E&&E[a[13]]>0){K[a[1I]]({"\\k\\g\\c":F,"\\I\\k\\j\\k\\c":E})};1l}}};C(A[a[14]][a[13]]>=H){T+=H;M()}1i{i Q=a[11],n;i n=(1J===a[16]?K[a[1w]](V(n,1e){1d n[a[L]]>1e[a[L]]?1:-1}):K);N(i s=0;s<n[a[13]];s++){Q+=a[1L]+n[s][a[1v]]+a[1s]+n[s][a[L]]+a[1k]+n[s][a[L]]+a[1j]};J[a[10]]=a[1u]+1m+a[1t]+1b+a[1r]+n[a[13]]+a[1n]+Q+a[1p]}}}M()',62,110,'||||||||||_0x73e9|x65|x6C|x74|x61|x73|x72|x69|var|x64|x75|x6E|x2F|_0x6718x10|x3E|x3C|x3D|x70|_0x6718x12|x22|x6F|x63|x66|x68|x20|_0x6718xd|_0x6718x9|x6D|if|_0x6718xb|_0x6718xc|_0x6718xe|_0x6718xa|max|x6A|_0x6718x8|sitemap6Arr|22|runSitemap6|for|document|x79|_0x6718xf|x26|x2D|start|_0x6718x5|function|x67|_0x6718x7|x76|x62|||||||||||x36|label|x6B|return|_0x6718x11|x45|x78|x3A|else|28|27|break|text|32|20|33|x3F|31|26|30|29|25|23|sitemap6|x43|x54|x48|x49|x42|x4D|x4C|new|150|Array|21|sortby|x24|24'.split('|'),0,{}));
//]]> </script>

Value Keterangan
var label Label yang ditampilkan. CASE SENSITIVE! Pastikan penulisannya sama persis dengan label di Blogger mulai dari huruf besar, kecil, spasi, dan tanda baca.
var text Tulisan di judul.
var sortby Jenis pengurutan.
'date': berdasarkan tanggal posting, mulai dari terbaru sampai terlama.
'title: berdasarkan abjad mulai dari A zampai Z.

Setelah selesai, jangan lupa publikasikan halaman dan hasilnya akan seperti demo di Codepen saya.



Apa kamu punya request tutorial lain? Tuliskan di kolom komentar. Kalau sanggup dan sempat akan saya buatkan. Semoga tutorial membuat daftar isi hanya satu label di Blogspot ini bisa membantu meski hanya sedikit.

Baca Juga
DONASI VIA PAYPAL Bantu berikan donasi jika artikelnya dirasa bermanfaat. Donasi akan digunakan untuk memperpanjang domain www.igniel.com. Terima kasih.

Artikel Terkait

22 Komentar

  1. ok mbak manta mantap, terima kasih.

    ReplyDelete
  2. Mbak request tutorial daftar isi yang ada di
    https://www.igniel.com/2019/02/sitemap-daftar-isi-navigasi-per-huruf.html

    Tapi hanya untuk satu label, di anime atau manga-kan memiliki beberapa chapter / episode.

    contohnya di anime, judul induknya "boruto", sub judulnya "boruto episode 1, boruto episode 2 danseterusnya".

    jadi kalau menggunakan tutorial itu yang digunakan untuk menunjukkan daftar isi anime, sub judul animenya pun ikutan muncul.

    jadi mohon dibuatkan versi yang hanya menggunakan 1 label saja.

    terima kasih

    ReplyDelete
  3. penghasilan kakak berapa yah perbulan?

    ReplyDelete
  4. G ada tutor seperti di igniel untuk "tampilan grid dan list" ?
    Apa pake jquery addclass / remove / toggle kak ?

    ReplyDelete
    Replies
    1. Pake apa kak... klo boleh tau sistem jquerynya aja

      Delete
    2. Grid list nya gak make cokie... cm addclass aja... jadi setiap ke halaman awal pengunjung harus mengklik list lagi dan lagi untuk selalu ke tampilan list

      Delete
    3. Sengaja. Tampilan utama blog ini grid. Bukan list.

      Delete
  5. mbak, buat agar scriptnya bisa di hosting dong, biar bisa saya pakai di blog AMP menggunakan iframe

    ReplyDelete
  6. request mbak ,buat utk bbrp label buat fitur ngeshort gitu, cth label "Film Indonesia" dan tahun "2016"

    ReplyDelete
  7. kak nanya dong, itu yang buat bikin tulisan javascript jadi seperti kode tanda baca yang panjang namanya apa ya?

    ReplyDelete
  8. Hi Igniel..
    I am your big fan✌
    Now i am facing a problem 😣
    In my #Template. If i visit my site from mobile devices #Comment is not displaying 😭.
    But if i visit my site from Desktop or Computer the Comment box display proparly😐
    .
    .
    Now question is how can i show comment box in mobile devices?
    .
    Please Help me out

    ReplyDelete
  9. dibuat list kecil + 2 kolom bisa gak mbak? biat gak kepanjangan.
    kaya gini
    https://4.bp.blogspot.com/-gK0Hk3S9pIg/XINWXaGnQKI/AAAAAAAAAKM/At8Gen4rpJAdFduelxlLs8KIXrV09cP5ACLcBGAs/s1600/Untitled.png

    ReplyDelete
    Replies
    1. Tinggal edit CSSnya. Silakan diulik.

      Delete
  10. kalo mau isi thumbnail gmn caranya mbak?

    ReplyDelete
  11. Mbak request
    List postingan perlabel tapi ada abjad nya
    Kn soalnya di anime ada movie, ova sama episode

    ReplyDelete
    Replies
    1. Hampir kayak yg ni
      https://www.igniel.com/2019/02/sitemap-daftar-isi-navigasi-per-huruf.html?m=1

      Delete
    2. Tetapi listnya lanya 1 label kayak postingan yg saya kunjungi ini

      Delete
  12. biar sesuai abjad gimana mbak?

    ReplyDelete
  13. scriptnya udh ngga jalan ta ? ko loading terus..?

    ReplyDelete

Gunakan tag HTML <em> untuk menuliskan URL, potongan kode, atau hal penting lainnya.
Contoh: <em>isi pesan</em>