Cara Membuat Tabel di Urutkan berdasarkan Nilai

Pada Tutorial kali ini akan Saya paparkan bagaimana Cara Membuat Tabel di Urutkan berdasarkan Nilai. Mungkin di antara Anda mempunyai sebuah Web atau Blog yang isi nya berupa Konten Tabel Nilai Mata Uang, Nilai Ujian, Daftar Harga suatu Produk ataupun Daftar lain nya. Maka dari itu Tutor ini bisa saja membantu Anda, biar Web atau Blog Anda terkesan lebih profesional. Di mana Nilai yang ditampilkan bisa berubah pada saat pengunjung melihat nya. Nilai nya bisa saja dari Nomor Urut dari tabel ataupun dari keterangan yang ada pada Tabel itu sendiri. Untuk lebih jelasnya perhatikan contoh Live Demo di bawah ini:Ok..Kode apa saja yang kita butuhkan agar Tutor ini bisa bekerja. Silahkan ikuti langkah-langkah di bawah ini:

Langkah 1:

1. Masuk akun blogger lalu pilih menu Rancangan > Edit Html
2. Jangan Lupa backup dulu template Blog, Jika belum tahu Baca di sini
3. Jangann lupa klik ‘Expand Widget Templates’
4. Cari kode </head>
Letakkan kode dibawah ini diatas langkah Kode pada langkah no.4

<script type="text/javascript" src="http://lightboxdroni.googlecode.com/files/sortable.js"></ script>

5. Silahkan Save template.
Jika kode yang Anda simpan tidak Well-Formed, Silahkan parse dulu kode nya di sini.

Langkah 2:
Kemudian Copas Kode di bawah ini dan masukkan kedalam Postingan atau Sidebar Anda:

<center><table border="1" class="sortable" id="anyid">
<tr>
<th>Nomor</th>
<th>Alphabet</th>
<th>Tanggal</th>
<th>Mata Uang</th>
<th class="Keterangan">Keterangan</th>
</tr>
<tr>
<td>1</td>
<td>Z</td>
<td>01-01-2012</td>
<td>Rp 5.000</td>
<td>Tidak Ada</td>
</tr>
<tr>
<td>2</td>
<td>y</td>
<td>04-13-2011</td>
<td>Rp 6.500</td>
<td>Tidak Ada</td>
</tr>
<tr>
<td>3</td>
<td>X</td>
<td>08-17-2010</td>
<td>Rp 6.550</td>
<td>Tidak Ada</td>
</tr>
<tr>
<td>4</td>
<td>w</td>
<td>01-01-2009</td>
<td>Rp 4.200</td>
<td>Tidak Ada</td>
</tr>
<tr>
<td>5</td>
<td>V</td>
<td>05-12-2010</td>
<td>Rp 7.105</td>
<td>Tidak Ada</td>
</tr>
<tr class="sortbottom">
<td>15</td>
<td></td>
<td></td>
<td>Rp 29.400</td>
<td></td>
</tr>
</table></center>

Silahkan Ganti Nilai atau Angka yang ada pada Contoh ini dengan Nilai yang Anda Punya. Demikian lah Tutorial dari Saya kali ini, Semoga bermamfaat.