{"id":34957,"date":"2022-12-30T09:10:00","date_gmt":"2022-12-30T02:10:00","guid":{"rendered":"https:\/\/www.rumahweb.com\/journal\/?p=34957"},"modified":"2022-12-29T15:18:59","modified_gmt":"2022-12-29T08:18:59","slug":"cara-membuat-tabel-responsive-di-wordpress","status":"publish","type":"post","link":"https:\/\/www.rumahweb.com\/journal\/cara-membuat-tabel-responsive-di-wordpress\/","title":{"rendered":"Cara Membuat Tabel Responsive di WordPress"},"content":{"rendered":"\n<p>Seringkali, fitur tabel di Gutenberg WordPress menghasilkan tampilan yang tidak responsive dan cenderung kurang menarik. Karenanya pada panduan ini, kami akan berbagi <strong>cara membuat tabel responsive di WordPress<\/strong> dengan bantuan plugin TablePress.<\/p>\n\n\n\n\n\n<p>Terkadang kita perlu menambahkan tabel pada website untuk menginformasikan data penting kepada pengunjung. Pada <a href=\"https:\/\/blog.rumahweb.com\/wordpress-adalah\/\" title=\"wordpress adalah\">WordPress<\/a>, kita dimudahkan dalam pembuatan tabel yang disediakan oleh editor Gutenberg.<\/p>\n\n\n\n<p>Namun perlu diketahui, pembuatan tabel dengan Gutenberg memiliki fitur yang sangat terbatas. Hal ini menyebabkan pengguna tidak bisa banyak melakukan kustomisasi seperti menentukan ukuran, memasukkan link dan gambar. Juga tidak semua plugin mendukung tampilan responsive, sehingga ketika dibuka pada perangkat seperti mobile atau tablet menjadi acak-acakan.<\/p>\n\n\n\n<p>Pada panduan ini, kami akan menjelaskan salah satu plugin untuk memudahkan pembuatan tabel responsive yaitu TablePress. Simak panduan berikut ini.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Mengenal Plugin TablePress<\/h2>\n\n\n\n<p>TablePress adalah salah satu plugin tabel WordPress yang paling populer. Plugin ini memudahkan dalam membuat dan mengelola tabel yang menarik pada website, dengan tampilan tabel yang telah responsive.<\/p>\n\n\n\n<p>Berikut detail fitur yang disediakan di Plugin TablePress :<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Menambah, edit, dan kelola tabel kecil atau besar dengan mudah<\/li>\n\n\n\n<li>Menambahkan penyortiran langsung, paginasi, pencarian, dan fitur lainnya untuk pengunjung website<\/li>\n\n\n\n<li>Sisipkan gambar, tautan, dan rumus matematika<\/li>\n\n\n\n<li>Impor file spreadsheet yang ada<\/li>\n\n\n\n<li>Tidak perlu pengetahuan coding<\/li>\n<\/ul>\n\n\n\n<p>Dari banyaknya fitur yang ditawarkan, plugin ini termasuk plugin yang recommended untuk dipakai.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Membuat tabel responsive di WordPress<\/h2>\n\n\n\n<p>Pada panduan ini, kami akan menggunakan plugin TablePress untuk membuat tampilan tabel menjadi responsive. Berikut langkah-langkahnya.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Step 1. Instalasi Plugin TablePress<\/h3>\n\n\n\n<p>Berikut langkah-langkah instalasi plugin TablePress melalui dashboard.<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Pada dashboard wp-admin, klik menu Plugins > Add New.<\/li>\n\n\n\n<li>Pada kotak pencarian ketikkan tablepress.<\/li>\n\n\n\n<li>Klik Install Now seperti pada gambar berikut.<\/li>\n<\/ol>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/tambah-plugin-tablepress.png\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"365\" src=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/tambah-plugin-tablepress-1024x365.png\" alt=\"instalasi tablepress pada wordpress - Cara Membuat Tabel Responsive di WordPress dengan Plugins TablePress\" class=\"wp-image-34959\" srcset=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/tambah-plugin-tablepress-1024x365.png 1024w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/tambah-plugin-tablepress-300x107.png 300w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/tambah-plugin-tablepress-768x274.png 768w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/tambah-plugin-tablepress-1536x547.png 1536w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/tambah-plugin-tablepress-370x132.png 370w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/tambah-plugin-tablepress-270x96.png 270w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/tambah-plugin-tablepress-570x203.png 570w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/tambah-plugin-tablepress-740x264.png 740w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/tambah-plugin-tablepress.png 1919w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/a><\/figure>\n\n\n\n<ol class=\"wp-block-list\" start=\"4\">\n<li>Setelah selesai proses install, klik Activate.<\/li>\n<\/ol>\n\n\n\n<figure class=\"wp-block-image size-full\"><a href=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/activate-plugin-tablepress.png\"><img loading=\"lazy\" decoding=\"async\" width=\"842\" height=\"627\" src=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/activate-plugin-tablepress.png\" alt=\"activate plugin tablepress - Cara Membuat Tabel Responsive di WordPress dengan Plugins TablePress\" class=\"wp-image-34961\" srcset=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/activate-plugin-tablepress.png 842w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/activate-plugin-tablepress-300x223.png 300w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/activate-plugin-tablepress-768x572.png 768w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/activate-plugin-tablepress-370x276.png 370w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/activate-plugin-tablepress-270x201.png 270w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/activate-plugin-tablepress-570x424.png 570w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/activate-plugin-tablepress-740x551.png 740w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/activate-plugin-tablepress-80x60.png 80w\" sizes=\"auto, (max-width: 842px) 100vw, 842px\" \/><\/a><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">Step 2. Cara Membuat Tabel<\/h3>\n\n\n\n<p>Setelah plugin terinstal, lanjutkan pembuatan tabel dengan mengikuti langkah berikut :<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Pilih menu TablePress > Add New Table.<\/li>\n<\/ol>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><a href=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/add-tablepress.png\"><img loading=\"lazy\" decoding=\"async\" width=\"244\" height=\"334\" src=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/add-tablepress.png\" alt=\"add new table - Cara Membuat Tabel Responsive di WordPress dengan Plugins TablePress\" class=\"wp-image-34963\" srcset=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/add-tablepress.png 244w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/add-tablepress-219x300.png 219w\" sizes=\"auto, (max-width: 244px) 100vw, 244px\" \/><\/a><\/figure>\n<\/div>\n\n\n<ol class=\"wp-block-list\" start=\"2\">\n<li>Isikan nama tabel, deskripsi, dan jumlah baris serta kolom.<\/li>\n\n\n\n<li>Lanjutkan klik Add table.<\/li>\n<\/ol>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/add-tablepress-2.png\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"810\" src=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/add-tablepress-2-1024x810.png\" alt=\"isi informasi tabel - Cara Membuat Tabel Responsive di WordPress dengan Plugins TablePress\" class=\"wp-image-34964\" srcset=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/add-tablepress-2-1024x810.png 1024w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/add-tablepress-2-300x237.png 300w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/add-tablepress-2-768x608.png 768w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/add-tablepress-2-370x293.png 370w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/add-tablepress-2-270x214.png 270w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/add-tablepress-2-570x451.png 570w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/add-tablepress-2-740x585.png 740w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/add-tablepress-2.png 1048w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/a><\/figure>\n\n\n\n<ol class=\"wp-block-list\" start=\"4\">\n<li>Masukkan data yang ingin ditampilkan ke dalam tabel pada kolom Table Content.<\/li>\n<\/ol>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large is-resized\"><a href=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/table-content.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/table-content-1024x611.png\" alt=\"isi tabel pada table content - Cara Membuat Tabel Responsive di WordPress dengan Plugins TablePress\" class=\"wp-image-34968\" width=\"650\" height=\"387\" srcset=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/table-content-1024x611.png 1024w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/table-content-300x179.png 300w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/table-content-768x458.png 768w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/table-content-370x221.png 370w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/table-content-270x161.png 270w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/table-content-570x340.png 570w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/table-content-740x441.png 740w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/table-content.png 1449w\" sizes=\"auto, (max-width: 650px) 100vw, 650px\" \/><\/a><\/figure>\n<\/div>\n\n\n<p>Pada halaman yang sama terdapat Table Manipulation yang dapat digunakan untuk mengatur tampilan tabel. <\/p>\n\n\n\n<p>Pengaturan yang dapat dilakukan seperti duplikat baris\/kolom, memindahkan baris\/kolom, menambah baris\/kolom, sembunyikan baris\/kolom, memasukkan link, gambar, dan lainnya.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/table-manipulation.png\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"531\" src=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/table-manipulation-1024x531.png\" alt=\"Table Manipulation - Cara Membuat Tabel Responsive di WordPress dengan Plugins TablePress\" class=\"wp-image-34973\" srcset=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/table-manipulation-1024x531.png 1024w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/table-manipulation-300x155.png 300w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/table-manipulation-768x398.png 768w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/table-manipulation-1536x796.png 1536w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/table-manipulation-370x192.png 370w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/table-manipulation-270x140.png 270w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/table-manipulation-570x295.png 570w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/table-manipulation-740x383.png 740w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/table-manipulation.png 1658w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/a><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">Step 3. Memasukkan Gambar pada Tabel<\/h3>\n\n\n\n<p>TablePress memungkinkan penggunanya dapat menyisipkan gambar pada tabel yang dibuat, simak langkah berikut :<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Klik pada kolom yang akan diinsert gambar.<\/li>\n\n\n\n<li>Lalu klik kanan pilih insert image.<\/li>\n<\/ol>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><a href=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image-1.png\"><img loading=\"lazy\" decoding=\"async\" width=\"482\" height=\"555\" src=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image-1.png\" alt=\"Insert image - Cara Membuat Tabel Responsive di WordPress dengan Plugins TablePress\" class=\"wp-image-34974\" srcset=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image-1.png 482w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image-1-261x300.png 261w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image-1-370x426.png 370w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image-1-270x311.png 270w\" sizes=\"auto, (max-width: 482px) 100vw, 482px\" \/><\/a><\/figure>\n<\/div>\n\n\n<ol class=\"wp-block-list\" start=\"3\">\n<li>Klik Select file.<\/li>\n<\/ol>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image2.png\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"465\" src=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image2-1024x465.png\" alt=\"Insert image - Cara Membuat Tabel Responsive di WordPress dengan Plugins TablePress\" class=\"wp-image-34975\" srcset=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image2-1024x465.png 1024w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image2-300x136.png 300w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image2-768x349.png 768w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image2-1536x697.png 1536w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image2-370x168.png 370w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image2-270x123.png 270w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image2-570x259.png 570w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image2-740x336.png 740w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image2.png 1829w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/a><\/figure>\n\n\n\n<ol class=\"wp-block-list\" start=\"4\">\n<li>Pilih gambar yang akan digunakan lalu klik Open.<\/li>\n\n\n\n<li>Lalu klik insert into tables.<\/li>\n<\/ol>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image3.png\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"528\" src=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image3-1024x528.png\" alt=\"Insert image - Cara Membuat Tabel Responsive di WordPress dengan Plugins TablePress\" class=\"wp-image-34976\" srcset=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image3-1024x528.png 1024w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image3-300x155.png 300w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image3-768x396.png 768w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image3-1536x791.png 1536w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image3-370x191.png 370w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image3-270x139.png 270w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image3-570x294.png 570w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image3-740x381.png 740w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image3.png 1615w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/a><\/figure>\n\n\n\n<ol class=\"wp-block-list\" start=\"6\">\n<li>Lanjutkan seting ukuran gambar yang diinginkan.<\/li>\n<\/ol>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><a href=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image4.png\"><img loading=\"lazy\" decoding=\"async\" width=\"716\" height=\"259\" src=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image4.png\" alt=\"Insert image - Cara Membuat Tabel Responsive di WordPress dengan Plugins TablePress\" class=\"wp-image-34977\" srcset=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image4.png 716w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image4-300x109.png 300w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image4-370x134.png 370w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image4-270x98.png 270w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-image4-570x206.png 570w\" sizes=\"auto, (max-width: 716px) 100vw, 716px\" \/><\/a><\/figure>\n<\/div>\n\n\n<ol class=\"wp-block-list\" start=\"7\">\n<li>Klik preview untuk melihat tampilan dari tabel yang dibuat.<\/li>\n<\/ol>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/preview-setelah-insert-image.png\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"458\" src=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/preview-setelah-insert-image-1024x458.png\" alt=\"Preview  - Cara Membuat Tabel Responsive di WordPress dengan Plugins TablePress\" class=\"wp-image-34978\" srcset=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/preview-setelah-insert-image-1024x458.png 1024w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/preview-setelah-insert-image-300x134.png 300w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/preview-setelah-insert-image-768x344.png 768w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/preview-setelah-insert-image-1536x688.png 1536w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/preview-setelah-insert-image-370x166.png 370w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/preview-setelah-insert-image-270x121.png 270w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/preview-setelah-insert-image-570x255.png 570w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/preview-setelah-insert-image-740x331.png 740w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/preview-setelah-insert-image.png 1827w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/a><\/figure>\n\n\n\n<ol class=\"wp-block-list\" start=\"8\">\n<li>Setelah selesai membuat tabel, klik Save Changes.<\/li>\n<\/ol>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/klik-save-changes.png\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"611\" src=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/klik-save-changes-1024x611.png\" alt=\"Save changes - Cara Membuat Tabel Responsive di WordPress dengan Plugins TablePress\" class=\"wp-image-34979\" srcset=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/klik-save-changes-1024x611.png 1024w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/klik-save-changes-300x179.png 300w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/klik-save-changes-768x459.png 768w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/klik-save-changes-370x221.png 370w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/klik-save-changes-270x161.png 270w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/klik-save-changes-570x340.png 570w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/klik-save-changes-740x442.png 740w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/klik-save-changes.png 1308w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/a><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Memasukkan Tabel pada Post<\/h2>\n\n\n\n<p>Selesai membuat tabel, masukkan tabel tersebut ke postingan dengan mengikuti langkah berikut :<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Masuk ke halaman edit post.<\/li>\n\n\n\n<li>Add block baru pilih TablePress table.<\/li>\n<\/ol>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-tabel-pada-post-1.png\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"594\" src=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-tabel-pada-post-1-1024x594.png\" alt=\"insert table press pada post - Cara Membuat Tabel Responsive di WordPress dengan Plugins TablePress\" class=\"wp-image-34980\" srcset=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-tabel-pada-post-1-1024x594.png 1024w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-tabel-pada-post-1-300x174.png 300w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-tabel-pada-post-1-768x445.png 768w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-tabel-pada-post-1-370x214.png 370w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-tabel-pada-post-1-270x157.png 270w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-tabel-pada-post-1-570x330.png 570w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-tabel-pada-post-1-740x429.png 740w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-tabel-pada-post-1.png 1525w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/a><\/figure>\n\n\n\n<ol class=\"wp-block-list\" start=\"3\">\n<li>Klik tombol Settings dikanan atas > lalu pilih tabel yang diinginkan.<\/li>\n<\/ol>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-tabel-pada-post-2.png\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"380\" src=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-tabel-pada-post-2-1024x380.png\" alt=\"insert table press pada post - Cara Membuat Tabel Responsive di WordPress dengan Plugins TablePress\" class=\"wp-image-34981\" srcset=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-tabel-pada-post-2-1024x380.png 1024w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-tabel-pada-post-2-300x111.png 300w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-tabel-pada-post-2-768x285.png 768w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-tabel-pada-post-2-1536x570.png 1536w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-tabel-pada-post-2-370x137.png 370w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-tabel-pada-post-2-270x100.png 270w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-tabel-pada-post-2-570x211.png 570w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-tabel-pada-post-2-740x275.png 740w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/insert-tabel-pada-post-2.png 1919w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/a><\/figure>\n\n\n\n<ol class=\"wp-block-list\" start=\"4\">\n<li>Insert TablePress pada post telah selesai, lanjutkan publish\/update post yang telah dibuat.<\/li>\n<\/ol>\n\n\n\n<p>Berikut adalah tampilan tabel yang telah berhasil dibuat.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/tampilan-desktop.png\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"512\" src=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/tampilan-desktop-1024x512.png\" alt=\"tampilan desktop - Cara Membuat Tabel Responsive di WordPress dengan Plugins TablePress\" class=\"wp-image-34982\" srcset=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/tampilan-desktop-1024x512.png 1024w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/tampilan-desktop-300x150.png 300w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/tampilan-desktop-768x384.png 768w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/tampilan-desktop-1536x768.png 1536w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/tampilan-desktop-370x185.png 370w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/tampilan-desktop-270x135.png 270w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/tampilan-desktop-570x285.png 570w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/tampilan-desktop-740x370.png 740w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/tampilan-desktop.png 1919w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/a><\/figure>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><a href=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/tampilan-mobile.jpg\"><img loading=\"lazy\" decoding=\"async\" width=\"459\" height=\"1024\" src=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/tampilan-mobile-459x1024.jpg\" alt=\"Tampilan mobile - Cara Membuat Tabel Responsive di WordPress dengan Plugins TablePress\" class=\"wp-image-34983\" srcset=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/tampilan-mobile-459x1024.jpg 459w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/tampilan-mobile-135x300.jpg 135w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/tampilan-mobile-768x1712.jpg 768w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/tampilan-mobile-689x1536.jpg 689w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/tampilan-mobile-919x2048.jpg 919w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/tampilan-mobile-370x825.jpg 370w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/tampilan-mobile-270x602.jpg 270w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/tampilan-mobile-570x1271.jpg 570w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/tampilan-mobile-740x1650.jpg 740w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/12\/tampilan-mobile.jpg 1080w\" sizes=\"auto, (max-width: 459px) 100vw, 459px\" \/><\/a><\/figure>\n<\/div>\n\n\n<p>Demikian <span style=\"text-decoration: underline;\">cara membuat tabel responsive di WordPress<\/span>, selamat mencoba!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Seringkali, fitur tabel di Gutenberg WordPress menghasilkan tampilan yang tidak responsive dan cenderung kurang menarik. Karenanya pada panduan ini, kami akan berbagi cara membuat tabel responsive di WordPress dengan bantuan plugin TablePress. Terkadang kita perlu menambahkan tabel pada website untuk menginformasikan data penting kepada pengunjung. Pada WordPress, kita dimudahkan dalam pembuatan tabel yang disediakan oleh [&hellip;]<\/p>\n","protected":false},"author":342,"featured_media":35127,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[463],"tags":[1891,1890,1000,14],"class_list":{"0":"post-34957","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-wordpress","8":"tag-responsive-table","9":"tag-tablepress","10":"tag-tutorial-wordpress","11":"tag-wordpress"},"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/posts\/34957","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/users\/342"}],"replies":[{"embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/comments?post=34957"}],"version-history":[{"count":0,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/posts\/34957\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/media\/35127"}],"wp:attachment":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/media?parent=34957"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/categories?post=34957"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/tags?post=34957"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}