Membuat tabel dalam format HTML memang gampang-gampang
susah. Selain dibutuhkan ketelitian saat membuatnya secara manual, juga
perlu perhatian lebih terhadap desainnya. Dulu, lebih dari 2 tahun yang
lalu, saya pernah menyajikan tips membuat tabel HTML mudah di blog menggunakan
online tool untuk mempermudah proses penyusunan tabel. Tapi dalam hal
desain (layout, CSS), butuh usaha ekstra keras juga karena tidak semua
tool pembuat tabel memiliki template dengan desain yang variatif.
Apalagi bagi anda yang belum begitu akrab dengan HTML dan CSS, tentu pekerjaan ini menjadi sesuatu yang cukup berat.
Sedikit flashback, tabel di dalam posting atau artikel blog
menjadi sangat penting karena apabila anda perlu menampilkan konten
berupa daftar, chart, atau tabel itu sendiri, diperlukan layout halaman
yang mendukung. Dengan demikian, isi konten lebih tertata rapi, mudah
diikuti dan dirunut oleh pembaca, sekaligus bisa menjadi penambah daya
tarik konten.
Saya punya trik khusus membuat tabel menggunakan Microsoft Word
dan memindahkannya ke dalam posting blog hanya dengan beberapa langkah
sederhana. Kelebihan tabel MS Word adalah anda dapat mendesain terlebih
dahulu tampilan dan isi tabel sesuai dengan keinginan, bahkan anda bisa
menggunakan berbagai desain template tabel yang sudah disediakan;
tinggal menyesuaikannya sedemikian rupa dengan desain konten atau blog.
Cukup dengan mengedit beberapa kode kecil saja agar sesuai dengan format
post blog, tabel yang anda buat akan memuaskan. Bagaimana caranya?
Let's go!
Cara Membuat Tabel HTML dengan Microsoft Word
Note: Saya menggunakan Microsoft Office 2007 sebagai peraga dan contoh dalam gambar.
1. Buat tabel seperti biasanya saat anda membuat tabel di MS Word. Saya sarankan tidak membuatnya secara manual (membuat satu persatu) tapi gunakan fitur insert > Table, klik lalu buat susunan tabel sesuai dengan jumlah kolom yang diinginkan.
1. Buat tabel seperti biasanya saat anda membuat tabel di MS Word. Saya sarankan tidak membuatnya secara manual (membuat satu persatu) tapi gunakan fitur insert > Table, klik lalu buat susunan tabel sesuai dengan jumlah kolom yang diinginkan.
2. Sebenarnya anda bisa saja mengisi konten ke dalam tabel nanti saat
tabel sudah dimasukkan ke dalam post, tapi menurut saya akan terlalu
ribet. Oleh karena itu, sebaiknya konten dimasukkan saat masih dalam MS Word, sehingga lebih mudah untuk mengedit, mengatur, dan mendesain tampilan tulisannya.
3. Buat desain tabel dengan menggunakan fitur "Design", yang akan muncul di sisi kiri menu teratas setelah anda memasukkan tabel ke dalam lembar editor MS Word. Anda bisa memilih berbagai pre-made templates (built-in) yang sudah disediakan, sesuaikan dengan kebutuhan layout tabel serta desain/layout blog.
4. Terakhir, setelah table dibuat dan didesain sedemikian rupa, simpan. Yang perlu diperhatikan adalah: jangan simpan sebagai file MS Word (doc maupun docx), tapi simpan sebagai WebPage,Filtered > "Save As" dan pilih WebPage,Filtered (*.htm/*html).
Setelah itu, masih ada proses lagi, cuma sedikit kok.
Cara Memindahkan Tabel MS Word Ke Posting Blog
Setelah disimpan, maka file akan memiliki ekstensi .htm. Berikut langkah-langkah mengedit dan memasukkannya ke dalam posting blog.
1. Buka file tersebut dengan notepad.
2. Di dalamnya anda akan melihat berbagai tag html lengkap seperti
milik halaman web sesungguhnya. Yang perlu diperhatikan adalah tidak
semuanya dibutuhkan. Yang perlu ditambahkan adalah elemen yang biasa
berada di dalam tag div dan juga style-nya (CSS) yang diapit oleh tag style. Hapus tag html, meta, head, dan body.
Jangan lupa hapus tag penutupnya juga, contoh: </head>. Hanya
sisakan dua tag yang saya sebutkan tadi. Jika masih belum jelas,
perhatikan gambar-gambar berikut, yang saya highlight adalah yang harus
dihapus:
4. Setelah dihapus copy semua kode dan paste/masukkan ke dalam post editor. Pastikan sudah klik mode "HTML" di bagian kiri atas (Blogger) atau di bagian kanan atas (WordPress) post editor, tepatnya di sebelah di sebelah mode "Compose".
Setelah memastikan semua kode diedit dan dimasukkan dengan benar,
serahkan semua proses parsing dan koreksi pada engine Blogger. Proses
ini terjadi saat anda mengembalikan ke mode "Compose". Jadi langkah
selanjutnya adalah mengembalikan ke mode "Compose", lalu lihat hasilnya.
Berikut contoh tabel yang saya buat via Microsoft Word:
nge-test
|
test 1
|
test 2
|
test 3
|
test 4
|
a
|
1
|
2
|
3
|
4
|
b
|
5
|
6
|
7
|
8
|
c
|
9
|
10
|
11
|
12
|
d
|
13
|
14
|
15
|
16
|
© copyright Ahmad Khoirul Azmi, published only for buka-rahasia.blogspot.com.
0 komentar:
Posting Komentar