Contoh Program PHP Menggunakan If Else If

Contoh program php menggunakan if else if. Pernyataan if-elseif sangat bermanfaat untuk melakukan pengambilan keputusan yang melibatkan banyak alternatif. Sebagai contoh, pada skrip program berikut, if-elseif digunakan untuk menentukan nama hari sekarang (diambil dari tanggal sistem). Berikut contoh program pernyataan if-elseif:

Hari ini: 
<?php
  $nama_hari = date("I");
  if ($nama_hari == "Sunday")
     print("Minggu");
  elseif ($nama_hari == "Monday")
     print("Senin");
  elseif ($nama_hari == "Tuesday")
     print("Selasa");
  elseif ($nama_hari == "Wednesday")
     print("Rabu");
  elseif ($nama_hari == "Thursday")
     print("Kamis");
  elseif ($nama_hari == "Friday")
     print("Jumat");
  else
     print("Sabtu");

?>

Keterangan:
pada contoh program diatas, pernyataan if-elseif digunakan untuk menentukan nama hari sekarang (didasarkan pada tanggal sistem). Mula-mula, pernyataan berikut:
$nama_hari = date("I");
Dipakai untuk memperoleh nama hari dalam bahasa inggris. Kemungkinan nilainya adalah Sunday, Monday, Tuesday, Wednesday, Thursday, Friday, atau Saturday.
Argumen pada fungsi date() di depan adalah huruf I bukan angka 1.
Selanjutnya kemungkinan nilai-nilai ini ditangani melalui if-elseif kalau menggunakan if-else maka perintah contoh program tersebut akan menjadi panjang. 

Contoh Program PHP Menggunakan If Else

Contoh program PHP menggunakan if else. Pernyataan if-else merupakan pernyataan yang menjalankan suatu tindakan tertentu bila kondisi bernilai benar dan menjalankan tindakan yang lainnya kalau kondisi bernilai salah. Yang berarti juga kita bisa menggunakan pernyataan if dengan melibatkan bagian else. Pada bentuk pernyataan if-else ini seperti pada gambar diagram alir if-else seperti disamping, bagian pernyataan_1 dijalankan kalau ekspresi bernilai benar, dan bagian pernyataan_2 ddijalankan kalau ekspresi bernilai benar. Adapun bentuk pernyataan if-else seperti berikut ini:

if (ekspresi)
  pernyataan_1
else
  pernyataan_1
Bentuk if-else jugan bisa berupa seperti:
if (ekspresi)
{
  pernyataan_1
}
else
{
  pernyataan_1
}

Contoh program PHP sederhana menggunakan if-else, berikut:

$diskon = 0;
  if ($total_beli >= 100000)
    $diskon = intval(0.1 * $total_beli);

Dapat ditulis menjadi:

if ($total_beli >= 100000)
  $diskon = intval(0.1 * $total_beli);
else
  $diskon = 0;

Contoh program php diatas memuat pernyataan if-else yang menjalankan suatu tindakan dari sebuah kondisi. 

Read More

Sejarah PHP

PHP adalah teknologi yang diperkenalkan tahun 1994 oleh Rasmus Lerdorf. Beberapa versi awal yang tidak dipublikasikan digunakan pada situs pribadinya untuk mencatat siapa saja yang mengakses daftar riwayat hidup onlinennya. Versi pertama digunakan oleh pihak lain pada awal tahun 1995 dan dikenal sebagai Personal Home Page Tools. Terkandung didalamnya sebuah parser engine (mesin pengurai) yang sangat disederhanakan, yang hanya mampu mengolah macro khusus dan beberapa utilitas yang sering digunakan pada pembuatan home page,seperti buku tamu, pencacah, dan hal semacamnya. Parser tersebut ditulis ulang pada pertengahan 1995 dan dinamakan PHP/FI Versiaon 2. FI(Form Interprenter) sendiri berasal dari kode lain yang ditulis juga oleh Rasmus, yang menterjemahkan HTML dari data. Ia menggabungkan script Personal Home Page Tools dengan Form Interprenter dan menambahkan dukungan terhadap server database yang menggunakan format mSQL sehingga lahirlah PHP/FI. PHP/FI tumbuh dengan pesat, dan orang-orang mulai menyiapkan kode-kode programnya supaya bisa didukung oleh PHP.

Sulit memberikan data statistic yang akurat, namun diperkirakan pada akhir 1996 PHP/FI sudah digunakan sedikitnya pada 15.000 situs web di seluruh dunia. Pada pertengahan 1997, angka tersebut berubah menjadi 50.000. Pada saat itu juga terdapat perubahan di dalam pengembangan PHP. PHP berubah dari proyek pribadi Rasmus menjadi sebuah tim yang lebih terorganisasi. Parsernya ditulis ulang dari bentuk rancangan awal oleh Zeev Suraski dan Andi Gutmans, dan parser baru ini adalah sebagai dasar PHP Version 3. Banyak kode utilitas yang berasal dari PHP/FI diport ke PHP3, dan banyak diantaranya sudah selesai ditulis ulang secara lengkap.
Pada pertengahan 1998, baik PHP/FI maupun PHP3 dikemas bersama dengan produk-produk komersial seperti server web StrongHold buatan C2 dan Linux RedHat, dan menurut survei yang dilakukan oleh NetCraft, kemungkinan PHP digunakan pada lebih dari 150.000 situs web di seluruh dunia. Sebagai pembanding, angka tersebut lebih banyak daripada pengguna server web Enterprise server buatan netscape di Internet .

Apa itu PHP 

PHP singkatan dari Personal Home Page Tools, adalah sebuah bahasa scripting yang dibundel dengan HTML, yang dijalankan disisi server. Sebagian besar perintahnya berasal dari C, Java dan Perl dengan beberapa tambahan fungsi khusus PHP. Bahasa ini memungkinkan para pembuat aplikasi web menyajikan halaman HTML dinamis dan interaktif dengan cepat dan mudah, yang dihasilkan server. PHP juga dimaksudkan untuk mengganti teknologi lama seperti CGI (Common Gateway Interface)
PHP bisa berinteraksi dengan hampir semua teknologi web yang sudah ada. Developer bisa menulis sebuah program PHP yang mengeksekusi suatu program CGI di server web lain. Fleksibilitas ini amat bermanfaat bagi pemilik situs-situs web yang besar dan sibuk, karena pemilik masih bisa mempergunakan aplikasi-aplikasi yang sudah terlanjur dibuat di masa lalu dengan CGI, ISAP, atau dengan script seperti Perl, Awk atau Python selama proses migrasi ke aplikasi baru yang dibuat dengan PHP. Ini mempermudah dan memperluas peralihan antara teknologi lama dan teknologi baru.


Beberapa Kelebihan PHP dari bahasa pemrograman lain ;;

* Bahasa pemrograman PHP adalah sebuah bahasa script yang tidak melakukan sebuah kompilasi dalam penggunaanya.
* Dalam sisi pemahamanan, PHP adalah bahasa scripting yang paling mudah karena referensi yang banyak.
* PHP adalah bahasa open source yang dapat digunakan di berbagai mesin (linux, unix, windows) dan dapat dijalankan secara runtime melalui console serta juga dapat menjalankan perintah-perintah system.
* Web Server yang mendukung PHP dapat ditemukan dimana - mana dari mulai IIS sampai dengan apache, dengan configurasi yang relatif mudah.
* Dalam sisi pengembangan lebih mudah, karena banyaknya milis - milis dan developer yang siap membantu dalam pengembangan.

sumber : Wikipedia

Read More

Pengenalan Bahasa Pemrograman PHP

PHP merupakan singkatan dari Personal Home Page tools. Skrip ini akan membuat suatu aplikasi dapat diintegrasikan ke dalam HTML, sehingga suatu halaman web tidak lagi bersifat statis, namun menjadi bersifat dinamis. Sifat server-side berarti pengerjaan skrip akan dilakukan di server, baru kemudian hasilnya dikirimkan ke browser. Keunggulannya dari sifatnya yang server-side tersebut antara lain:

• Tidak diperlukan kompatibilitas browser atau harus menggunakan browser tertentu, karena serverlah yang akan mengerjakan skrip PHP. Hasil yang dikirimkan kembali ke browser umumnya bersifat teks atau gambar saja, sehingga pasti dikenal oleh browser apapun.
• Dapat memanfaatkan sumber-sumber aplikasi yang dimiliki oleh server, misalnya koneksi ke database.
• Skrip tidak dapat “diintip” dengan menggunakan fasilitas view HTML source.

Sebagai contoh, perhatikan skrip PHP sederhana berikut ini:

<HTML>
<HEAD>
<TITLE> Contoh Pemrograman PHP </TITLE>
<BODY> <? Echo “<H1> Hallo, saya belajar PHP </H1>”; ?>
</BODY>
</HTML>

Setelah skrip ini dikerjakan di server, server akan memberikan output kepada browser sebagai berikut:

<HTML>
<HEAD>
<TITLE> Contoh Pemrograman PHP </TITLE>
<BODY> <H1> Hallo, saya belajar PHP </H1>
</BODY>
</HTML>

Output inilah yang dieksekusi oleh browser. Dengan output yang berupa tag-tag HTML biasa, maka output tersebut pasti dapat dieksekusi oleh browser apapun. Sebagai perbandingan dapat dilihat pada gambar dibawah ini untuk eksekusi skrip PHP pada Netscape dan pada IE.
Jika dibandingkan dengan skrip yang bersifat client-side, misalnya VBScript atau JavaScript, maka nampak nyata sifat browser independent tersebut. Perhatikan contoh berikut:

<HTML>
<HEAD>
<TITLE> Contoh JavaScript </TITLE>
<BODY>
<SCRIPT LANGUAGE="JavaScript">
document.write ("<H1> Hallo, saya belajar JavaScript </H1>");
</SCRIPT>
</BODY>
</HTML>

Jika skrip tersebut di atas dijalankan pada browser yang tidak mendukung JavaScript, maka browser tidak akan memberikan hasil apapun atau malah memunculkan teks yang diapit oleh tag <SCRIPT> yaitu “document.write ("<H1> Hallo, saya belajar JavaScript </H1>");”.
Kelebihan PHP
PHP dapat "melakukan" semua aplikasi program CGI, seperti mengambil nilai form, menghasilkan halaman web yang dinamis, mengirim dan menerima cookie. PHP juga dapat berkomunikasi dengan layanan-layanan yang menggunakan protokol IMAP, SNMP, NNTP, POP3, HTTP, dan lain-lain. Namun tampaknya kelebihan PHP yang paling signifikan adalah kemampuannya untuk melakukan koneksi dengan berbagai macam database. Saat ini, database yang didukung oleh PHP adalah:

1. Adabas D
2. InterBase
3. PostgreSQL
4. dBase
5. FrontBase
6. Solid
7. Empress
8. mSQL
9. Sybase
10. FilePro (read-only)
11. Direct MS-SQL
12. Velocis
13. IBM DB2
14. MySQL
15. Unix dbm
16. Informix
17. Semua database yang mempunyai provider ODBC  
18. Ingres
19. Oracle (OCI7, OCI8, OCI9)

Struktur Skrip PHP
Seperti telah dibahas minggu lalu, skrip PHP ditambahkan ke dalam HTML dengan menggunakan delimiter khusus. Delimiter merupakan karakter atau kumpulan karakter yang membedakan antara skrip atau tag dengan teks biasa dalam HTML. Seperti kita ketahui, delimiter untuk tag HTML adalah karakter < dan >. Untuk PHP, delimiter yang digunakan adalah sebagai berikut:

• Untuk dokumen SGML/HTML biasa:

<? Pemrograman PHP ?> atau <?php Pemrograman php ?>

•  Untuk dokumen XML:

<?php Pemrograman PHP ?>

• Untuk editor yang tidak mendukung PHP:

<script language=”php”>
    Pemrograman php
</script>

• Dapat juga menggunakan delimiter ASP:

<% Pemrograman PHP %>

Baris-baris pada skrip PHP dipisahkan dengan cara yang sama dengan C atau Perl, yaitu dengan menambahkan karakter titik koma (;). Contoh:
<?
Pemrograman php;
Pemrograman php;
?>

Jika terdapat skrip yang hanya terdiri dari satu baris, ada dua gaya penulisan yang dapat digunakan:

<?
Pemrograman php;
?>

Atau:

<? Pemrograman php ?>

Jika digunakan gaya penulisan yang kedua, tanda titik koma tidak perlu digunakan, karena tag penutup ?> sudah menandakan akhir dari skrip tersebut. Untuk menambahkan komentar dalam skrip PHP dapat digunakan gaya C, C++, atau shell UNIX. Contoh:

<?php
    Pemrograman php; // Komentar satu baris gaya C++
    /* Komentar yang panjangnya lebih dari satu baris */
    Pemrograman php;
    Pemrograman php; # Komentar gaya shell UNIX
?>
Pengenalan struktur bahasa pemrograman PHP ini merupakan dasar dari pelajaran mengenai PHP, selamat mencoba :-D.

Read More

Contoh Program PHP untuk Form Entri Data

Desainlah form entri data karyawan menggunakan web editor Anda(Dreamweaver, Notepad atau FrontPage)

Langkah Kedua : Desainlah Database perusahaan dan tabel karyawan menggunakan phpmyadmin

Langkah Ketiga : Buat script koneksi kemudian sisipkan kedalam form dan letakkan sesudah <body>

Langkah Keempat :  Selanjutnya membuat script php yang akan menangani proses penyisipan record pada tabel, sisipkan setelah tombol simpan

Langkah Kelima : Tampilkan record yang tersimpan pada tabel dengan menggunakan script, berikut script dan gambar tampilannya

Langkah Keenam : Desainlah form detail Karyawan, yang kelak akan menampilkan record sesuai kebutuhan user (pilihan user)

Langkah Ketujuh : Agar form detail menampilkan data sesuai pilihan user, maka pada tombol detail yang terdapat pada form entri data karyawan sisipkan script

Langkah Kedelapan : Pada form detail data karyawan sisipkan query yang memilih record sesuai pilihan user pada form entri data karyawan setelah meng-klik tombol detail

Demikian contoh script php yang digunakan untuk menangani penyisipan record pada tabel  dan menampilkannya. Selamat mencoba…!

Read More

Aplikasi Database Sederhana dengan PHP

Aplikasi Database PHP Untuk memudahkan pemahaman tentang bagaimana membuat aplikasi database dengan PHP disini saya berikan contoh sederhana bagaimana membuat aplikasi database sederhana dengan PHP dan database Mysql.
Untuk membuat aplikasi databse dengan  php kali ini kita akan membuat sebuah buku tamu sederhana, dengan instruksi sebagai berikut :

1. terlebih dahulu anda buat sebuah database dengan nama “cms”.
2. Buat sebuah table dengan nama buku_tamu Dengan struktur table seperti berikut :

Nama Field	Tipe field
Kode	Integer(10) primary, autoincrement
Nama	Varchar(50)
Email	Varchar(50)
web	Varchar(40)
Isi	text

3. Kemudian anda buat sebuah file dengan nama buku_tamu.php dan buat sebuah form untuk menginputkan data, untuk mempercepat, anda pastekan kode berikut ini :

 <html>
<head>
<title>Form Buku Tamu</title>
</head> <body>
<form name=”form1″ method=”post” enctype=”multipart/form-data” action=”form_buku_tamu_proses.php”>
<table width=”299″ border=”0″ align=”center”><tr bgcolor=”#FFCC66″>
<td colspan=”3″><strong> Form Buku Tamu </strong></td></tr><tr>
<td width=”99″>Nama</td>
<td width=”4″>:</td>
<td width=”147″><input type=”text” name=”nama” size=”40″></td>
</tr><tr>
<td width=”99″>Email</td>
<td width=”4″>:</td>
<td width=”147″><input type=”text” name=”email” size=”40″></td>
</tr><tr>
<td width=”99″>Web</td>
<td width=”4″>:</td>
<td width=”147″><input type=”text” name=”web” size=”30″></td>
</tr><tr>
<td colspan=”3″>isi</td>
</tr>
<tr>
<td colspan=”3″><textarea name=”isi” cols=”60″ rows=”5″></textarea></td>
</tr>
<tr>
<td colspan=”3″><div align=”center”>
<input type=”submit” name=”Submit” value=”Simpan”>
<input type=”reset” name=”Submit2″ value=”Reset”>
</div></td>
</tr> </table>
</form> </body>
</html>

4. Untuk menginputkan data kedalam table kita menggunakan query mysql yang nantinya akan di jalankan dengan program PHP.  Untuk melakukan proses ini anda harus mengerti beberapa point berikut ini :

1.  mysql_query() adalah fungsi yang mengirimkan perintah DML ke database yang kita masuki, sebagaimana layaknya bila kita memasukkan perintah MySQL langsung dari mesin server.
2. mysql_db_query() adalah hampir sama halnya dengan mysql_query yaitu yang berfungsi mengirimkan pernyataan SQL ke server data base MYSQL selama nama database masih aktif.

Perhatikan Contoh Kode Program  untuk mengisikan bukutamu form diatas, simpan dengan  nama form_buku_tamu_proses.php:

<?php
include_once(‘koneksi.php’); // Memasukkan kode dari file koneksi.php
$perintah=”INSERT INTO buku_tamu(nama,email,web,isi) VALUES (‘$nama, ‘$email,’$web’,'$isi’)”; // Query biasa dalam variable perintah
$hasil=mysql_query($perintah);
if ($hasil)
{
echo(“Proses Input Berhasil”);
}else
{
echo(“Proses Input Gagal “);
}
?>

4. Untuk menampilkan hasil masukan (input) di tampilan browser maka sintaknya adalah :
            a. mysql_fetch_array(int result, int [result_type] );
¨  mysql_fetch_array() adalah fungsi yang memberikan hasil array dari data yang kita  contohnya : array mysql_fetch_array ($result);
            b. mysql_fetch_row(int result, int [result_type] );
¨  Pemakaian sintak ini hampir sama dengan sintak array mysql_fetch_array(int result, int [result_type] );
¨  Dalam modul ini, kita akan menggunakan sintak array mysql_fetch_array(int result, int [result_type] ); sebagai acuan selanjutnya.
            c. mysql_num_fields(int result);
¨  mysql_num_fields() adalah fungsi yang memberikan jumlah field dari data yang diambil. Contohnya : Mysql_num_field ($result);
            d. mysql_num_row(int result);
¨  mysql_num_row() adalah fungsi yang memberikan jumlah baris dari data yang diambil. Contohnya : Mysql_num_row ($result);
Perhatikan Contoh Kode Program berikut anda simpan dengan namafile data_bukuTamu.php :

<table width=”513″ border=”0″ align=”center”>
<tr bgcolor=”#FFFFCC”>
<td width=”100″><strong>nama</strong></td>
<td width=”100″><strong>email</strong></td>
<td width=”74″><strong>web</strong></td>
<td width=”135″><strong>isi</strong></td>
<td colspan=”2″><strong>isi</strong></td>
</tr>
<?php
$query=”select * from buku_tamu “;
$eksekusi=mysql_query($query);
while($data=mysql_fetch_array($eksekusi))
{
?>
<tr>
<td><?= $data['nama'] ?></td>
<td><?= $data['email'] ?></td>
<td><?= $data['web'] ?></td>
<td><?= $data['isi'] ?></td>
<td width=”43″><div align=”center”>
<a href=”formedit_bukutamu.php?kode=<?=$data['kode']?>”>edit</a>
</div></td>
<td width=”35″><div align=”center”>
<a href=”hapus_bukutamu.php?kode=<?=$data['kode']?>”>hapus</a></div></td>
</tr>
<?
}
?>
</table>

5. Kemudian kita lanjutkan perintah untuk menghapus data dari table, berikut adalah contoh program utuk menghapus isi dari table dalam database. Anda berinama dengan  hapus_bukutamu.php.

<?php
include_once(‘koneksi.php’); // Memasukkan kode dari file koneksi.php
$perintah=”DELETE FROM buku_tamu WHERE kode=’$kode’”;
$hasil=mysql_query($perintah);
if ($hasil)
{
echo(“Proses Hapus Berhasil”);
}else
{
echo(“Proses Hapus Gagal”);
}
?>

6. Untuk Proses update kita membutuhkan form tambahan guna melihat/ view data yang akan diedit berdasarkan kodenya ketika link edit di klik, Berikut adalah contoh program menampilkan data dalam form sebelum di edit, anda simpan dengan nama file formedit_bukutamu.php

<?php
include_once(‘koneksi.php’);
$query=”select * from buku_tamu where kode=’$kode’”;
$eksekusi=mysql_query($query);
if($data=mysql_fetch_array($eksekusi))
{
$kode=$data['kode'] ;
$nama=$data['nama'] ;
$email=$data['email'] ;
$web=$data['web'] ;
$isi=$data['isi'] ;
}
?>
<html>
<head>
<title>Form Buku Tamu</title>
</head>
<body>
<form name=”form1″ method=”post” enctype=”multipart/form-data” action=”update_buku_tamu.php“>
<table width=”299″ border=”0″ align=”center”><tr bgcolor=”#FFCC66″>
<td colspan=”3″><strong> Form Buku Tamu </strong></td></tr><tr>
<td width=”99″>Nama
<label>
<input type=”hidden” name=”kode” value=”<?=$kode?>“>
</label></td>
<td width=”4″>:</td>
<td width=”147″><input type=”text” name=”nama” size=”40″ value=”<?=$nama?>“></td>
</tr><tr>
<td width=”99″>Email</td>
<td width=”4″>:</td>
<td width=”147″><input type=”text” name=”email” size=”40″ value=”<?=$email?>“></td>
</tr><tr>
<td width=”99″>Web</td>
<td width=”4″>:</td>
<td width=”147″><input type=”text” name=”web” size=”30″ value=”<?=$web?>”></td>
</tr><tr>
<td colspan=”3″>isi</td>
</tr>
<tr>
<td colspan=”3″><textarea name=”isi” cols=”60″ rows=”5″><?=$isi?></textarea></td>
</tr>
<tr>
<td colspan=”3″><div align=”center”>
<input type=”submit” name=”Submit” value=”Simpan”>
<input type=”reset” name=”Submit2″ value=”Reset”>
</div></td>
</tr>
</table>
</form>
</body>
</html>

Anda perhatikan kode yang dicetak tebal. Setelah anda membuat form untuk view data sebelum proses update dilakukan, sekarang dilanjutkan membuat kode program untuk proses update, dimana kode inilah yang nantinya mengeksekusi perintah untuk mengupdate data dalam tabelnya,  anda simpan dengan nama update_buku_tamu.php kemudian ketikkan kode dibawah ini:

  <?php
include_once(‘koneksi.php’); // Memasukkan kode dari file koneksi.php
$perintah=”UPDATE buku_tamu SET  nama=’$nama’,email=’$email’, web=’$web’,isi=’$isi’ WHERE kode=’$kode’”;
$hasil=mysql_query($perintah);
if ($hasil)
{
echo(“Proses Update Berhasil”);
}else
{
echo(“Proses Update Gagal”);
}
?>

Read More

Sejarah Dreamweaver

Pada Jaman Dahulu Kala Hiduplah seorang Programmer yg bernama Mr.MX dia adalah Programmer bahasa C++ yg Pintar dan akhirnya dia disuruh oleh Raja di Negerinya untuk membuatkan software agar bisa mempromosikan Kerajaan ke Kerajaan lainnya.

     Akhirnya Programmer itu codink codink terus menerus memecahkan masalahnya. Akhirnya terciptalah Macromedia Dreamweaver. Untuk Mengenang jasa jasanya Sang Raja Mengubah nama Softwarenya Menjadi Macromedia DreamweaverMX.

      Macromedia Dreamweaver adalah sebuah HTML editor profesional untuk mendesain secara visual dan mengelola situs web maupun halaman web. Bilamana kita menyukai untuk berurusan dengan kode-kode HTML secara manual atau lebih menyukai bekerja dengan lingkungan secara visual dalam melakukan editing, Dreamweaver mambuatnya menjadi lebih mudah dengan menyediakan tool-tool yang sangat berguna dalam peningkatan kemampuan dan pengalaman kita dalam mendesain web.Dreamweaver MX dalam ini digunakan untuk web desain. 

      Dreamweaver terus berkembang hingga menjadi Adobe Dreamweaver yang merupakan program penyunting halaman web dan sangat banyak digunakan karena fitur-fiturnya yang menarik dan kemudahan penggunaannya  .

    Versi terakhir Macromedia Dreamweaver sebelum Macromedia dibeli oleh Adobe Systems yaitu versi 8. Versi terakhir Dreamweaver keluaran Adobe Systems adalah versi 10 yang ada dalam Adobe Creative Suite 4 (sering disingkat Adobe CS4).

Read More

Membuat Web Menggunakan Macromedia Dreamweaver

Akhirnya sampai juga kita dibagian ketiga posting berkelanjutan mengenari cara membuat web menggunakan Macromedia Dreamweaver. Setelah di bagian pertama kita membahas sepatah dua kata mengenai apa itu Dreamweaver, kemudian di bagian kedua saya memaparkan beberapa bagian penting dari software web design tersebut, maka di bagian ini saya akan langsung memberi contoh penggunaan Dreamweaver dalam membuat sebuah halaman website. Berhubung karena salah satukeunggulan utama Dreamweaver ini sebagai sebuah software web design adalah memberikan kemudahan bagi kita dalam membuat website, maka kita akan mencoba bekerjamembuat halaman-halaman website melalui layar design dimana kita bisa menggunakan menu-menu pilihan dalam memasukkan isi web dan mengatur tampilannya tanpa harus pusing mengotak-atik kode-kode struktur HTML-nya. Berikut langkah-langkahnya:

1. Buatlah folder terlebih dahulu sebagai tempat penyimpanan file-file website Anda. Buatlah 2 buah folder, yang pertama sebagai tempat penyimpanan utama dimana file-file dari folder inilah yang akan Anda edit seterusnya. Sebagai contoh buatlah folder di drive D:\, F:\, atau yang lainnya dengan nama terserah pembaca, misalkan "gud_webku". Folder kedua berfungsi sebagai tempat menjalankan halaman-halaman website yang akan Anda buat. Sebenarnya file-file yang akan ada di folder kedua ini adalah file-file yang sama yang ada di folder pertama (folder "gud_webku"). Namun, ketika kita ingin menjalankan halaman web yang telah kita buat, kita akan "meng-copy paste" halaman-halaman tersebut beserta seluruh file-file yang kita gunakan dalam mendesain halaman-halaman tersebut, misalnya gambar-gambar, kemudian menjalankannya dari folder kedua tersebut. Hmm, pasti pembaca berpikir bahwa tidak ada gunanya ya alias percuma? Kenapa tidak dijalankan saja dari folder pertama? Prinsipnya seperti ini, ketika kitamembuat sebuah website tentu tujuan kita selanjutnya adalah menyimpan halaman-halaman web tersebut ke internet, atau yang biasa disebut hosting. Nah, karena kita ingin bekerja secara offline alias tidak langsung terhubung ke internet supaya hebat biaya dan waktu, maka kita anggap seolah-olah kita "menghostingkan" halaman website tersebut ke folder yang kedua. Tentu halaman-halaman yang dihostingkan tersebut yang akan dibuka di browser. Jadi, folder pertama berfungsi sebagai tempat kita menyimpan dokumen-dokumen web yang kita buat (halaman web beserta file-file lain yang digunakan untuk mendesain halaman web) dimana file-file itulah yang akan kita tambah, edit, dan lain-lain. Sedangkan folder kedua berfungsi sebagai "hosting" atau lebih tepatnya disebut sebagai localhosting dimana website kita akan dijalankan/atau ditesting. Sebenarnya prinsip ini akan lebih jelas ketika kita belajar mengenaiserver local di komputer sehingga fungsinya akan lebih kelihatan. Mengenai hal itu, kita akan mempelajarinya saat memulai membuat web CMS.
   Setelah itu, buatlah folder kedua misalnya di drive C:\ dengan nama terserah Anda, misalkan"root_webku". Jika pembaca sudah paham mengenai server local di komputer,, misalnya IIS, PWS, dan lain-lain, buatlah folder tersebut di dalam folder htdocs, public_html, wwwroot, atau www. Namun, jika belum paham, buat saja disembarang tempat di drive Anda.
   Nah, bagaimana pula dengan aktivitas "copy paste" yang saya sebut tadi? Apakah kita melakukannya secara manual. Disinilah salah satu fungsi Dreamweaver. Kita akan melakukannya melalui Dreamweaver sehingga setiap kita melakukan penambahan, pengeditan, dan lain-lain terhadap halaman web yang sedang kita desain (yang ada pada folder "gud_webku"), maka Dreamweaver mampu melakukan update pada file-file yang sama yang ada di folder "rem_webku". Sistem seperti ini juga berguna sebagai back up website kita karena kita sudah punya 2 folder yang berisi website kita. Untuk itu, kita perlu melakukan pengaturan sebelum membuat website. Bagaimana pengaturannya? Ada dilangkah selanjutnya :D
2. Buka program Dreamweaver
3. Pada menu utama, pilih Site -> New Site, akan muncul sebuah kotak dialog wizard yang berisi 2 buah tab. Pilih tab Advance dimana akan ada beberapa kategori yang akan kita atur.

1. Pada kategori Local Info:
   Site name : tulis nama projek website Anda. Misalkan "webku"
   Local root folder : pilih folder gud_webku yang telah kita buat pada langkah 1. Kemudian beri tanda centang pada kotak Refresh local file list automatically. Pilihan ini berguna untuk melakukanupdate secara otomatis jika kita melakukan perubahan pada file web yang kita buat.
   Pilihan lainnya untuk sementara dibiarkan saja.
   Pada kategori Remote Info:
   Access : pada bagian ini kita diminta untuk memilih dimana akan melakukan pengetesan (tempat menjalankan) web kita, apakah secara online atau offline. Karena kita untuk sementara melakukannya secara offline yaitu pada komputer kita, maka pilih Local/Network.
   Remote folder : pilih folder rem_webku yang kita buat pada langkah 1. Jangan lupa juga memberi tanda centang pada kotak Refresh local file list automatically.
   Pada kategori Testing Server:
   Pada bagian ini kita diminta untuk memilih model server yang akan kita gunakan untuk melakukan pengetesan atau menjalankan website kita. Untuk sementara lakukan pengaturan sebagai berikut:
   Server mode : none
   Access : Local/Network
   Testing Server Folder: secara otomatis, folder yang terpilih adalah folder "rem_webku" yang merupakan tempat file web kita yang akan dijalankan.
   Kategori lainnya untuk sementara dibiarkan saja. Setelah itu klik tombol OK. Jika ingin melakukan perubahan pengaturan pada SITE yang telah kita buat tersebut, pembaca bisa melakukannya dengan memilih menu Site --> Manage Sites, maka akan muncul kotak dialog Manage Site.
2. Jika pengaturan sudah berhasil, pembaca akan melihat di bagian panel Dreamweaver telah muncul bagian yang berisi site Anda seperti gambar ini:
   
3. Coba kita perhatikan panel tersebut. Terlihat bahwa kita sedang berada pada bagian Local viewsehingga yang muncul adalah folder gud_webku. Jika pembaca menggantinya dengan Remote view, maka folder yang terlihat adalah rem_webku

Read More

Cara Membuat Css dengan Dreamweaver

Editor untuk membuat CSS (Cascading Style Sheet) sebenarnya sudah banyak tersedia, baik dalam bentuk aplikasi yang gratis, berbayar, maupun yang secara online. Saya sudah pernah posting sebelumnya tentang software gratis untuk css. Bahkan jika sudah mengerti carapenulisan dan penyimpanannya, kita bisa gunakan editor yang sangat sederhana dan mendukung penyimpanan format text seperti notepad. Kali ini saya akan sedikit berbagi tentang bagaiman cara membuat css dengan dreamweaver.

Sekilas info, Dreamweaver adalah sebuah perangkat lunak yang digunakan untuk membuat atau menyunting halaman web yang dinamis maupun statis. Editor ini mendukung semua bahasa pemrograman web seperti ASP, PHP, XML, JSP, JS, CSS dan lainya. Program ini banyak digunakan oleh para pengembang web karena fitur-fitur yang disediakan sangat membantu dan mudah untuk digunakan.

Masih sekilas info, Dreamweaver pada awal kemunculanya diberi nama Macromedia Dreamweaver karena mulanya dikembangkan oleh sebuah perusahaan yang bernama Macromedia, sampai dengan versi 8 masih menggunakan nama yang sama. Setelah itu, sekitar tahun 2005 Macromedia Dreamweaver bersama dengan produk yang lainya seperti Macromedia Flash, Macromedia Firework dll dikembangkan oleh Adobe System dengan sedikit perubahan nama menjadi Adobe Macromedia CS (Creative Suite). Dimulai dari Macromedia CS 1 atau versi 9, sampai sekarang tahun 2012 sudah CS 6.

Sekilas info sudah habis, sekarang info yang anda tunggu-tunggu yaitu bagaimana caramembuat css dengan dreamweaver.

Cara membuat css dengan dreamweaver sangat mudah, kita bisa gunakan beberapa caradengan bantuan fitur yang tersedia dalam dreamweaver. cara yang termudah diantaranya adalah :

1. Mengetikkan langsung kode css pada bagian layar code view (kalau sudah banyak hafal perintah dan atributnya cara ini recomended)

1. Dengan cara ini kita akan dibantu dengan auto complete sehingga walaupun tidak sepenuhnya hafal tinggal memilih perintah yang sesuai.
2. Menambahkan css dengan menggunakan fitur tab css yang ada dikanan layar dreamweaver, lihat gambar dengan lingkaran merah.
   
   
   Pada lingkaran merah ke 2, ada beberapa tombol kecil yang dapat digunakan untuk mengelola css. Klik gambar rantai jika anda ingin melampirkan file css yang sudah jadi, klik gambar yang ada tanda  plus (+) untuk menambah css baru, gambar pensil untuk mengedit dan gambar tong sampah untuk menghapus.
   Untuk menambahkan css, kita harus menekan tombol +, nanti akan muncul seperti gambar berikut :
   

   

   Di layar tersebut kita diminta memilih jenis css yang akan dibuat. Pilihan pertama untuk membuat css class yang dapat digunakan oleh banyak objek/tag (silahkan nanti cari referensi tentang css class), pilihan kedua jika anda ingin menempelkan css pada tag html, dan pilihan ketiga untuk membuat ID khusus sesuai dengan nama objek yang nanti dibuat. Trus ada pilihan define in, pilih yang pertama (New Style..) jika ingin cssnya tersimpan di file tersendiri, atau pilihan kedua This document only jika anda ingin cssnya diletakkan dalam bagian header (<head>) dokumen yang aktif.
   Saya akan pandu untuk membuat dengan pilihan selector type yang kedua yaitu tag.
   Kita akan coba menambahkan pada tag H1, dan This documen only.
   
   Kemudian tekan oke, maka akan muncul tampilan seperti gambar berikut :
   

   

   Semua isian tidak harus diisi, jika tidak perlu boleh dibiarkan kosong. Karena contoh ini membuat css untuk tag H1 maka diantaranya yang diubah adalah jenis font, dan ukuran. Jika anda ingin menambahkan yang lainya seperti kotak, warna latar, silahkan buka tab pilihan selanjutnya. Setelah semuanya selesai, tekan tombol ok.
   Hasil cssnya bisa anda lihat di bagian code view seperti berikut :
   
   3.Menambahkan css lewat page properties, ini standard penggunaan css di dreamweaver versi 8 sd CS 6. Pada saat kita mengubah pengaturan halaman melalui page properties dreamweaver otomatis menambahkan css pada halaman yang kita buat. Page Properties bisa dibuka dimenu Modify atau Tombol Page Properties pada bagian bar properties dibagia bawah layar. Lihat gambar :
   

Read More

Menu - Menu Animasi Menarik di Dreamweaver

Seorang Web desainer pasti akan melakukan segala cara untuk membuat tampilan websitenya menarik, salah satunya mungkin dengan cara membuat menu animasi. Cara itu antara lain dengan belajar Photoshop, Flash, dan juga Firework. Namun Pada tutorial Dreamweaver kali ini kita lupakan dulu hal itu karena kita akan belajar membuat menu yang menarik tanpa harus belajar animasi flash karena pada dreamweaver terdapat template - template animasi siap pakai yang sayang jika dilewatkan :)

Ok, berikut langkah - langkahnya:

1. Buka Program Dremaweaver anda, disini saya menggunakan Dremweaver 8 , namun cara ini bisa diterapkan untuk semua versi Dremweaver mulai dari MX , 8 hingga yang terbaru yaitu Adobe Dremweaver CS5
Start >> All Program >> Dreamweaver

2. kalau anda tidak / belum punya website untuk project anda bisa mengklik Create new: pilih HTML

3. Sebelum kita mulai membuat menunya maka kita diharuskan save (menyimpan) dulu project kita dengan menekan CTRL + S , pilih direktori / tempat penyimpanan lalu berikan nama file yang anda inginkan. klik Save

4. Setelah itu pilih menu Insert >> Media >> Flash Button


5. Pilih template tombol menu animasi yang anda inginkan 

Disini ada berbagai macam tombol yang WOW, menarik bukan... sebagai contoh maka saya pilih saja salah satunya yaitu Glass-Silver 
Button Text berfungsi untuk menambahkan judul / kata apa yang terdapat di dalam button nantinya
Font : jenis font yang dipakai
Size : ukuran font yang diinginakan 
Link : tautan untuk menu nantinya

Tekan OK, untuk title isi saja

OK

klo 1 menu kurang maka buat lagi sebanyak yang anda perlukan untuk menu di website anda dengan mengulangi langkah di atas 
Contoh hasilnya:

untuk mengetesnya tekan F12 untuk melihat hasilnya :)

Read More