Cara Membuat Daftar Isi Sesuai Abjad dan Jumlah Komentar

Sobat. Salah satu aspek penting yang dijadikan acuan pokok Google dalam memberikan penilaian terhadap sebuah situs atau blog adalah adanya beberapa faktor. 

Faktor penting di sini ada bebera hal, salh satunya adalah tersediannya menu Daftar Isi atau lebih kita kenal Sitemap.

Pentingkah Daftar Isi atau Sitemap kita buat di dalam sebuah blog?

Daftar isi atau sitemap adalah data gambaran secara umum dan terperinci mengenai setiap judul artikel yang kita tulius dan posting. Sehingga, data tersebut akan sangat membantu kepada pembaca untuk menelusuri semua isi situs atau blog kita. 

Tentu hal itu sangat memberikan kontribusi yang sangat besar terhadap peningkatan kualitas blog kita dipandang dari segi kenyamanan pengunjung, atau lebih kita kenal user friendly.

Untuk itu, disini akan saya coba memberikan tips bagaimana cara membuat daftar isi di dalam sebuah situs atau blog.

1. Daftar Isi Berdasar Abjad dan Jumlah Komentar
Caranya cukup mudah, yaitu:
1. Masuk akun blogger
2. Pilih Newpage (post baru) > mode HTML
3. Copy dan paste kode di bawah ini di dalam konten yang baru dibuat tersebut:

<script type="text/javascript">
function getYpipeTL(feed) {
 document.write('<ul style="font-weight:bold">');
 var i;
 for (i = 0; i < feed.count ; i++)
 {
var href = "'" + feed.value.items[i].link + "'";
var pTitle = feed.value.items[i].title;
var pComment = " \(" + feed.value.items[i].commentcount + " comments\)";
var pList = "<li>" + "<a href="+ href + '" target="_blank">' + pTitle;
 document.write(pList);
 document.write(pComment); //to remove comment count delete this line
 document.write('</a></li>');
 }
 document.write('</ul>');
 }
 </script>
 <script src="http://pipes.yahoo.com/pipes/pipe.run?
 YourBlogUrl=http://forumblogindo.blogspot.com
 &Order=alphabet
 &_id=401e43055731c1a29f1e1d3eb5e8e13f
 &_callback=getYpipeTL
 &_render=json"
type="text/javascript"></script>

Note: ganti warna merah dengan alamat url blog sobat dan isi judul dengan Daftar Isi atau Sitemap

Live Demo

4. Publish (publikasikan)

Mudah bukan?

2. Daftar Isi Tabulasi

Daftar isi (sitemap) kedua ini berdasarkan tabulasi seperti yang digunakan dalam blog ini. Caramembuatnya sama dengan cara di atas, namun kodenya yang berbeda. Silakan ikuti langkah di atas dan Copas kode di bawah ini:

<link rel="stylesheet" href="http://dte-project.googlecode.com/svn/trunk/tabbed-toc-skin.css"/>
<div id="tabbed-toc"><span class="loading">Memuat...</span></div>
<script>
var tabbedTOC = {
blogUrl: "http://forumblogindo.blogspot.com", // Blog URL
containerId: "tabbed-toc", // Container ID
activeTab: 1, // The default active tab index (default: the first tab)
showDates: false, // `true` to show the post date
showSummaries: false, // `true` to show the posts summaries
numChars: 200, // Number of summary chars
showThumbnails: false, // `true` to show the posts thumbnails (Not recommended)
thumbSize: 40, // Thumbnail size
noThumb: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAA3NCSVQICAjb4U/gAAAADElEQVQImWOor68HAAL+AX7vOF2TAAAAAElFTkSuQmCC", // A "no thumbnail" URL
monthNames: [ // Array of month names
"Januari",
"Februari",
"Maret",
"April",
"Mei",
"Juni",
"Juli",
"Agustus",
"September",
"Oktober",
"November",
"Desember"
],
newTabLink: true, // Open link in new window?
maxResults: 99999, // Maximum post results
preload: 0, // Load the feed after 0 seconds (option => time in milliseconds || "onload")
sortAlphabetically: true, // `false` to sort posts by published date
showNew: 7, // `false` to hide the "New!" mark in most recent posts, or define how many recent posts are to be marked
newText: " - <em style='color:red;'>New!</em>" // HTML for the "New!" text
};
</script>
<script src="http://dte-project.googlecode.com/svn/trunk/tabbed-toc.js"></script>

Jangan lupa ganti alamat url yang saya beri warna merah dengan alamat url Sobat.

Live Demo

Demikian tips membuat daftar isi sesuai abjad dan jumlah komentar kali ini. Semoga menambah kualitas blog Sobat masing-masing.

Goodluck.

Sumber:

http://contohblognih.blogspot.com/2015/07/daftar-isi-blog-berdasarkan-abjad.html