Lompat ke konten Lompat ke sidebar Lompat ke footer

Widget HTML #1

Cara Membuat Tabel Responsive Di Postingan Blog dengan Tabel Generator

Cara Membuat Tabel Responsive Di Postingan Blog dengan Tabel Generator - Hallo sobat blogger, menjadi seorang blogger, ketika membuat suatu artikel, apakah anda pernah membutuhkan suatu tabel dalam artikel tersebut? Jika saat ini anda belum pernah membuat tabel, pasti suatu saat akan tiba waktu nya anda memerlukan sebuah tabel di postingan anda. Kita semua tahu, bahwa editor yang disediakan oleh blogger tidak memiliki fitur untuk membuat tabel. Jadi, kita harus membuat tabel sendiri menggunakan kode HTML. Akan tetapi pasti tidak semua orang menguasai HTML. Jadi pada kesempatan kali ini, saya akan memberikan tutorial cara untuk membuat tabel responsive di postingan blog dengan mudah menggunakan tabel generator.
Cara Membuat Tabel Responsive Di Postingan Blog dengan Tabel Generator
Cara membuat tabel responsive di blog

Cara membuat tabel responsive di Blog menggunakan tabel generator

Untuk saat ini, untuk membuat tabel di blog, kita harus membuatnya sendiri menggunakan HTML. Tentu itu hal yang sangat sulit oleh orang yang awam. Lalu bagaimana jika kita memerlukan sebuah tabel di postingan blog kita? Jangan khawatir, karena kita bisa membuat tabel yang responsive dengan sangat mudah. Bahkan orang yang tidak bisa HTML pun bisa membuatnya. Caranya yaitu menggunakan tabel generator. Berikut adalah tata caranya :

1. Pertama kalian buat terlebih dahulu tabel anda menggunakan Microsoft Excel
Cara Membuat Tabel Responsive Di Postingan Blog dengan Tabel Generator
Buat tabel menggunakan excell

2. Setelah itu copy tabel yang anda buat tadi, dengan cara blok semua tabel kemudian tekan ctrl + C
3. Setelah itu, Buka situs https://www.tablesgenerator.com/
4. Setelah situs Table Generator sudah terbuka, silahkan anda masuk bagian tab HTML
Cara Membuat Tabel Responsive Di Postingan Blog dengan Tabel Generator
Ke menu HTML

5. Kemudian klik menu file, lalu pilih yang Paste Table Data
Cara Membuat Tabel Responsive Di Postingan Blog dengan Tabel Generator
Paste tabel data

6. Setelah itu akan ada halaman untuk menempel tabel yang sudah di copy
7. Silahkan paste tabel yang sudah dicopy sebelumnya dengan cara menekan ctrl + v. Kemudian centang bagian “Paste with formating”, agar format tabelnya sama persis dengan yang sudah dibuat di excel. Setelah itu klik load.
Cara Membuat Tabel Responsive Di Postingan Blog dengan Tabel Generator
Paste dan load tabel anda

8. Setelah anda klik Load, tabel anda sudah berhasil di impor ke Table Generator. Anda juga bisa memberikan settingan tambahan, Seperti membuat tabel responsif, baris pertama sebagai header, tabel bisa di sortir, dan header tetap bisa dilihat ketika tabel di scroll. Silahkan sesuaikan dengan kebutuhan.
Cara Membuat Tabel Responsive Di Postingan Blog dengan Tabel Generator
Settingan tambahan

9. Seteleh itu, klik generate kode
Cara Membuat Tabel Responsive Di Postingan Blog dengan Tabel Generator
Klik generate 

10. Setelah itu, semuanya sudah jadi, silahkan klik “Copy to clipboard” untuk meng-copy kode HTML dari tabel anda.
Cara Membuat Tabel Responsive Di Postingan Blog dengan Tabel Generator
Copy to clipboard

11. Selamat anda sudah berhasil mendapatkan kode HTML dari tabel yang anda buat.

Setelah anda mendapatkan kode HTML sekarang anda tinggal mempostingnya di blog anda, caranya adalah sebagai berikut :

1. Silahkan buka dashboard blog anda
2. Kemudian klik “Buat Postingan Baru
3. Setelah anda masuk di editor blogger, maka anda harus mengubah menjadi mode HTML terlebih dahulu. Cara nya anda klik icon pensil di pojok kiri atas, kemudian klik yang tampilkan HTML
Cara Membuat Tabel Responsive Di Postingan Blog dengan Tabel Generator
Klik icon pensil

Cara Membuat Tabel Responsive Di Postingan Blog dengan Tabel Generator
Tampilkan HTML

4. Setelah masuk ke mode HTML, silahkan paste kode HTML dari tabel anda yang sudah anda copy sebelumnya
Cara Membuat Tabel Responsive Di Postingan Blog dengan Tabel Generator
Paste kode HTML

5. Setelah itu, silahkan keluar dari mode HTML menjadi Tampilkan Menulis dengan cara yang sama seperti sebelumnya.
6. Selamat, tabel anda sudah berhasil dibuat. 
Cara Membuat Tabel Responsive Di Postingan Blog dengan Tabel Generator
Preview tabel di editor blogger

7. Tampilan tabel di editor memang tidak terlalu bagus. Untuk melihat tampilan tabel yang sebenarnya silahkan klik pratinjau.
Cara Membuat Tabel Responsive Di Postingan Blog dengan Tabel Generator
Klik pratinjau

8. Hasil Pratinjau
Cara Membuat Tabel Responsive Di Postingan Blog dengan Tabel Generator
Hasil pratinjau

 9. Selamat. Anda sudah berhasil membuat tabel di postingan blog.

Yak, seperti itulah cara untuk membuat tabel responsif di dalam postingan blog. Bagaimana, cukup mudah bukan? Dengan membuat tabel, itu akan membuat postingan anda rapi dan tidak berantakan. Terimakasih telah berkunjung di www.bloggerkoplo.com. Salam koplo.

Posting Komentar untuk "Cara Membuat Tabel Responsive Di Postingan Blog dengan Tabel Generator"