Cara Membuat Daftar Isi (Sitemap) Blog Accordion Keren Berdasarkan Label
Cara Membuat Daftar Isi (Sitemap) Blog Accordion Keren Berdasarkan Label - Table of Content (ToC), atau Peta Situs Sitemap adalah halaman blog berisi indeks atau daftar posting. Contohnya bisa dilihat di Sitemap.
Fungsi widget daftar isi ini sebagai internal link dan navigasi blog yang memudahkan pembaca mencari tulisan yang dibutuhkan. Halaman statis sitemap ini bisa meningkatkan page views. Banyak sekali jenis desan tampilan sitemap/daftar isi blogger, salah satunya dari DTE bernama daftar isi akordion (accordion table of content) seperti ini :
Anda masih bisa utak-atik atau edit warnanya di kode css. Model sitemap
blogger ini dinamakan 'Tabel Konten Akordion dengan Sortir Label' karena
disortir berdasarkan kategori posting.
Cara Membuat Daftar Isi (Sitemap) Blog Accordion
1. Buat halaman baru: Page > New Page/ bisa juga entri baru
2. Klik mode HTML
3. Copas kode berikut ini :
<link rel="stylesheet"
href="//cdn.rawgit.com/tovic/dte-project/0ef9de902cf286a77272f9b3c6f8168c17ab61c6/accordion-toc-skin.css"/>
<div id="table-of-content" class="table-of-content"><span class="loading">Memuat...</span></div>
<div class="credit-link"><a href="//www.dte.web.id/2012/02/widget-daftar-isi-akordion-dengan.html" title="Accordion TOC by Taufik Nurrohman">▶ Accordion TOC</a></div>
<script>
var toc_config = {
url: 'http://pusatbacklinks.blogspot.com',
containerId: 'table-of-content',
showNew: 10,
newText: ' – <strong style="font-weight:bold;font-style:italic;color:red;">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="//cdn.rawgit.com/tovic/dte-project/0ef9de902cf286a77272f9b3c6f8168c17ab61c6/accordion-toc-1.js"></script>
<div id="table-of-content" class="table-of-content"><span class="loading">Memuat...</span></div>
<div class="credit-link"><a href="//www.dte.web.id/2012/02/widget-daftar-isi-akordion-dengan.html" title="Accordion TOC by Taufik Nurrohman">▶ Accordion TOC</a></div>
<script>
var toc_config = {
url: 'http://pusatbacklinks.blogspot.com',
containerId: 'table-of-content',
showNew: 10,
newText: ' – <strong style="font-weight:bold;font-style:italic;color:red;">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="//cdn.rawgit.com/tovic/dte-project/0ef9de902cf286a77272f9b3c6f8168c17ab61c6/accordion-toc-1.js"></script>
Catatan: Pastikan di template blog Anda sudah ada link ke kode jQuery seperti ini:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
Jika belum ada, pasang di atas kode </head>
4. Ubah alamat blognya.
5. Save! Beres.
Demikian artikel berjudul Cara Membuat Daftar Isi (Sitemap) Blog Accordion Keren Berdasarkan Label. Semoga Bermanfaat Good Luck & Happy Blogging!
Sumber : http://www.contohblog.com