Rabu, 26 Desember 2012

Langkah membuat Grafik, Chart dan Tabel di Blog kita

^.^  Okey Gan Gua mulai dengan langkah membuat Grafik dulu yee,, ^.^
 
Cara membuat gambar grafik di blog sebagai pemanis dan atau penguat tulisan kita.
               Sebenarnya untuk menampilkan grafik diblog tidak sukar, sama hal nya dengan mengunggah foto ke blog, namun untuk bisa menjadi gambar dari grafik tersebut berikut akan saya kupas, berdasarkan pengalaman saya.
Untuk membuat grafiknya sendiri bisa anda pelajari dari MS Excel. Ataupun bisa anda google dengan keyword membuat grafik dengan Excel.
Selain MS Excel untuk membuat grafiknya kita juga membutuhkan program MS Publisher.
Berikut langkah-langkah disertai screenshot pribadi cara membuat foto grafik yang kita buat dengan fasilitas MS Publisher.

1. Copy grafik yang telah kita buat di MS Excel.
grafik-ms-excel
Di MS Excel

2. Buka MS Publisher, blank publication document saja.

3. Kemudian Paste kan.
Di MS Publisher
Di MS Publisher

4. Klik kanan pada grafik di MS Publisher cari “Save As Picture”.

5. Foto grafik siap diunggah sebagai pemanis/penguat tulisan kita.

Jika ingin lebih bagus, gambar bisa diedit menggunakan aplikasi gratis dari photo shop atau photo space
^.^ .Semoga bermanfaat. ^.^
LANJUT langkah selanjutnya , yaitu cara menambahkan tabel pada blog kita 
Cekidoottt !!!
Menambahkan Tabel pada Blog - Tabel pada blog berfungsi sebagai tempat untuk mengumpulkan widget, tulisan, gambar, banner sahabat  dan lain sebagainya agar terlihat indah dan tersusun rapi. Bagi pengguna komputer yang sering mengoperasikan microsoft office seperti ms word dan ms excel, membuat tabel sangatlah mudah dengan menu-menu yang telah disediakan. Tetapi untuk menampilkan tabel pada blog, kita harus menggunakan kode HTML dengan perintah <table>...........<table> agar tabel bisa tampil pada blog.

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

Untuk 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 mengubah kode dasar di atas 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

Untuk membuat tabel yang lebih banyak misalnya 2x3 (2 baris 3 kolom), penulisannya adalah:
<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 &lt;img border=&#039;0&#039; src=&#039; http://i306.photobucket.com/albums/nn252/cebong_ipit/templateanna/boy-emoticon-020.gif&#039;/&gt;</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




Atau dengan cara lain ,,,, kita lihat blog sahabat kita http://www.rayhanzhampiet.com/2011/11/cara-membuat-tabel-di-postingan.html 


dan jika kita juga ingin menambahkan chart pada blog kita. kita bisa lihat di blog sahabat kita ini http://blog.josescalia.net/2012/12/menggunakan-jfreechart-untuk-membuat.html

kunjungi juga yaaa !!! \(^0^)/
Sekian, selamat mencoba...

5 komentar: