
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.
ok mbak manta mantap, terima kasih.
BalasHapusMbak request tutorial daftar isi yang ada di
BalasHapushttps://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
penghasilan kakak berapa yah perbulan?
BalasHapusG ada tutor seperti di igniel untuk "tampilan grid dan list" ?
BalasHapusApa pake jquery addclass / remove / toggle kak ?
Nggak ada.
HapusPake apa kak... klo boleh tau sistem jquerynya aja
HapusGrid 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
HapusSengaja. Tampilan utama blog ini grid. Bukan list.
Hapusmbak, buat agar scriptnya bisa di hosting dong, biar bisa saya pakai di blog AMP menggunakan iframe
BalasHapusrequest mbak ,buat utk bbrp label buat fitur ngeshort gitu, cth label "Film Indonesia" dan tahun "2016"
BalasHapuskak nanya dong, itu yang buat bikin tulisan javascript jadi seperti kode tanda baca yang panjang namanya apa ya?
BalasHapusHi Igniel..
BalasHapusI 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
dibuat list kecil + 2 kolom bisa gak mbak? biat gak kepanjangan.
BalasHapuskaya gini
https://4.bp.blogspot.com/-gK0Hk3S9pIg/XINWXaGnQKI/AAAAAAAAAKM/At8Gen4rpJAdFduelxlLs8KIXrV09cP5ACLcBGAs/s1600/Untitled.png
Tinggal edit CSSnya. Silakan diulik.
Hapuskalo mau isi thumbnail gmn caranya mbak?
BalasHapusMbak request
BalasHapusList postingan perlabel tapi ada abjad nya
Kn soalnya di anime ada movie, ova sama episode
Hampir kayak yg ni
Hapushttps://www.igniel.com/2019/02/sitemap-daftar-isi-navigasi-per-huruf.html?m=1
Tetapi listnya lanya 1 label kayak postingan yg saya kunjungi ini
Hapusbiar sesuai abjad gimana mbak?
BalasHapusmantul mba.
BalasHapusscriptnya udh ngga jalan ta ? ko loading terus..?
BalasHapuseh jadi :V
Hapuskok saya loading terus?
Hapusmantap hu
BalasHapusmba cara biar per abjad gimna
BalasHapusMantul banget, tampilan blog jadi makin keren
BalasHapusMin kalo misal numberingnya pake bullet/ngga ada bullet/numbering sama sekali gimana?
BalasHapusterus sama kalo urutannya terlama sampe terbaru (perlu kalo itu blog manga/novel yg pake chapter2) bisa ngga min?
oh iya ini juga pengen aku tanyain, kalo bikin tombol next/prev post tapi di 1 label itu gimana ya?
makasih banget min ilmunya..(y)
mba' bisa g' daftar isinya disertai gambar thunbail?
BalasHapusCara agar susunannya postnya dari yang lama ke yang baru gimana ya?
BalasHapusMbak biar tabelnya bisa di scroll, caranya bagiamana?
BalasHapus