Bagi yang masih
awam dalam desain blog/web, tentu jika ingin membuat tabel mengalami kesulitan.
Nah, disini kami sampaikan Cara Membuat Tabel Responsive, yakni tabel yang
tampilannya mengikuti ukuran layar pengunjung. Bagaimana caranya? Penulis pernah
lakukan dengan Copy Paste data dari Microsoft Excel, namun hasilnya belum
memuaskan. Akhirnya Penulis menemukan cara membuat tabel responsive tersebut
melalui situs Tablegenerator.com yang dapat digunakan pada Blogger ataupun
Wordpress, dan ernyata lebih mudah, simpel dan hasilnya memuaskan.
Tablegenerator.com adalah layanan
online yang bisa dipakai untuk membuat tabel tanpa harus mengerti Coding HTML ataupun
CSS dahulu. Cara pemakaiannyapun cukup mudah dan tidak jauh berbeda dengan
software seperti halnya Microsoft Excel. Jika ingin membuat data langsung di
web, hanya perlu menentukan jumlah kolom dan baris lalu memasukan data input
pada setiap sel.selain itu juga dapat melakukan Impor data tabel dengan
beberapa tipe.
Berikut
langkah-langkah membuat tabel responsive melalui Table Generator.com
2. Lakukan Input Data dengan beberapa pilihan di menu File
- New Table, Pilih menu pilihan ini untuk membuat tabel baru. Pada pilihan ini diminta untuk memasukan jumlah baris dan kolom yang dibutuhkan terlebih dahulu.
- Import CSV file (untuk mengimport data tabel berformat CSV (Comma-Separated Values ) dari Microsoft Excel ). Jika kesulitan membuat format CSV ini dapat dilakukan cara berikut :
- Copy data tabel Microsoft Excel, Paste di Spreadsheets Google Docs, lakukan editing sesuai kebutuhan.
- Setelah itu, download data dari menu File > Download > Nilai yang dipisahkan koma (csv, sheet saat ini) > lakukan penyimpanan.
- Setelah data tabel format CSV tersedia, kembali ke Tablegenerator.com, klik File > Import CSV file, tampil kotak dialog Import data from CSV file,
- kemudian Klik Tombol Pilih File > pilih data table CSV > Klik Tombol Import. Data tabel akan tampil dan lakukan editing (jika diperlukan).
- Paste table data (Reccomended) untuk menyalin langsung data dari Microsoft Excel, Pilih menu pilihan ini, (Sebelumnya telah meng Copy data yang akan dibuat), Tampil kotak dialog Paste table data,
- Kemudian Paste di lokasi data > Klik Tombol Load. Data tabel akan tampil dan lakukan editing (jika diperlukan).
- Sebelum menekan tombol GENERATE, lakuka penentuan :
- Klik Kotak Kecil Do Not Generate CSS untuk menyalin kode HTML saja, kode tanpa CSS.
- Klik Kotak Kecil Compact mode untuk mengkompress kode dengan menghilangkan elemen yang tidak penting seperti spasi dll, agar kode lebih ramping dan ringan.
- Kemudian Klik Generate, akan tampil halaman kode HTML / CSS
- Klik Preview untuk melihat hasil
- Klik Copy to clipboard untuk mengcopy kode
- Kemudian Paste pada post / widget Blogger atau Wordpress
Terima Telah Berkunjung