Cara Membuat Sitemap/Daftar Isi Berdasarkan Label di statis Blog – Widget Sitemap adalah sebuah wdiget yang menampilkan keseluruhan Link Artikel pada Sebuah blog atau website dengan kategori yang berbeda-beda setiap artikelnya. Sitemap ini sangatlah perlu atau wajib ada di sebuah blog. fungsi sitemap ini adalah memberikan kemudahan bagi pengunjung untuk mencari keseluruhan artikel di sebuah blog dengan sangat mudah karena terangkum dalam satu halaman saja. Keuntungan bagi blogger yang di dapat adalah ladang Page View atau menambah jumlah pengunjung yang sangat banyak.
Maka dari itu kali ini saya akan berikan cara membuat sitemap atau daftar Isi di Blog sobat berdasarkan Label yang dapat memudahkan dan menata nya dengan rapi Otomatis. Bagi sobat yang tertarik memasangnya atau tertarik untuk mempelajari nya silahkan simak cara membuatnya berikut ini.
Baca Juga : Cara Terbaru Daftar Google Adsense Dari Blog
Baca Juga : Cara Terbaru Daftar Google Adsense Dari Blog
1. buka Blog Sobat > masuk menu “Laman” > buat Laman Baru > Beri judul laman baru dengan “Daftar Isi” atau “Sitemap” > kemudian Pilih Tab atau mode HTML (bukan compose) > salin kode di bawah ini dan letakkan di dalam laman yang tadi sobat buat.
<div dir="ltr" style="text-align: left;">
<script src='//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script><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;box-shadow:0 0 0 1px #eee;}
.table-of-content .toc-header{position:relative;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 #eee;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:#fc4f3f 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:#fcfcfc!important;transition:initial;border-bottom:1px solid #e9e9e9;border-top:1px solid #fff;}
.table-of-content li:first-child(border-top:0}
.table-of-content li:last-child(border-bottom:0}
.post ol li a,.post ol li a:link{color:#444!important;text-decoration:none;font-size:86%;transition:initial}
.post ol li a:visited{color:#999;transition:initial}
.post ol li a:link:hover,.post ol li a:visited:hover{color:#fc4f3f;text-decoration:underline;transition:initial}
.post ol li:before{display:none}
ol {text-shadow:initial;}
.post a:link {color:#444 important;}
</style>
<div class="table-of-content" id="table-of-content"><span class="loading">Memuat konten...</span></div><script>
var toc_config = {
url: 'http://www.azmidzgn.blospot.co.id/',
containerId: 'table-of-content',
showNew: 5,
newText: ' <strong style="font-weight:normal;font-style:normal;color:#fff;font-size:11px;background:#fc7569;padding:1px 6px 2px 6px;line-height:normal;float:right;border-radius:3px;text-transform:uppercase;">baru</strong>',
sortAlphabetically: {
thePanel: true,
theList: true
},
maxResults: 9999,
activePanel: 0,
slideSpeed: {
down: 400,
up: 400
},
slideEasing: {
down: null,
up: null
},
slideCallback: {
down: function() {},
up: function() {}
},
clickCallback: function() {},
jsonCallback: '_toc',
delayLoading: 0
};
</script><br />
<script src="//googledrive.com/host/0B8a75E285BMHV3VMNHlrRTF3YzA"></script>
</div>
NB : kode dengan tulisan tebal adalah kode jQuery librari, jika kode ini sudha ada di template sobat tidak usah sobat pasang kembali di sini.
Kode yang di tandai dengan warna merah ganti dengan alamat url blog sobat.
2. terakhir simpan dan Publikasikan, lihat hasilnya. Saya yakin jika sobat mengikuti tutorial di atas dengan benar maka halaman sitemap sudah dapat tampil dengan benar.
Demikianlah tutorial mengenai Cara Membuat Sitemap/Daftar Isi Berdasarkan Label di statis Blog, yang harus di ketahui. jika sobat ada masalah atau sudah berhasil jangan lupa untuk mengisi Kotak komentar di bawah ini. Semoga artikel ini dapat menjadi ilmu yang bermanfaat.
0 Komentar