Cara Membuat Daftar Isi Keren Dengan Pilihan Sortir
Cara Membuat Daftar Isi Keren Dengan Pilihan Sortir
Daftar isi atau sitemap adalah daftar semua artikel yang
terangkum di satu halaman, maka sangat penting sekali bagi anda untuk
memasang sebuah dafar isi blog untuk memudahkan pengunjung mencari
artikel yang mereka cari, tutorial membuat daftar isi yang saya ambil
dari DTE ini adalah daftar isi dengan pilihan sortir atau sebuah table
menggunakan pilihan sortir berdasarkan label dan abjad, jadi dari sini
ada pilihan khusus, sitemap atau daftar isi seperti ini juga ringan
untuk digunakan.
Gambar di atas adalah contoh gambar atau daftar isi dengan pilihan
berdasarkan sortir atau jika ingin melihat langsung silahkan klik tombol
demo, untuk cara membuat daftar isi pilihan sortir silahkan ikuti
tutorialnya.
Lihat Contoh gambar :
Ganti URL http://www.madamvia.web.id/ dengan url blog anda dan klik "Publish"
Sekian tutorial cara membuat daftar isi dengan pilihan sortir, Semoga bermanfaat :)
Cara Membuat Daftar Isi Dengan Pilihan Sortir
1. Buka akun blogger anda.
2. Pilih menu laman > Klik Laman baru
Lihat contoh gambar :
3. Selanjutnya Pilih mode HTML dan paste Code di bawah ini di kolom tersebut.
<style>
#tocTable {
border:2px solid white;
font:normal normal 11px/normal Verdana,Tahoma,Arial,Sans-Serif;
color:#333;
border-collapse:collapse;
text-align:left;
margin:0 0 5px;
}
#tocTable th,
#tocTable td {
border:1px solid white;
background-color:#fafafa;
padding:10px 15px;
}
#tocTable th {
background-color:#5d5d5d;
font-weight:bold;
color:white;
text-shadow:0 1px 0 rgba(0,0,0,.3);
}
#th-1 {
width:60%;
background-color:#5A930D;
}
#th-2,#th-3 {width:20%}
#tocTable td.toc-header-col-1,
#tocTable td.toc-header-col-2 {
padding:0 !important;
background-color:#2372A7;
}
#tocTable td.toc-header-col-3 {background-color:#D7DEF0}
#tocTable a {
display:block;
text-decoration:none;
color:white;
padding:10px 15px;
background:none;
}
#tocTable td.toc-header-col-1:hover,
#tocTable td.toc-header-col-2:hover {
background-color:#174B6F;
-webkit-box-shadow:inset 0 0 3px rgba(0,0,0,.4);
-moz-box-shadow:inset 0 0 3px rgba(0,0,0,.4);
box-shadow:inset 0 0 3px rgba(0,0,0,.4);
}
#tocSort {
display:block;
width:220px;
font:normal bold 12px/normal Verdana,Tahoma,Arial,Sans-Serif;
color:#333;
cursor:pointer;
border:none;
outline:none;
background-color:#eee;
margin:0 0 2px 0;
padding:5px;
}
</style>
<script>
var theTotalPosts = 9999, // Tentukan jumlah maksimal posting
theOptions = "Sortir...", // Label opsi 1
theSortPosts = "Sortir berdasarkan Abjad", // Label opsi 2
theSortLabels = "Sortir berdasarkan Label", // Label opsi 3
theTitles = "Judul Artikel", // Header tabel 1
theLabels = "Label Artikel", // Header tabel 2
theDates = "Bulan Terbit", // Header tabel 3
theBlankLabels = "Tak Berlabel", // Label kosong
theSiteUrl = "http://www.madamvia.web.id"; //
</script>
<script src="http://dte-project.googlecode.com/svn/trunk/toc-table-sort.js"></script>
Lihat Contoh gambar :
Ganti URL http://www.madamvia.web.id/ dengan url blog anda dan klik "Publish"
Sekian tutorial cara membuat daftar isi dengan pilihan sortir, Semoga bermanfaat :)
0 Response to "Cara Membuat Daftar Isi Keren Dengan Pilihan Sortir"
Post a Comment