Buat Tabel Dalam Postingan Blog

Dalam membuat postingan sebuah blog, kadang kita dipersulit dengan minimnya fasilitas yang disediakan blogspot sebagai salah satu platform blog untuk berkreasi lebih lanjut. Misalnya saja adalah membuat tabel dalam postingan blog. Secara terperinci, langkah ini tidak disediakan fitur layaknya fitur insert gambar, video, bullet and numbering, pemerataan teks, dsb. Akibatnya? Yup, kita harus membuatnya dengan cara manual menggunakan edit HTML yang pastinya akan sedikit rumit kita pahami.


Padahal, dalam kenyataannya tabel ini sangat berguna dalam membuat pembaca lebih mudah mengerti dalam menangkap informasi yang kita berikan. Tabel membuat tampilan informasi menjadi lebih terstruktur, sistematis, dan rapi. Tampilan tabel yang attraktif juga bisa memancing perhatian pengunjung untuk membaca informasi yang ingin kita sampaikan.

Jadi, bagaimana cara membuatnya?

Pertama, masuk terlebih dahulu ke akun blogger kita.
Klik entri baru.
Saat kita menulis postingan blog, biasanya kita menulisnya di bagian compose bukan? Nah, khusus untuk membuat tabel ini kita harus menuliskannya melalui edit HTML.
Di bawah ini adalah contoh kode HTML yang perlu kita masukan untuk membuat sebuah tabel beserta isinya.

<table border="1" width="600">
<tr bgcolor="#E0F8E0"><td align="center"><b>Nama</b></td><td align="center"><b>Jenis Kelamin</b></td><td align="center"><b>Usia</b></td><td align="center"><b>Fakultas</b></td><td align="center"><b>Alamat Kost</b></td></tr>
<tr><td align="center">Brian</td><td align="center">Pria</td><td align="left">20</td><td align="left">Teknik</td><td align="left">Jl. Pinangga 1</td></tr>
<tr><td align="center">Bonar</td><td align="center">Pria</td><td align="left">19</td><td align="left">Kedokteran</td><td align="left">Jl. Mawar 9</td></tr>
<tr><td align="center">Dicky</td><td align="center">Pria</td><td align="left">20</td><td align="left">Teknik</td><td align="left">Perumnas Bakti</td></tr>
<tr><td align="center">Umar</td><td align="center">Pria</td><td align="left">20<td align="left">Hukum</td><td align="left">Jl. Hiu 5</td></td>
<tr><td align="center">Susi</td><td align="center">Wanita</td><td align="left">21<td align="left">Ilmu Sosial Ilmu Politik</td><td align="left">Jl. Dahlia 2</td></td>
<tr><td align="center">Dahlia</td><td align="center">Wanita</td><td align="left">19<td align="left">Ekonomi</td><td align="left">Komplek Gandaria</td></td>
<tr><td align="center">Riko</td><td align="center">Pria</td><td align="left">20<td align="left">Teknik</td><td align="left">Jl. Harapan 1</td></td>
<tr><td align="center">Citra</td><td align="center">Wanita</td><td align="left">22<td align="left">MIPA</td><td align="left">Jl. Tanjung 7</td></td>
<tr><td align="center">Bunga</td><td align="center">Wanita</td><td align="left">21<td align="left">MIPA</td><td align="left">Wisma Paramadya</td></td>
</table>

Klik terbitkan entri.

Keterangan :
  1. Kode untuk membuat baris tabel <tr> ... </tr>.
  2. Kode untuk membuat kolom tabel <td> ... </td>. (satu baris dapat terdiri dari beberapa kolom).
  3. Warna background ditunjukan oleh kode bgcolor="#E0F8E0".
  4. Lebar tabel ditunjukan oleh kode width="300".
  5. Kode yang diwarnai hanya digunakan untuk lebih memudahkan pembaca dalam memahami tutorial membuat tabel dalam postingan blog ini. (warna tidak mempengaruhi apapun).

Hasilnya akan muncul sebagai berikut ;

NamaJenis KelaminUsiaFakultasAlamat Kost
BrianPria20TeknikJl. Pinangga 1
BonarPria19KedokteranJl. Mawar 9
DickyPria20TeknikPerumnas Bakti
UmarPria20HukumJl. Hiu 5
SusiWanita21Ilmu Sosial Ilmu PolitikJl. Dahlia 2
DahliaWanita19EkonomiKomplek Gandaria
RikoPria20TeknikJl. Harapan 1
CitraWanita22MIPAJl. Tanjung 7
BungaWanita21MIPAWisma Paramadya

Agak rumit ya kode HTMLnya? Hehe..
Memang bagi yang belum terbiasa menggunakan akan terkesan rumit. Tapi kalau kita sudah terbiasa pasti akan bisa. Tetap berlatih dan berusaha!
Ada yang ditanyakan? Kalau ada yang ingin menambahkan atau menanggapi juga boleh, silakan tuliskan lewat kotak komentar ya kawan..
Salam blogger!

4 komentar:

  1. Met Malam Sahabat blooger saya. Tentang Kode yang saya paste di postingan, kenapa yang muncul hanyak satu bari saja ? sedang kode yg lain dia munculka ttp seperti tulisan biasa aja?
    Terima Kasih banyak . Mohon Penjelasannya !!!

    BalasHapus
  2. minta bantuanya gan....gimana cara memasang colom kehadiran sebuah acara di blog...???

    semisal seperti kita membuat agenda seminar dan kita menyebar blog agar muda mendapatkan informasi dan bisa daftar secara on line...itu giman?

    BalasHapus
  3. terimkasih gan atas infonya semoga sukses selalu

    BalasHapus
  4. Informasi yang sangat bagus dan berguna. Ditunggu untuk informasi berikutnya. Thanks gan

    Silahkan berkunjung di intanqq

    BalasHapus