tips,

Membuat Tabel di Wordpress

Follow Jul 20, 2021 · 4 mins read
Membuat Tabel di Wordpress
Share this

Dalam membuat artikel sebelumnya “Akun Modal dalam Perseroan”, saya membuat banyak tabel. Ini adalah pengalaman pertama saya membuat tabel di WordPress.

Awalnya saya kira membuat tabel di WordPress sangat mudah, karena menganggap di editor pos sudah ada alatnya. Ternyata tidak ada, jadi harus meng-install plugin pembuatan tabel. Sebelum itu, saya mencoba beberapa cara sederhana agar mempercepat proses.

Membuat Tabel Cara Pertama

Saya mencoba copy-paste tabel dari Microsoft Excel ke editor pos WordPress. Gambarnya seperti ini:

Membuat tabel

Saya copy gambar tabel di atas lalu paste di editor post WordPress, jadinya seperti ini:

Nama Alamat Nomor Hp
Bondan Jombang 0851234567
Febria Malang 0817654321
Bilqis Batu 0838321543
Shinichi Surabaya 0821214365

Tanpa ada garisnya, kemungkinan cara ini bisa membuat suatu konten yang lain. Untuk mebuat jurnal atau neraca dibutuhkan table yang ada garis dan kepalanya. di bagian pojok editor pos wordpress ini ada bagian teks yang bisa kita atur tag htmlnya. Seperti ini bentuk teksnya;

<table width="246">
<tbody>
<tr>
<td width="82">Nama</td>
<td width="82">Alamat</td>
<td width="82">Nomor Hp</td>
</tr>
<tr>
<td>Bondan</td>
<td>Jombang</td>
<td>0851234567</td>
</tr>
<tr>
<td>Febria</td>
<td>Malang</td>
<td>0817654321</td>
</tr>
<tr>
<td>Bilqis</td>
<td>Batu</td>
<td>0838321543</td>
</tr>
<tr>
<td>Shinichi</td>
<td>Surabaya</td>
<td>0821214365</td>
</tr>
</tbody>
</table>

Saya atur kemali teks diatas menjadi seperti ini ;

<table width="231" border="1" cellpadding="5" >
<thead style="color: white; background-color:blue;">
<tr>
<th style="font-weight: 400;">Nama</th>
<th style="font-weight: 400;">Alamat</th>
<th style="font-weight: 400;">Nomor Hp</th>
</tr>
</thead>
<tbody>
<tr>
<td style="font-weight: 400;">Bondan</td>
<td style="font-weight: 400;">Jombang</td>
<td style="font-weight: 400;">0851234567</td>
</tr>
<tr>
<td style="font-weight: 400;">Febria</td>
<td style="font-weight: 400;">Malang</td>
<td style="font-weight: 400;">0817654321</td>
</tr>
<tr>
<td style="font-weight: 400;">Bilqis</td>
<td style="font-weight: 400;">Batu</td>
<td style="font-weight: 400;">0838321543</td>
</tr>
<tr>
<td style="font-weight: 400;">Shinichi</td>
<td style="font-weight: 400;">Jalan Bendul Merisi Permai Blok E no 90 Surabaya</td>
<td style="font-weight: 400;">0821214365</td>
</tr>
</tbody>
</table>

jika ingin tulisan menjorok kedalam, spasi secara visual pada bagian teks nya, coontoh alamat Bilqis, dan untuk melihat apakah dia akan responsif ketika ada dalam mode mobile, saya menambahkan alamat panjang di nama Shinichi, ternyata otomatis responsif, kemungkinan ikut template bawaan blog. Seperti ini bentuknya;

Nama Alamat Nomor Hp
Bondan Jombang 0851234567
Febria Malang 0817654321
Bilqis     Batu 0838321543
Shinichi Jalan Bendul Merisi Permai Blok E no 90 Surabaya 0821214365

Pembuatan tabel bagi mereka yang ingin menayangkannya di blog WordPress bisa menjadi kewalahan jika jumlah tabel yang akan ditampilkan cukup banyak. Saya berpikir bahwa penggunaan cell pada Excel dapat mempermudah proses ini, terutama bagi yang ingin menampilkan banyak tabel di blog.

Caranya cukup simpel, letakkan tag HTML yang sudah terformat di cell-cell Excel, lalu simpan file tersebut di Google Drive atau penyimpanan serupa untuk digunakan kembali. Mudah, bukan? Tinggal ubah kata-katanya, lalu salin dan tempel.

Berikut ini contoh format sederhananya:

Contoh format tag HTML tabel

Hasilnya akan sama dengan sebelumnya. Kita cukup mengubah bagian nama-nama kepala tabel atau nama-nama baris tabel, lalu menyematkannya di editor post bagian text.

Membuat dengan Cara yang Kedua

Cara ini serupa dengan yang dilakukan plugin-plugin pembuat tabel di WordPress. Untuk artikel yang sebelumnya saya buat, saya menggunakan plugin wpDataTables. Ini beberapa file tabel yang saya buat—tinggal memasukkan ID tabelnya ke editor post.

Membuat tabel dengan wpDataTables

Langkah-langkah Membuat Tabel

  1. Masuk ke dasbor plugin, lalu pilih menu Create.

    Create tabel langkah 1

  2. Klik Next di bagian kanan bawah.
  3. Atur jumlah kolom dan baris tabel.

    Create tabel langkah 2

  4. Klik Generate Table. Beginilah tampilan edit tabel pada plugin ini:

    Tampilan edit tabel wpDataTables

Tips Tambahan

  • Untuk menambah atau menghapus kolom, klik kanan dan pilih opsi Insert atau Delete sesuai kebutuhan.
  • Untuk membuat kepala tabel, klik menu Display, lalu centang pengaturannya.
  • Jika ingin memberi indentasi dalam baris kolom, gunakan fitur Insert HTML, lalu pilih menu Indent dan ketik teks yang diinginkan.

Setelah selesai membuat tabel, tabel tersebut akan tersimpan di dasbor plugin. Kita bisa memanggilnya dengan menggunakan ID tabelnya, atau menduplikatnya jika ingin membuat tabel serupa dengan struktur yang sama.


Itulah pengalaman pertama saya membuat tabel pada artikel di WordPress. Semoga bermanfaat!

Join Newsletter
Get the latest news right in your inbox. We never spam!
Written by


Komentar Pengunjung Lama

Bondan (2021-07-25 11:44:34)

Bisa dicoba Pak bila ada materi yang menggunakan tabel