Cara Membuat Tabel di Postingan Blogger/Blogspot - Membuat tabel dalam postingan blog kadang
diperlukan dengan maksud untuk memperjelas materi tulisan/artikel atau untuk
mempersingkat penjelasan. Pada panel posting blogger tidak tersedia fasilitas
untuk membuat tabel sehingga kita perlu membuat tabel secara manual dengan menggunakan
tag HTML tertentu. Dasar yang harus kita pahami dulu disini adalah bagaimana
cara atau kode penulisan sebuah tabel didalam postingan. Pada tips blogging kali ini saya akan share bagaimana cara membuat tabel serta tag HTML kode
penulisannya.
Perintah dasar tag HTML untuk membuat tabel :
Kode HTML | Keterangan |
<table>...</table> | Perintah untuk membuat tabel |
<tr>...</tr> | Perintah untuk membuat baris |
<td>...</td> | Perintah untuk membuat kolom |
border, width, align, bgcolor | Kode tambahan untuk
pengaturan tebal garis
border, lebar tabel, perataan teks dan warna
background
|
Nah sekarang kita coba membuat tabel 1x3 ( 1 baris 3
kolom ), maka penulisannya seperti ini :
<table border="1"><tr><td>Konten 1</td><td>Konten 2</td><td>Konten 3</td></tr></table>
Maka hasil tampilannya menjadi seperti ini :
Konten 1 | Konten 2 | Konten 3 |
Selanjutnya kita coba merubah kode dasar diatas tadi
untuk mempercantik tampilan dengan perataan teks dan ukuran lebar tabel kita
tentukan misalnya 450px, maka penulisannya menjadi seperti ini :
<table border="1" width="450"><tr bgcolor="#F2F2F2"><td align="center"><b>Konten 1</b></td><td align="center"><i>Konten 2</i></td><td align="center">Konten 3</td></tr></table>
Maka hasil tampilannya menjadi seperti ini :
Konten 1 | Konten 2 | Konten 3 |
Kemudian kita coba lagi membuat tabel yang lebih
banyak misalnya 2x3 (2 baris 3 kolom ) dengan format penulisan seperti ini :
<table border="1" width="450"><tr bgcolor="#F2F2F2"><td align="center"><b>Konten 1</b></td><td align="center"><i>Konten 2</i></td><td align="center">Konten 3</td></tr><tr><td align="left">Tuliskan teks disini</td><td align="left">Masukkan script gambar dengan format seperti ini <img border='0' src=' http://i306.photobucket.com/albums/nn252/cebong_ipit/templateanna/boy-emoticon-020.gif'/></td><td align="center"> Maka hasilnya akan seperti ini<img border='0' src='http://i306.photobucket.com/albums/nn252/cebong_ipit/templateanna/boy-emoticon-020.gif'/></td></tr></table>
Maka hasil tampilannya menjadi seperti ini :
Konten 1 | Konten 2 | Konten 3 |
Tuliskan teks disini | Masukkan script gambar dengan format seperti ini <img border='0' src='http://i306.photobucket.com/albums/nn252/cebong_ipit/templateanna/boy-emoticon-020.gif'/> | Maka hasilnya akan seperti ini
![]() |
Nah dari 2 contoh sederhana tadi silahkan sobat
terapkan untuk membuat tabel dalam postingan anda dengan menggunakan
perintah-perintah dasar pembuatan tabel serta kode tambahan yang diperlukan sehingga
hasil akhir tabel yang dibuat jadi lebih bagus dan menarik. Materi posting ini tidak
cukup jika dihafalkan saja namun akan lebih baik kalau kita langsung mencoba
praktek membuatnya. Tentukan dulu jenis atau bentuk tabel yang ingin sobat
buat, kemudian coba tuliskan scriptnya di notepad, buka panel posting blogger
sobat kemudian paste kode script tabel yang dibuat tadi disana serta lihatlah
previewnya. Saya yakin dengan cara seperti ini akan mempercepat pemahaman kita
mengenai cara pembuatan tabel ini. Semoga tips ini bisa bermanfaat, happy nice
blogging !
Tidak ada komentar:
Posting Komentar