Tutorial Blogger - Membuat Tabel Blog dengan CoffeCup HTML Editor


No.

Judul

Link
Download

1.





2.





3.





4.





5.





6.





7.





8.





9.





10.





Tabel merupakan salah satu bagian yang penting
dimuat dalam suatu blog, karena keterbatasan media yang dimiliki oleh blog sehingga kadang bagi seorang blogger yang tidak punya kemampuan lebih tentang bahasa HTML akan mengalami kesulitan dalam pembuatan tabel.

Untuk membuat tabel di blog dapat dilakukan dengan berbagai cara baik dengan melalui Word maupun aplikasi lainnya yang mendukung pembuatan tabel. Hanya saja pada tampilan blog lebih mudahnya dengan menggunakan bantuan word yang kemudian sketsa tabel yang dibuat disimpan dalam format html, selanjutnya dibuka dengan noteped lalu dicari tag html yang memuat tentang tabel biasanya diawali dengan kode <tabel> dan diakhiri dengan </tabel>.

Pada kesempatan ini, penulis akan mencoba membuat tabel untuk postingan blog dengan menggunakan Coffe Cup HTML Editor. Khusus untuk aplikasinya (Coffee Cup HTML Editor) dapat anda download langsung dari website asalnya (www.coffeecup.com). Ok kita mulai saja tutoriallnya dan saya anggap di kompi/laptop sudah terpasang aplikasi ini

  •            Buka Coffe Cup HTML Editor dan buat file baru dan pilih “New Blank Page”

  •           Selanjutnya kita akan membuat satu halaman dengan berinama sembarang aja, pada kali ini karena kita akan membuat tabel maka halamannya kita namakan “Tabel”

  •           Selanjutnya, tempatkan kursor antara tag <body> </body>
  •           Pilih menu “Insert” -à “Tabel Designeer.."

  •   Selanjutnya kita akan menentukan berapa jumlah kolom, baris yang akan digunakan, termasuk pemilihan warna tabel dan backgroundnya yang sesuai dengan kebutuhan, pada kondisi ini saya hanya menggunakan standar saja yang secara default tabel 2x2 yang memuat 2 kolom dan 2 baris

  •           Pada menu designer tabel di Coffee Cup kita sudah dapat melihat tabel yang telah kita buat tadi dengan bentuk tabel 2x2 (pada tutor ini, kepala atau judul kolom dari tabel saya beri warna kuning untuk memudahkan dan membedakan kolom dibawahnya)

  •      Selanjutnya kita dapat mengisi kolom dan baris dari tabel yang kita buat tadi sekaligus memodifikasi bentuk tabel yang kita inginkan lalu pilih OK untuk menyimpan model tabel

  •     Selanjutnya pada file Tabel.html yang kita buat ditambahkan banyak kode html yang memberikan penjelasan dari tabel yang telah kita buat
  •         Copy tag HTML tabel yang telah kita buat diawali <div style= dan seterusnya dan diakhiri </div>

Kode HTML kurang lebih seperti berikut
<div style=" text-align: left; text-indent: 0px; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px;"><table width="100%" border="1" cellpadding="2" cellspacing="2" style="background-color: #ffffff;">
<tr valign="top">
<td style="border-width : 0px; background-color: #ff9900;"><br />
</td>
<td style="border-width : 0px; background-color: #ff9900;"><br />
</td>
</tr>
<tr valign="top">
<td style="border-width : 0px;"><br />
</td>
<td style="border-width : 0px;"><br />
</td>
</tr>
</table>
</div>
  •   Lalu masuk ke akun blog anda dan buat satu postingan yang akan memuat tabel
  • Isikan data pada masing-masing kolom sehingga dapat menyesuaikan lebarnya
  •  Pemasukan kode html tabel yang telah kita buat tadi pada blog harus dilakukan pada mode html pada postingan anda.

Hasilnya Seperti berikut ini


Coba

Isi

222222222222

3333333333333
Sekiranya bermanfaaat

ARTIKEL TERKAIT:

Entri Populer