Script Sitemap Atau Daftar Isi Blog Otomatis Aktif Responsif

Sekilas warta mengenai script daftar isi yang saya gunakan untuk Blog . Terlihat ibarat gambar di bawah, memakai script daftar isi yang masih aktif dan responsif.

Script Sitemap Atau Daftar Isi Blog Otomatis Aktif Responsif

Untuk memudahkan pengunjung dalam menelusuri isi blog yang kita kelola, secara umum para blogger memasang daftar isi atau sering juga disebut sitemap untuk blognya. Karena itu saya juga menciptakan daftar isi untuk blog menulis catatan. Dalam prakteknya beberapa hambatan yang ditemukan dalam menciptakan daftar isi otomatis di blog memakai script, terkadang kita memakai script yang tidak aktif, sehingga pada ketika publish daftar isi blog yang telah dibentuk tersebut hanya tampil goresan pena "memuat...."

Sobat blogger mesti cermat dalam memakai script daftar isi, mesti diuji coba terlebih dahulu. Saya sendiri mengalami beberapa kali hambatan sitemap tidak tampil di blog. Mengatasi dilema ini, pergantian script dan uji coba publih sitemap atau daftar isi blog saya lakukan secara berulang hingga berhasil.

Meski tampilan sitemap sederhana namun sangat bermanfaat untuk blog, ada beberapa script yang secara tampilan menarik namun ketika dipergunakan untuk blog, sriptnya tidak aktif. Maklum saya tidak paham dalam pembuatan script. Kaprikornus berterima kasihlah pada sobat - sobat blogger yang telah mengembangkan script sitemap atau daftar isi secara gratis. Daftar isinya juga responsif dan scriptnya masih bekerja dengan baik.

Untuk memasang daftar isi / sitemap di blog, caranya sangat mudah. Dengan login di blogger, kemudian buat page atau halaman dengan judul Dafar isi atau Sitemap, terserah pilihan anda. Dalam mode html, pasanglah script sitemap/daftar isi di bawah ini, kemudian publish. Silakan lihat hasilnya.

• Perhatikan goresan pena warna merah, silakan ganti dengan alamat blog sobat

<div dir="ltr" style="text-align: left;" trbidi="on">

<style scoped="" type="text/css"> .table-of-content{background-color:#fff;color:#444;font-family:Verdana,Geneva,Tahoma,Arial,Sans-serif;font-size:13px;font-weight:400;overflow:hidden;border-radius:4px;box-shadow:0 0 10px rgba(0,0,0,.2)} .table-of-content .toc-header{color:#444;font-family:inherit;font-weight:400;font-size:14px;background-color:#fff;margin:0;padding:15px;overflow:hidden;cursor:pointer;border-bottom:1px solid #ccc;transition:initial} .table-of-content .toc-header:hover{background-color:#fdfdfd} .table-of-content .toc-header:before{content:'';width:0;height:0;position:absolute;top:22px;right:15px;border:5px solid transparent;border-color:#aaa transparent transparent;transition:all .3s ease} .table-of-content .toc-header.active{color:#fc4f3f} .table-of-content .toc-header.active:before{border-color:#666 transparent transparent;top:16px;-webkit-transform:rotate(-180deg);-moz-transform:rotate(-180deg);-ms-transform:rotate(-180deg);-o-transform:rotate(-180deg);transform:rotate(-180deg)} .table-of-content .loading{display:block;padding:15px;text-decoration:blink} .table-of-content ol{margin:0;padding:0;list-style:none;transition:initial} .table-of-content li{line-height:normal!important;margin:0!important;padding:8px 8px 8px 15px!important;white-space:nowrap;text-align:left;overflow:hidden;background:#444359!important;transition:initial} .table-of-content a{color:#d9d9d9;text-decoration:none;font-size:86%;transition:initial} .table-of-content a:visited{color:#a2a2a9;transition:initial} .table-of-content a:hover,.table-of-content a:visited:hover{color:#ffc937;text-decoration:none;transition:initial} .post ol li:before{display:none} </style> <br />

<div class="table-of-content" id="table-of-content">

<span class="loading">Memuat konten...</span></div>

<script> var toc_config = { url: 'https://tulisan78.blogspot.co.id/', containerId: 'table-of-content', showNew: 15, newText: ' <strong style="font-weight:normal;font-style:normal;color:#fff;font-size:11px;background:#5c5a78;padding:1px 6px 3px 6px;line-height:normal;float:right;border-radius:3px;">baru</strong>', sortAlphabetically: { thePanel: true, theList: true }, maxResults: 9999, activePanel: 1, slideSpeed: { down: 400, up: 400 }, slideEasing: { down: null, up: null }, slideCallback: { down: function() {}, up: function() {} }, clickCallback: function() {}, jsonCallback: '_toc', delayLoading: 0 }; </script> <script src="https://rawgit.com/ardycool/sitemapku/master/sitemap.js"></script>

</div>

Hasil Daftar Isi terlihat ibarat di bawah ini :

Memuat konten...

Script Sitemap Atau Daftar Isi Blog Otomatis Aktif Responsif ini saya temukan di : http://jalan-lah.blogspot.com/search?q=script-sitemap-atau-daftar-isi-blog-otomatis-aktif-responsif?m=1 dan mohon ijin untuk menggunakannya.

Share this post