Tabel merupakan salah satu assesoris yang mungkin dapat menjadikan blog kamu tampil lebih menawan. Tapi karena caranya yang agak sedikit sulit, tidak jarang hal ini diabaikan. Tabel dalam optimasi suatu blog berfungsi untuk menguraian kata-kata atau kalimat dalam bentuk kotak-kotak agar lebih mudah dimengerti dan dipahami. Coba ambil contoh dalam postingan area link exchange dan menampilkan kode HTML dalam postingan. Sekarang mari kita telaah secara seksama sebuah illustrasi di bawah ini.
Aku mempunyai 4 (empat) teman dari kelas yang berbeda beda. Si A dan B di kelas 6 kegemarannya makan bakso. Si C berada di kelas 4 sukanya sepak bola. Sedangkan si D di kelas 5, hobbynya tidur melulu.
Dari kalimat di atas seandainya kita buat ke dalam tabel mungkin bentuknya seperti ini.
Aku mempunyai 4 (empat) teman dari kelas yang berbeda beda. Si A dan B di kelas 6 kegemarannya makan bakso. Si C berada di kelas 4 sukanya sepak bola. Sedangkan si D di kelas 5, hobbynya tidur melulu.
Dari kalimat di atas seandainya kita buat ke dalam tabel mungkin bentuknya seperti ini.
Nama Temanku | Kelas | Hobby |
A | 6 | Makan bakso |
B | 6 | Makan bakso |
C | 4 | Sepak bola |
D | 5 | Tidur |
Nah, selanjutnya bagaimana trik blogger membuat tabel seperti di atas ke dalam blog kamu. Singkat kata berikut kode untuk membuat tabel dalam blog.
<table border="1" width="300">
<tr bgcolor="#E0F8E0"><td align="center"><b>Nama Temanku</b></td><td align="center"><b>Kelas</b></td><td align="center"><b>Hobby</b></td></tr>
<tr><td align="center">A</td><td align="center">6</td><td align="left">Makan bakso</td></tr>
<tr><td align="center">B</td><td align="center">6</td><td align="left">Makan bakso</td></tr>
<tr><td align="center">C</td><td align="center">4</td><td align="left">Sepak bola</td></tr>
<tr><td align="center">D</td><td align="center">5</td><td align="left">Tidur</td></tr>
</table>
Catatan :
- Kode dasar dalam tabel adalah <table> ... </table>.
- Kode untuk membuat baris tabel <tr> ... </tr>.
- Kode untuk membuat kolom tabel <td> ... </td>, ingat satu baris bisa terdiri dari beberapa kolom.
- Kode umum yang menyertai dalam kode tabel adalah width (...px), border (...px), align (center, left, right) dan bgcolor (kode warna/#......).
Selamat membuat tabel dalam blog...
biar lebih mudahnya mendingan pake macromedia dreamweaver coi.... ato pake front page.
BalasHapusmmm.. sangant bermanfaat sobat, thanks..
BalasHapusGood job!!!
BalasHapusMas OB thanks ya dah sering mampir ke blog awang.
BalasHapusMas, Tabel Link exchangenya awang contek ya konsepnya. . bingung soalnya mau taruh link di side bar tapi side bar blog saya terbatas bgt mas. .
Matur thank u mas OB. .
Salam persahabatan. .
:)]Bang OB pembaca setia mo nanya lagi nich....bisa ngga posisi tabelnya diatur? Soalnya setelah trik dari bang OB aku coba tabel punyaku posisinya terlalu kebawah, padahal waktu posting, jarak antara tabel dan teks diatasnya udah aku rapatkan. Mohon bantuannya bang!!! Mksh.
BalasHapusto onding: Klo Tabel terlalu ke bawah, berarti onding harus pakai trik yang cukup sederhana. Yaitu kodenya dijadikan satu kalimat tanpa ada baris baru (enter). Ex:
BalasHapus<table border="1" width="300"><tr><td>satu</td><td>dua</td><td>tiga</td></tr><tr><td>satusatu</td><td>duadua</td><td>tigatiga</td></tr></table>
Mantab.....mksh atas pencerahannya bang. jadi tambah satu dech ilmuku.;;)
BalasHapusTrim's atas triknya, saya praktekkan di blog ...
BalasHapustq sobat . . .
BalasHapusartikelnya sangat bermanfaat bagi saya . ..
tapi kapan2 pada main ke www.mythu23ttas.co.cc yah . . .
Hhe . . .
sep dah . . .
BalasHapusinformasi yang bagus nih buat w . . .
tq yah atas artikelnya . . .
bagus friend, tapi kenapa hasilnya kok melorot alias turun jauh kebawah, help me
BalasHapusx( wah setelah tak praktekin eee..... tabelnya melorot jadi ga enak di liat klu celana jupe yg melorot c bikin tahan nafas klu ini nafas melulu thx infonya yaaaaaaaa....
BalasHapusmmm boleh neh.
BalasHapusdreamweaver tak coba dulu ah..pengen buat tabel nggak bisa2. :D
Wah Mantab, izin Copas
BalasHapusmakasish..
BalasHapusmekasih sob tutorialnya :) udah d bookmark bahagian ini..thanks
BalasHapusterima kasih banget infonya: saya mau coba buat tabel di blog saya.
BalasHapusmemang pakarnya nih,
BalasHapusmantab sob
BalasHapusThank's maz atas infonya. tp stlh tak coba, kok jarak antara teks yang diatas tabel dengan tabelnya kok jauh bgt ya? maklum anak baru. :D
BalasHapusmakacih
BalasHapusby http://ari-febriant.blogspot.com/
Hehe...ternyata bisa ya.
BalasHapustrik yang sangat bermanfaat
BalasHapusThanks
BalasHapusthanks tutor nya yah
BalasHapusmantab dan bagus banget nich blognya, kunjungan balik ya bro di download ebook gratis =p
BalasHapusnuwun ilmunya... aku jadi bisa buat tabel di blogku tapi kok tidak sesuai hasilnya...???
BalasHapus@north ngelo rabbit : Jika hasil dari copas kode membuat tabel di atas sedikit berbeda ketika tampil dalam blog, yang perlu diatur adalah kodenya agar disambung semua. Jangan ada "enter" (baris baru), mudah-mudahan bermanfaat.
BalasHapusnice inpoh gan.. visit juga more info di http://www.moderninfotechnology.com
BalasHapusTerimakasih atas infonya..
BalasHapusikutan nyoba aaaah!
BalasHapusthanks bro, lumayan nambah ilmu blogging :)
BalasHapuskalo ini yang bener bener saya cari mas. soalnya di blogspot ga ada toolnya sih .. harus coding sendiri ye
BalasHapusThank's mas oke banget trik nya,,,,,,
BalasHapus