Cara Membuat Tabel/Kotak di Blog

Blog dari blogspot maupun wordpress saat ini belum dilengkapi dengan toolbar membuat tabel untuk  postingan atau artikel .
Maka artikel ini akan memberi penjelasan 2 cara membuat tabel/kotak pada artikel blog anda.

Cara yang akan di jalankan ada dua cara yaitu :
1. penulisan tag html langsung
2. cara via ms excel

Baiklah, cara membuat tabel/ kotak sangat  mudah (jangan pikir terlalu rumit  ) cukup ikuti cara di bawah ini.

Cara 1. Penulisan tag html langsung

copy paste kode di bawah ini pada halaman blog anda:

<table border=”2″ cellspacing=”2″ cellpadding=”2″ width=”300″ align=”center” bgcolor=”#ffffff” height=”50″>
<tbody>
<tr>
<td>Data A</td>
</tr>
<tr>
<td>Data 1</td>
<td>Data 2</td>
<td>Data 3</td>
</tr>
</tbody>
</table>

Hasil Tabel :

Data A
Data 1	Data 2	Data 3

penjelasan :
a. <table></table> membuat tabel
b. <tr></tr> membuat baris tabel.
c. <td></td> membuat kolom tabel
d. border=”x”  dimana x nilainya adalah pixel (ketebalan garis)
e. cellspacing=”x” : mengatur jarak antar sel
f. cellpadding=”x” : mengatur jarak tulisan atau isi sel
g. bgcolor :  mengatur warna background dari tabel
h. align :  mengatur posisi tabel
nilai align
* center : di tengah-tengah halaman.
* left   : di sebelah kiri halaman.
* right  : di berada disebelah kanan halaman.

i. bordercolor : mengatur warna border tabel (kode warna).
j. width =”x” : untuk mengatur lebar tabel (nilai pixel atau persen (%)).
k. height=”x” : untuk mengatur tinggi tabel (nilai pixel atau persen (%))
anda dapat memodel tabel/kotak dengan mengganti x dengan angka. Silahkan anda tambahkan kotak/tabel lainnya.

Cara 2. Cara via ms excel

Cara ini lebih simpel dan telah saya coba pada blog saya di mediator bisnis.
caranya :

• 1. tulis data pada kotak pada sheet di ms excel
• 2. masuk pada halaman postingan blog anda (pada blogspot klik posisi compose sedangkan pada wordpress klik posisi visual )
• 3.copy paste data di excel ke halaman postingan blog anda
• 4. ubah posisi dari compose ke html (pada blogspot) dan posisi visual ke html (pada wordpress) untuk memodif  kode html nya.
• 5. Ganti border=”0″ jadi border=”2″ agar tampilan tabel/kotak jelas.

Kode yang di hasilkan :

<table border=”2″ cellspacing=”0″ cellpadding=”0″ width=”192″><col span=”3″ width=”64″></col>
<tbody>
<tr height=”20″>
<td width=”64″ height=”20″>Data A</td>
<td width=”64″>Data B</td>
<td width=”64″>Data C</td>
</tr>
<tr height=”20″>
<td height=”20″>Data 1</td>
<td>Data 2</td>
<td>Data 3</td>
</tr>
<tr height=”20″>
<td height=”20″>Data 4</td>
<td>Data 5</td>
<td>Data 6</td>
</tr>
</tbody>
</table>

Hasil tabel/kotak

Data A	Data B	Data C
Data 1	Data 2	Data 3
Data 4	Data 5	Data 6

untuk pembuatan banyak kotak/tabel , cara 2 :  cara via ms excel cukup efektif dan lebih cepat.

Nb. perhatikan cara menempatkan copy paste kotak/tabel dari excel , halaman blog pada posisi visual (untuk wordpress) dan compose (untuk blogspot)

jonson hp
(…dari ruang ide kreatif dan pencerahan pikiran…)

Sumber : http://jonsonhisar.wordpress.com/2010/03/06/414/