Anda di halaman 1dari 38

Pada Dreamweaver Tutorial kali ini saya akan share cara membuat Define Site PHP Jika

ingin membuat web dinamis tanpa coding anda bisa memakai software handal yaitu
dreamweaver. Langkah pertama yang harus dilakukan yaitu " Define Site" dengan
dreamweaver. Tapi sebelum melakukan define site, karena kita akan membuat web dinamis
dengan berbasis PHP maka perlu kita ketahui supaya website kita bisa diakses maka kita
perlu memastikan bahwa webserver yang akan kita gunakan sudah terinstall dan siap
digunakan. Dalam hal ini webserver yang kita gunakan adalah XAMPP. Lakukan instalasi
XAMPP , jika belum mempunyai software tersebut bisa didownload disini. Jika sudah
diinstal maka bisa dilakukan dengan melakukan pengecekan yaitu :


dilihat di direktori C:/xampp apabila direktori tersebut sudah ada berarti sudah
terinstall
Pengecekan selanjutya yaitu dengan membuka browser kemudian ketikkan alamat
Localhost, maka akan muncul halaman xampp seperti gambar dibawah.

Jika kita sudah melakukan pengecekan diatas maka selanjutnya buat folder di dalam direktori
"C:/xampp/htdocs/ " beri nama folder tersebut dengan "latihan" selanjutnya








1. Buka aplikasi Dreamweaver nya, dalam hal ini saya memakai Dreamweaver versi 8
karena lebih mudah dipahami dan interface nya tidak serumit Adobe Dreamweaver
CS5

2. Selanjutnya dijendela menu sebelah kanan di bagian Files silahkan diklik "Manage
site"

3. Selanjutnya akan muncul jendela baru seperti gambar dibawah, kemudian klik "New"
kemudian pilih "Site"

4. Selanjutnya akan muncul jendela baru silahkan isi kolom "What would you like to
name your site" dengan nama website yang diinginkan, dalam hal ini saya isi dengan
nama "Latihan", selanjutnya isi kolom "What is the HTTP Address (URL) of your
site ?" dengan url website kita. dalam hal ini saya isi dengan
"http://localhost/latihan". Jika pc atau server kita mempunyai IP statis maka kita bisa
ganti localhost dengan IP PC kita. misalkan diisi deng "http://127.0.0.1/latihan"

5. Akan muncul jendela baru seperti gambar dibawah. kemudian silahkan pilih opsi
"Yes i want to use a server technology" dengan pilihan "PHP MySQL" kemudian
klik next


6. Selanjutnya akan muncul jendela baru dan silahkan pilih "Edit and Test Locally(my
testing server is on this computer)" dan isi kolom "Where dou you want to store
your file" dengan browse direktori dimana kita akan meyimpan file webnya. Dalam
hal ini kita browse direktori "C:/xampp/htdocs/latihan/" kemudian klik next

7. Selanjutnya akan muncul jendela dengan pertanyaan "What URL would you use to
browse to the root of your site?" silahkan isi dengan "http://localhost/latihan"
silahkan klik "Test URL" untuk memastikan bahwa settingan sudah benar

8. Selanjutnya akan muncul jendela baru dengan pertanyaan "When you are done
editing ... dst" pilih "No" selanjutnya klik "next"

9. Selanjutnya akan muncul jendela baru yang menginformasikan tentang Semua
settingan yang telah kita pilih sebelumnya yaitu tentang "Local info", "Remote Info",
"Testing Server" selanjutnya klik "Done"

10. Selanjutnya akan muncul jendela bahwa kita sudah berhasil melakukan "Define site"
selanjutnya klik "Done"


Dreamweaver Tutorial untuk "Define Site" berbasis PHP sudah selesai selanjutnya
kita akan menginjak ke tutorial kedua ... ok!! See U in the next tutorial
- See more at: http://webdinamis.blogspot.com/2012/06/membuat-web-dinamis-berbasis-php-
dengan.html#sthash.85Pd64te.dpuf

Membuat Aplikasi Input Data Sederhana
Dengan PHP
Dalam tutorial ini akan dipelajari cara untuk membuat koneksi ke database dan CRUD data
(Create, Read, Update, Delete) dengan studi kasus data user. Tutorial ini belum membahas
tentang validasi inputan baik client side maupun server side. Untuk dapat mengikuti tutorial
ini, pastikan anda sudah menginstall server lokal pada PC anda. Saya menggunakan XAMPP
sebagai bundled server apache dan PHP.
Download CRUD dan Login belajar.zip Downloaded 30446 times 6 kB
Langkah 1 Struktur Folder
Buat folder baru pada C:/xampp/htdocs dengan nama belajar. Folder ini akan menjadi area
kerja kita dalam membuat aplikasi yang nantinya dapat diakses menggunakan browser
dengan mengetikkan localhost/nama_folder. Karena nama folder kita adalah belajar,
maka untuk mengakses aplikasi ketikkan localhost/belajar pada address bar browser
anda.
Langkah 2 Database
Buat database dengan nama belajar. Kemudian buat tabel dengan nama user dengan data
berikut:
Fieldname Datatype
user_id int(4), PRIMARY, AUTO INCREMENT
username varchar(20)
password varchar(255)
email varchar(100)
fullname varchar(100)
agama varchar(15)
no_hp bigint(14)

Langkah 3 File Konfigurasi
Sebelum dapat melakukan CRUD data kedalam database, kita harus membuat koneksi ke
database terlebih dahulu.
<?php
//host yang digunakan
//99,9% tidak perlu dirubah
$host = 'localhost';

1
2
3
4
<?php
//host yang digunakan
//99,9% tidak perlu dirubah
$host = 'localhost';
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

//username untuk login ke host
//biasanya didapatkan pada email konfirmasi order hosting
$user = 'root';

//jika menggunakan PC sendiri sebagai host,
//secara default password dikosongkan
$pass = '';

//isikan nama database sesuai database
//yang dibuat pada langkah-1
$dbname = 'belajar';

//mengubung ke host
$connect = mysql_connect($host, $user, $pass) or die(mysql_error());

//memilih database yang akan digunakan
$dbselect = mysql_select_db($dbname);
?>
File config.php ini nantinya akan banyak kita gunakan pada file-file lain yang perlu
menghubung ke server untuk menyimpan, merubah, maupun menghapus data.
Langkah 4 Form Input Data
Ketikkan kode berikut, kemudian simpan dalam folder belajar dengan nama index.php
<html>
<head>
<title>Belajar PHP</title>
</head>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<html>
<head>
<title>Belajar PHP</title>
</head>

<body>
<h1>Form Input Data</h1>

<form name="input_data" action="insert.php" method="post">
<table border="0" cellpadding="5" cellspacing="0">
<tbody>
<tr>
<td>Username</td>
<td>:</td>
<td><input type="text" name="username" maxlength="20" required="required"
/></td>
</tr>
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
<tr>
<td>Password</td>
<td>:</td>
<td><input type="password" name="password" maxlength="20"
required="required" /></td>
</tr>
<tr>
<td>Fullname</td>
<td>:</td>
<td><input type="text" name="fullname" maxlength="100" required="required"
/></td>
</tr>
<tr>
<td>Email</td>
<td>:</td>
<td><input type="email" name="email" required="required" /></td>
</tr>
<tr>
<td>Agama</td>
<td>:</td>
<td><input type="text" name="agama" required="required" /></td>
</tr>
<tr>
<td>Nomor HP</td>
<td>:</td>
<td><input type="text" name="no_hp" maxlength="14" required="required"
/></td>
</tr>
<tr>
<td align="right" colspan="3"><input type="submit" name="submit"
value="Simpan" /></td>
</tr>
</tbody>
</table>
</form>
</body>
</html>
action="insert.php" adalah file yang digunakan untuk memproses data yang
dimasukkan melalui form ini. method="post" adalah metode pengiriman data yang
digunakan. Ada dua jenis menthod untuk mengirim data, yaitu post dan get. Pengiriman
dengan method POST berarti bahwa variabel-variabel data tidak ditampilkan pada url,
sedangkan pengiriman dengan method GET, variabel-variabel data disertakan pada url
sehingga url terlihat seperti ini:
http://localhost/belajar/insert.php

1
http://localhost/belajar/insert.php?username=namanya&password=passwordnya&fullname=
nama_lengkapnya
Sekarang coba buka pada browser anda dengan mengetikkan localhost/belajar pada
address bar browser. Akan tampil form input data seperti ini.

Langkah 5 Menyimpan Data
Ketikkan kode berikut, kemudian dengan nama insert.php
<?php
//panggil
file config.php untuk menghubu
include('config.php');

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<?php
//panggil file config.php untuk menghubung ke server
include('config.php');

//tangkap data dari form
$username = $_POST['username'];
$password = $_POST['password'];
$fullname = $_POST['fullname'];
$email = $_POST['email'];
$agama = $_POST['agama'];
$no_hp = $_POST['no_hp'];

//simpan data ke database
$query = mysql_query("insert into user values('', '$username', '$password', '$email',
'$fullname', '$agama', '$no_hp')") or die(mysql_error());
16
17
18
19

if ($query) {
header('location:index.php?message=success');
}
?>
include() digunakan untuk menyertakan file lain dalam file ini. Ingat bahwa pada langkah
pertama kita sudah membuat file config.php yang berisi konfigurasi untuk menghubung ke
server, maka setiap kali kita perlu untuk menghubung ke database, kita cukup memanggil
file config.php saja tanpa harus menuliskan kembali kode-kodenya.
$_POST['name'] digunakan untuk menangkap value yang dikirim dari form. Untuk
menangkap data, gunakan name yang sama dengan name dari form. Contoh: untuk
menangkap data username dari form, maka gunakan $_POST['username'].
mysql_query() digunakan untuk menjalankan script SQL. Pada langkah ini, script SQL
yang kita gunakan adalah untuk menambah data ke database.
Tambahkan kode berikut pada file index.php setelah <h1></h1> untuk menampilkan
pesan sukses ketika berhasil menyimpan data.
...
<h1>Form Input Data</h1>
<?php

1
2
3
4
5
6
7
8
9
10
11
...
<h1>Form Input Data</h1>

<?php
if (!empty($_GET['message']) && $_GET['message'] == 'success') {
echo '<h3>Berhasil menambah data!</h3>';
}
?>

<form name="input_data" action="insert.php" method="post">
...
Sekarang coba jalankan aplikasi dengan membuka localhost/belajar dan isikan data
pada form dan klik tombol simpan. Jika berhasil, anda akan melihat pesan Berhasil
menambah data! seperti gambar dibawah. Jika gagal, periksa kembali kode yang anda
tuliskan. Pastikan tidak ada salah pengetikan.

Langkah 6 Menampilkan Data
Setelah kita berhasil menyimpan data kedalam database, sekarang kita buat halaman untuk
menampilkan data-data yang sudah kita simpan. Ketikkan kode berikut dan simpan dengan
nama view.php
<?php
include('config.php');
?>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<?php
include('config.php');
?>

<html>
<head>
<title>Belajar PHP</title>
</head>

<body>
<h1>Data User</h1>

<a href="index.php">+ Tambah Data</a>

<table border="1" cellpadding="5" cellspacing="0">
<thead>
<tr>
<td>No.</td>
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
<td>Username</td>
<td>Password</td>
<td>Email</td>
<td>Fullname</td>
<td>Agama</td>
<td>No. HP</td>
<td>Opsi</td>
</tr>
</thead>
<tbody>
<?php
$query = mysql_query("select * from user");

$no = 1;
while ($data = mysql_fetch_array($query)) {
?>
<tr>
<td><?php echo $no; ?></td>
<td><?php echo $data['username']; ?></td>
<td><?php echo $data['password']; ?></td>
<td><?php echo $data['email']; ?></td>
<td><?php echo $data['fullname']; ?></td>
<td><?php echo $data['agama']; ?></td>
<td><?php echo $data['no_hp']; ?></td>
<td><a href="#">Edit</a> || <a href="#">Hapus</a></td>
</tr>
<?php
$no++;
}
?>
</tbody>
</table>
</body>
</html>
Kemudian tambahkan kode berikut pada file index.php setelah </form> sebelum
</body>.
...
</form>
<a href="view.php">Lihat Data<

1
2
3
4
5
6
...
</form>

<a href="view.php">Lihat Data</a>

</body>
7 </html>
Sekarang bukalah localhost/belajar/view.php untuk melihat hasilnya.
Pada
kolom opsi terdapat dua menu, yaitu edit dan hapus. Pada langkah ini, kedua menu tersebut
masih belum dapat digunakan. Pada langkah berikutnya akan kita buat menu edit tersebut.
Langkah 7 Merubah/Update Data
Dalam menginputkan data bisa terjadi kesalahan seperti kesalahan input, kesalahan data yang
dimasukkan, ataupun lainnya. Untuk itu, data yang sudah disimpan harus dapat dirubah
sehingga kesalahan dapat diperbaiki. Pada dasarnya, form untuk mengedit data adalah sama
dengan form untuk menginputkan data. Hanya saja pada form untuk mengedit data, form
tersebut harus menampilkan data yang akan dirubah. Untuk itu, buat file baru dengan nama
edit.php, kemudian copy-kan semua kode yang ada pada file index.php kedalam file
edit.php. Selanjutnya kita harus menambahkan beberapa kode agar form edit dapat
menampilkan data yang akan di edit. Kode untuk file edit.php menjadi seperti ini.
Highlight yang saya berikan adalah baris-baris kode yang ditambahkan ataupun dirubah.
<?php
include('config.php');
?>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<?php
include('config.php');
?>

<html>
<head>
<title>Belajar PHP</title>
</head>

<body>
<h1>Form Input Data</h1>

<?php
$id = $_GET['id'];

$query = mysql_query("select * from user where user_id='$id'") or die(mysql_error());

18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
$data = mysql_fetch_array($query);
?>

<form name="update_data" action="update.php" method="post">
<input type="hidden" name="user_id" value="<?php echo $id; ?>" />
<table border="0" cellpadding="5" cellspacing="0">
<tbody>
<tr>
<td>Username</td>
<td>:</td>
<td><input type="text" name="username" maxlength="20" required="required"
value="<?php echo $data['username']; ?>" disabled /></td>
</tr>
<tr>
<td>Password</td>
<td>:</td>
<td><input type="password" name="password" maxlength="20"
required="required" value="<?php echo $data['password']; ?>" /></td>
</tr>
<tr>
<td>Fullname</td>
<td>:</td>
<td><input type="text" name="fullname" maxlength="100" required="required"
value="<?php echo $data['fullname']; ?>" /></td>
</tr>
<tr>
<td>Email</td>
<td>:</td>
<td><input type="email" name="email" required="required" value="<?php echo
$data['email']; ?>" /></td>
</tr>
<tr>
<td>Agama</td>
<td>:</td>
<td><input type="text" name="agama" required="required" value="<?php echo
$data['agama']; ?>" /></td>
</tr>
<tr>
<td>Nomor HP</td>
<td>:</td>
<td><input type="text" name="no_hp" maxlength="14" required="required"
value="<?php echo $data['no_hp']; ?>" /></td>
</tr>
<tr>
<td align="right" colspan="3"><input type="submit" name="submit"
value="Simpan" /></td>
</tr>
</tbody>
</table>
</form>

<a href="view.php">Lihat Data</a>

</body>
</html>
Kemudian ubah link pada file view.php menjadi seperti ini.
<td><a
href="edit.php?id=<?php echo
?>">Edit</a> || <a href="#">Hapu

1
<td><a href="edit.php?id=<?php echo $data['user_id']; ?>">Edit</a> || <a
href="#">Hapus</a></td>
Umumnya, username seseorang tidak boleh dirubah setelah ia terdaftar. Untuk membuat agar
field input username tidak dapat dirubah, kita gunakan atribut disabled. Sampai langkah
ini kita belum dapat melakukan perubahan data, kita baru dapat menampilkan data pada form
edit. Untuk merubah data pada database, kita perlu membuat query SQL lagi untuk meng-
update database dengan data yang baru. Buat file baru dengan nama update.php dan
ketikkan kode berikut.
<?php
include('config.php');
//tangkap

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<?php
include('config.php');

//tangkap data dari form
$id = $_POST['user_id'];
$password = $_POST['password'];
$fullname = $_POST['fullname'];
$email = $_POST['email'];
$agama = $_POST['agama'];
$no_hp = $_POST['no_hp'];

//update data di database sesuai user_id
$query = mysql_query("update user set password='$password', fullname='$fullname',
email='$email', agama='$agama', no_hp='$no_hp' where user_id='$id'") or
die(mysql_error());

if ($query) {
header('location:view.php?message=success');
}
?>
Kemudian tambahkan baris kode berikut pada file view.php setelah <h1></h1> (sama
seperti pada file index.php).
<?php
if (!empty($_GET['message']) &&
echo '<h3>Berhasil m
}

1
2
3
4
5
<?php
if (!empty($_GET['message']) && $_GET['message'] == 'success') {
echo '<h3>Berhasil meng-update data!</h3>';
}
?>
Sekarang bukalah halaman view.php pada browser dan ubah-lah salah satu data yang sudah
di inputkan dengan meng-klik tombol edit.

Langkah 8 Menghapus/Delete Data
Setelah bisa menambah dan merubah data, sekarang kita buat untuk menghapus data. Buat
file baru dengan nama delete.php dan ketikkan kode berikut.
<?php
include('config.php');
$id = $_GET['id'];

1
2
3
4
5
6
7
8
9
10
11
<?php
include('config.php');

$id = $_GET['id'];

$query = mysql_query("delete from user where user_id='$id'") or die(mysql_error());

if ($query) {
header('location:view.php?message=delete');
}
?>
Kemudian tambahkan kode pada link dalam file view.php seperti berikut.
<td>
<a href="edit.php?id=
<a href="delete.php?i
</td>

1
2
3
4
<td>
<a href="edit.php?id=<?php echo $data['user_id']; ?>">Edit</a> ||
<a href="delete.php?id=<?php echo $data['user_id']; ?>">Hapus</a>
</td>
Sekarang cobalah untuk menghapus beberapa data yang sudah di-input-kan.
Lagi coba-coba buat program pencarian dengan php? butuh referensi ?
Tepat sekali dengan pembahasan kali ini yang berkaitan dengan pencarian atau lebih tepatnya
matching/ pencocokan. Biasanya untuk pencocokan data kita menggunakan like bila
menggunakan database, atau dengan membandingkan isi string dengan string lain. Ada fungsi
dalam php yaitu ereg() dan eregi() yang berguna untuk melakukan pencocokan string.

Dengan menggunakan fungsi tersebut kita coba buat program pencarian data pada sebuah
variabel string yang berisi kalimat yang cukup panjang, berikut source code program php
yang diperlukan :
<?php
$kalimat = "Mencoba menemukan kata dalam sebuah kalimat dengan bahasa
pemrograman php";
if(isset($_POST['pencarian'])){
$cari=$_POST['cari'];
if(eregi($cari,$kalimat)){
cetak("Data diketemukan!");
}else{
cetak("Data tidak diketemukan!");
}
}
?>
<html>
<head><title>Pencarian sederhana dengan PHP</title></head>
<body>
<form method="post" action="pencarian.php">
Cari kata : <input type="text" size="20" name="cari" /><br/>
<input type="submit" name="pencarian" value="cari" />
</form>
<?php
function cetak($kata){
echo "$kata";
}
?>
</body>
</html>
Jangan lupa simpan kode tersebut di server localhost dengan nama pencarian.php (dalam
format file php), kemudian coba jalankan program tersebut seperti ini :



Dalam script di atas kita menggunakan fungsi eregi(), perbedaan kedua fungsi tersebut
terletak pada sensitive case artinya huruf kecil atau besar mempengaruhi bila untuk fungsi
ereg() dan sebaliknya untuk eregi().

Read more: http://thedewaku.blogspot.com/2014/05/contoh-program-pencarian-sederhana-
dengan-php.html#ixzz39Ud25QP4

Contoh Program PHP
Contoh program PHP sederhana
Kamis, 12 April 2012
Latihan Menampilkan Variabel

Latihan menampilkan variabel menggunakan html dan php, contoh program sederhana bagi pemula.
Latihan ini menggunakan umur sebagai variabel pemasukan data, dengan dua file program php.
Dimana kedua file tersebut disimpan dengan nama input variabel dan umur, kedua file tersebut
jangan lupa ditaruh dalam satu folder. File input variabel digunakan untuk pemasukan data,
sedangkan file umur untuk menampilkan variabel. Adapun listing programnya sebagai berikut:

input,php
<HTML>
<HEAD>
<TITLE>Latihan Pemasukan Data</TITLE>
</HEAD>

<FORM ACTION="simpan.php" METHOD="GET">
Silakan Masukkan umur Anda:<BR>
<INPUT TYPE="TEXT" NAME="umur"><BR>
Penulisan umur, contoh : 20 tahun dst.<BR>
<INPUT TYPE="SUBMIT" Value="Kirim">
</FORM>

</BODY>
</HTML>



umur.php
<HTML>
<HEAD>
<TITLE>Latihan Menampilkan Variabel</TITLE>
</HEAD>
<BODY>

<?php
$umur = $_GET["umur"];
print("Umur anda = <B>$umur</B>");
?>

</BODY>
</HTML>

Diposkan oleh Wildan di 23.34 1 komentar
Kirimkan Ini lewat EmailBlogThis!Berbagi ke TwitterBerbagi ke FacebookBagikan ke Pinterest
Label: HTML dan PHP
Selasa, 10 April 2012
Tag Tag HTML
Tag tag dalam HTML biasanya berupa tag-tag yang saling berpasangan dan setiap tag tersebut selalu
ditandai dengan simbol < dan >. Tag juga dapat berarti sebagai elemen-elemen HTML yang terdapat
pada bagian head pada sebuah dokumen HTML.
Dalam penulisan tag HTML tidaklah case sensitive, artinya penggunaan huruf besar ataupun kecil
tidaklah menjadi masalah. Dalam implementasinya tag digunakan untuk mendefinisikan dari bagian
tertentu yang terdapat pada elemen-elemen HTML. Diantara dari elemen-elemen tersebut adalah
sebagai berikut:
1. Tag <title>
Digunakan untuk memberi judul dokumen.
Penggunaannya adalah sebagai berikut :
<title> Judul Dokumen </title>
2. Tag <base>
Digunakan untuk menentukan basis URL sebuah dokumen. Basis URL ini berguna bila dalam
dokumen terdapat link-link yang bersifat relatif, karena link tersebut tetap akan bekerja meskipun
dokumen dipindahkan ke direktori lain atau bahkan ke komputer lain.
Penggunaannya adalah sebagai berikut :
<base href=URL>
3. Tag <link>
Digunakan untuk menunjukkan relasi antar dokumen HTML. Tag ini mempunyai beberapa atribut
antara lain :
Href berfungsi untuk menunjukkan pada URL dokumen lain.
Adapun library nya adalah sebagai berikut:
#
file://
ftp://
gopher://
http://
https://
mailto:
news:
telnet://
wais://
Rel berfungsi untuk mendefinisikan relasi terhadap sebuah dokumen lain yang berisi informasi
tentang personil yang memberi kontribusi terhadap dokumen tersebut.
Adapun library nya adalah sebagai berikut:
alternate
appendix
bookmark
chapter
contents
copyright
glosarry
help
index
next
prev
previous
section
start
stylesheet
subsection
Rev berfungsi untuk mendefinisikan relasi sebuah dokumen HTML dengan dokumen lain.
Adapun library nya adalah sebagai berikut:
alternate
appendix
bookmark
chapter
contents
copyright
glosarry
help
index
next
prev
previous
section
start
stylesheet
subsection
Type berfungsi untuk menentukan tipe dan parameter dari relasi.
Adapun library nya adalah sebagai berikut:
text/css
text/javascript
Penggunaannya adalah sebagai berikut:
<link [{rev/rel}=Teks]href=URL>
4. Tag <meta>
Digunakan untuk mendefinisikan informasi-informasi di luar HTML. Informasi meta dapat digunakan
oleh browser untuk menjalankan suatu aktivitas yang belum didukung oleh HTML. Tag meta
mempunyai atribut sebagai berikut:
http-equiv berfungsi untuk mendefinisikan properti dari elemen.
name berfungsi untuk mendefinisikan diskripsi tambahan dari elemen.
url berfungsi untuk mendefinisikan target dokumen dari sebuah properti.
content berfungsi untuk menyediakan nilai respon dari properti.
Penggunaannya adalah sebagai berikut :
<meta http-equiv=refresh content=0 url=URL

Terdapat banyak dari beberapa tag tag HTML pada umumnya. Dan dalam penggunaannya pula ada
berbagai macam elemen-elemen yang digunakan selain yang disebutkan pada tulisan diatas. Maka
dari itu mohon maaf untuk kekurangannya.
Diposkan oleh Wildan di 14.56 0 komentar
Kirimkan Ini lewat EmailBlogThis!Berbagi ke TwitterBerbagi ke FacebookBagikan ke Pinterest
Label: Dasar Dasar HTML
Senin, 09 April 2012
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.
Diposkan oleh Wildan di 22.05 1 komentar
Kirimkan Ini lewat EmailBlogThis!Berbagi ke TwitterBerbagi ke FacebookBagikan ke Pinterest
Label: Contoh Program
Kamis, 05 April 2012
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.
Diposkan oleh Wildan di 21.08 0 komentar
Kirimkan Ini lewat EmailBlogThis!Berbagi ke TwitterBerbagi ke FacebookBagikan ke Pinterest
Label: Contoh Program
Rabu, 04 April 2012
Contoh Program PHP Menggunakan If

Contoh program php menggunakan if. Pernyataan if digunakan untuk mengambil keputusan
berdasarkan suatu kondisi. Dalam PHP terdapat tiga macam bentuk pernyataan if yaitu pernyataan if
saja, pernyataan if-else, pernyataan if-elseif. Bentuk pernyataan if seperti " if (ekpresi) pernyataan ".
Pada bentuk ini bagian pernyataan akan dijalankan hanya kalau bagian ekpresi bernilai benar.
Dengan catatan nilai selain nol atau kosong dianggap sebagai nilai benar dan PHP menyediakan
konstanta bernama TRUE yang menyatakan benar dan FALSE yang menyatakan salah. Contoh
penerapan if misalnya untuk menentukan diskon. Sebagai contoh diberikan ketentuan bahwa bila
pembeli berbelanja melebihi atau sama dengan 100.000 maka pembeli akan mendapatkan diskon.
Untuk lebih jelasnya coba simak program PHP berikut:

<?php
$total_beli = 200000;
$keterangan = "Tak dapat diskon";
if ($total_beli >= 100000)
$keterangan = "Dapat diskon";
print("$keterangan <BR\n");
?>

Keterangan:
Pada kode program PHP seperti diatas, penentuan keterangan dengan memberikan nilai " Tak dapat
diskon " pada variabel $keterangan. Selanjutnya, pernyataan if diatas akan membuat variabel
$keterangan diisi dengan " Dapat diskon " hanya kalau ekspresi $total_beli > 100000 bernilai benar.
Tentu saja pada contoh ini, ekpresi tersebut akan bernilai benar mengingat variabel $total_beli diisi
200000. Dengan demikian bila anda memanggil contoh program tersebut pada browser maka akan
tampil " Dapat diskon ". Namun, setelah anda mencobanya, ubahlah isi $total_beli menjadi 50000
dan kemudian reload ato muat ulang pada halaman yang menampilkan contoh program tersebut.
Maka akan tampil "Tak dapat diskon ". Hal ini memberikan gambaran bahwa dengan menggunakan
if kita dapat mengatur tindakan dengan berdasarkan suatu kondisi, menggunakan if.

Sekiranya bagian pernyataan pada if berupa sejumlah pernyataan, anda bisa meletakkan
pernyataan-pernyataan tersebut dalam {}. Contoh program PHP berikut merupakan pengembangan
dari skrip program sebelumnya, yang memungkinkan pemakai memasukkan besar pembelian dan
komputer akan menghitung jumlah yang harus dibayar.

<FORM METHOD="GET">
Besar Pembelian:
<INPUT TYPE="TEXT" NAME="total_beli"><BR><BR>
<INPUT TYPE=SUBMIT VALUE="Tentukan Diskon">
</FORM >

<?php
$total_beli = $_GET["total_beli"];
if (isset($total_beli))
{
$total_beli = intval($total_beli);
$diskon = 0;
if ($total_beli >= 100000)
$diskon = intval(0.1 * $total_beli);
printf("Diskon = %d <BR>\n", $diskon);
printf("Pembayaran = %d <BR>\n",
$total_beli - $diskon);
}
?>

Keterangan:
Contoh program diatas melibatkan kode HTML berupa tag FORM, yang digunakan untuk
menempatkan kotak teks dan sebuah tombol untuk memproses pemasukan data oleh pemakai. isi
kotak teks akan dinyatakan dengan variabel $total_beli.
$total_beli = $_GET["total_beli"]; digunakan untuk memperoleh nilai variabel HTML bernama
$total_beli. Superglobal $_GET digunakan untuk memperoleh nilai tersebut. Hasilnya disimpan ke
variabel $total_beli.
if (isset($total_beli)) digunakan agar perhitungan hanya dilakukan kalau variabel $total_beli sudah
ada.
Pernyataan if tersebut diperlukan mengingat pada pengeksekusian yang pertama kali, yaitu saat
memanggil contoh program diatas, variabel $total_beli sebenarnya belum tercipta. Apabila contoh
program diatas dijalankan di browser maka akan tampil seperti berikut ini:


Bila anda mengisi nilai besar pembelian 150000 pada kotak teks input seperti gambar diatas akan
tampil seperti gambar berikut ini:


Keterangan:
Bila pemakai telah menekan tombol dengan nama " Tentukan Diskon ", form akan dikosongkan dan
kode yang terdapat setelah if (isset($total_beli)) akan dijalankan.
$total_beli = intval($total_beli); Pernyataan ini digunakan untuk mengubah nilai pada variabel
$total_beli berupa integer.
$diskon Digunakan untuk memberikan nilai nol terhadap variabel $diskon.
if ($total_beli >= 100000)
$diskon = intval(0.1 * $total_beli);
Digunakan untuk mengubah nilai $diskon sekiranya isi variabel $total_beli melebihi atau sama
dengan 100000. Dalam hal ini besar diskon adalah 10% (dikalikan dengan 0.1).
Berikut ini adalah contoh hasil program PHP ( contoh penentuan diskon ) setelah tombol Tentukan
Diskon di tekan.


Adapun contoh hasil eksekusi program php menggunakan if bila anda memasukkan nilai kurang dari
100000, semisal 60000 maka akan tampil seperti gambar berikut:


Demikian contoh program PHP menggunakan if, yang diambil dari hasi review buku dasar
pemrograman web dinamis menggunakan php karya Abdul Kadir. Semoga bermanfaat, bila ada
kekurangan dan kesalahan mohon maaf yang sebesar-besarnya.
Diposkan oleh Wildan di 19.05 0 komentar
Kirimkan Ini lewat EmailBlogThis!Berbagi ke TwitterBerbagi ke FacebookBagikan ke Pinterest
Label: Contoh Program
Selasa, 03 April 2012
Struktur Dasar HTML

Struktur Dasar HTML. Struktur dasar html artikel dari pemula yang sedang belajar html. Struktur
dasar html biasanya digunakan untuk menandai sebuah file text yang ada pada dokumen html.
Untuk memformat sebuah file text diperlukan aturan dalam penulisan html yang disebut dengan
aturan struktur dasar html. Dalam format aturan itu nantinya akan menghasilkan sebuah file text
yang bercirikan dan berektensi html dan htm.
Namun lebih jauh dari itu dapat disimpulkan bahwa penggunaan struktur dasar html sangat penting
untuk dipahami, mengapa demikian.. HTML (HyperText Markup Language) merupakan salah satu
format yang digunakan dalam pembuatan dokumen dan aplikasi berbasis web. Elemen HTML
biasanya berupa tag yang berpasangan dan setiap tag ditandai dengan simbol < dan >. Pasangan dari
sebuah tag ditandai dengan tanda /. Dalam penulisan tag HTML tidaklah case sensitive, artinya
penggunaan huruf besar ataupun kecil tidaklah menjadi masalah.
Namun lebih jauh dari pada itu di dalam file tersebut terkandung struktur sebagai berikut :
<html>
<head>
..
</head>
<body>
..
</body>
</html>
Keterangan:
Tag Head
Tag Head merupakan header dari halaman HTML.
Didalam HTML terdapat beberapa elemen seperti berikut
Tag titte <tittle> digunakan untuk memberikan judul dokumen dari halaman HTML contoh
penggunaan sebagai berikut:
<title> Judul Dokumen </title>
Tag Base Digunakan untuk menentukan basis URL sebuah dokumen. Basis URL ini berguna bila dalam
dokumen terdapat link-link yang bersifat relatif, karena link tersebut tetap akan bekerja meskipun
dokumen dipindahkan ke direktori lain atau bahkan ke komputer lain.Penggunaannya adalah sebagai
berikut :
<base href=URL>
Tag Link Digunakan untuk menunjukkan relasi antar dokumen HTML. Tag ini mempunyai beberapa
atribut antara lain :
*Href berfungi untuk menunjukan dan menghubungkan dokumen pada URL dokumen lain
*Rel berfungsi untuk mendefinisikan relasi terhadap sebuah dokumen lain yang berisi informasi
tentang atribut yang terkait pada dokumen tersebut
*Rev berfubgsi untuk mendefinisikan sebuah relasi pada sebuah dokumen
*Type digunakan untuk menentukan type dan parameter relasi yang ada
Contoh penggunaannya adalah sebagai berikut :
<link [{rev/rel}=Teks]href=URL>
Tag Meta Digunakan untuk mendefinisikan informasi-informasi di luar HTML. Informasi meta dapat
digunakan oleh browser untuk menjalankan suatu aktivitas yang belum didukung oleh HTML. Contoh
penggunaannya sebagai berikut Penggunaannya adalah sebagai berikut :
<meta http-equiv=refresh content=0 url=URL>
Bagian Body merupakan isi dari dokumen HTML yang akan ditampilkan pada web browser. Semua
informasi yang akan ditampilkan mulai dari teks, gambar, suara dan lain-lain.
Dari beberapa keterangan yang terangkum seperti penjelasan diatas mudah-mudahan mudah untuk
dimengerti
Diposkan oleh Wildan di 21.34 0 komentar
Kirimkan Ini lewat EmailBlogThis!Berbagi ke TwitterBerbagi ke FacebookBagikan ke Pinterest
Label: Dasar Dasar HTML
Senin, 02 April 2012
Definisi Website Layanan Internet Dasar

Definisi website layanan internet dasar. Artikel bagi pemula yang berkenan belajar website, apa itu
sebenarnya website. Menurut definisi website itu berarti suatu sistem pada dokumen hypertext
yang dapat diakses dengan perantara internet. Web atau nama lengkapnya www (world wide web)
merupakan sekumpulan keterhubungan dokumen-dokumen yang disimpan pada internet dan dapat
diakses dengan menggunakan protokol Hyper Text Markup Langguage (HTTP). Inti dari definisi
website bisa diartikan bahwa pengguna internet dapat memanfaatkan berbagai macam fasilitas
informasi tanpa harus ketempat asal sumber informasi itu berada, disamping itu juga pengguna
internet tidak dikenakan biaya yang terlalu mahal. Fasilitas informasi yang dapat diakses oleh para
pengguna internet semisal (foto/gambar, teks, vidio, animasi dll).
Layanan WWW (World Wide Web) merupakan salah satu layanan yang paling populer bagi para
pengguna internet. Mengapa demikian, dengan hadirnya layanan www mempermudah bagi para
pengguna internet untuk mencari informasi atau dokumen yang dapat diakses kapan pun juga dan
dimanapun berada sehingga lebih efektif dan efisien. Pengguna internet juga tidak diharuskan untuk
berkunjung kepada sumber informasi berada atau tanpa harus datang secara langsung ketempatnya.
Layanan WWW tidak hanya berfungsi sebagai media untuk mencari informasi akan tetapi, WWW
sudah banyak digunakan pada institusi, organisasi, badan usaha maupun secara perorangan secara
abstrak dalam kepentingan nya masing-masing. Misal dalam dunia pendidikan, murid dan civitas
akademika sangat bergantung pada informasi. Murid membutuhkan informasi berkaitan dengan
jadwal mengajar, agenda sekolah, pengunguman dll. Sedangkan civitas membutuhkan informasi
berkaitan dengan jumlah keseluruhan murid dari masing-masing ruang dan kelas, informasi
mengenai data diri peserta didik keseluruhan dll. Walhasil keseluruhan dari informasi yang disebut
diatas dirangkum pada dokumen yang ditulis menggunakan suatu format yang disebut HTML
(Hypertext Markup langguage).
Dari definisi dan penjelasan diatas dapat disimpulkan bahwa web atau lengkapnya www(world wide
web) menyimpan informasi yang ada pada internet sehingga dokumen atau informasi tersebut
dapat diakses oleh para pengguna internet dengan melalui protokol yang disebut dengan HTTP
(hyper text markup langguage).
Diposkan oleh Wildan di 21.26 0 komentar
Kirimkan Ini lewat EmailBlogThis!Berbagi ke TwitterBerbagi ke FacebookBagikan ke Pinterest
Label: Pengertian Web
Posting Lama Beranda
Langganan: Entri (Atom)
Stats
Entri Populer
Contoh Program PHP Menggunakan If
Contoh program php menggunakan if. Pernyataan if digunakan
untuk mengambil keputusan berdasarkan suatu kondisi. Dalam
PHP terdapat tiga ma...
Contoh Program PHP Menggunakan Switch
Contoh program php menggunakan switch. Bila ada yang
kesulitan membuat program yang menampilkan nama hari dalam
satu bulan misalnya atau m...
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 ba...
Contoh Program PHP Menggunakan Do While
Contoh program php menggunakan do while. Pernyataan do
while hampir serupa dengan pernyataan while diantara kedua
pernyataan antara do whi...
Latihan Menampilkan Variabel
Latihan menampilkan variabel menggunakan html dan php,
contoh program sederhana bagi pemula. Latihan ini
menggunakan umur sebagai variabel...
Kategori
Contoh Program
(10)
Dasar Dasar HTML
(2)
HTML dan PHP (1)
Pengertian Web
(1)
Program PHP (6)
Arsip Blog


Membuat Drop Down Menu Sederhana di Website
Publish: 7 Juni 2012 | Author & Copyright: Johan | Status: FREE tutorial

Pada tutorial Dreamweaver kali ini saya akan mencoba memberikan penjelasan bagaimana cara
membuat drop down menu yang simple dan sederhana agar bisa dan mudah dipelajari serta
dikembangkan mungkin nantinya oleh para calon web developer maupun web designer yang
singgah di website ilmugrafis. Sedikit penjelasan, Dropdown Menu merupakan menu yang bila kita
sorot dengan mouse maka menu tersebut akan memunculkan menu yang lain (sub menu). Saat ini
banyak sekali yang sudah menggunakan Drop Down menu karena alasan terlihat lebih modern dan
canggih, menambah keindahan website sampai menghemat space/ruang di websitenya karena
dengan drop down kita bisa memberikan sub menu tersembunyi pada menu di website kita.

Ok, mari kita mencoba membuatnya:

1. Buka aplikasi dreamweaver kita, disini saya menggunakan Dreamweaver 8 karena ringan di
komputer saya. Bagi yang sudah menggunakan dreamweaver CS5 bahkan CS6 tenang saja karena
cara ini bisa diaplikasikan untuk semua dreamweaver
(start >> all program >> Dreamweaver)

2. buat CSS file, caranya. Klik File >> New >> Tab General >> Basic Page >> Css


tulis Kode CSS di bawah ini
/* CSS untuk drop down menu dimulai */
ul
{
list-style:none;
padding:0px;
margin:0px
}
ul li
{
display:inline;
float:left;
}
ul li a
{
color:#ffffff;
background:#990E00;
margin-right:5px;
font-weight:bold;
font-size:12px;
font-family:verdana;
text-decoration:none;
display:block;
width:100px;
height:25px;
line-height:25px;
text-align:center;
-webkit-border-radius:5px;
-moz-border-radius:5px;
border: 1px solid #560E00;
}
ul li a:hover
{
color:#cccccc;
background:#560E00;
font-weight:bold;
text-decoration:none;
display:block;
width:100px;
text-align:center;
-webkit-border-radius:5px;
-moz-border-radius:5px;
border: 1px solid #000000;
}
ul li.sublinks a
{
color:#000000;
background:#f6f6f6;
border-bottom:1px solid #cccccc;
font-weight:normal;
text-decoration:none;
display:block;
width:100px;
text-align:center;
margin-top:2px;
}
ul li.sublinks a:hover
{
color:#000000;
background:#FFEFC6;
font-weight:normal;
text-decoration:none;
display:block;
width:100px;
text-align:center;
}
ul li.sublinks
{
display:none;
}
/* CSS drop down menu sederhana end */
wow banyak bener, tenang copy dan paste saja CSS ini ke CSS yang baru anda buat dengan
dreamweaver,

save dan beri nama "dropdown.css"

3. Sekarang buat halaman web, pakai saja HTML agar lebih simple, karena jika memilih format PHP
butuh bantuan Sever untuk mengoprasikannya
caranya mirip css tadi, cuma urutannya File >> New >> Basic Page >> Html >> Ok
sekarang panggil css yang kita buat, caranya:

klik browse, lalu ambil "dropdown.css", OK
Nah setelah langkah di atas benar maka akan ada code seperti ini di halaman html kita.

itu artinya style (CSS) yang kita buat telah masuk ke halaman html

4. Masukkan kode ini ke code html kita. pilih code
<!-- Menu Pertama Dimulai -->
<ul>
<li><a href="#" class="dropdown">Menu One</a></li>

<li class="sublinks">
<a href="#">Link 1</a>
<a href="#">Link 2</a>
<a href="#">Link 3</a>
<a href="#">Link 4</a>
<a href="#">Link 5</a>
</li>

</ul>
<!-- Menu Pertama Selesai -->
<!-- Menu Kedua Dimulai -->
<ul>
<li><a href="#" class="dropdown">Menu Two</a></li>

<li class="sublinks">
<a href="#">Link 1</a>
<a href="#">Link 2</a>
<a href="#">Link 3</a>
<a href="#">Link 4</a>
<a href="#">Link 5</a>
</li>

</ul>
<!-- Menu Kedua Selesai -->
<!-- dan seterusnya -->
copy dan paste code di atas di bagian antara <body> .... </body> , bagi yang belum mengerti tag
seperti ini lihat tutorial BELAJAR WEBSITE HTML

4. Tambahkan JQuery Script, wow apa lagi ini ya? tenang... lebih jelasnya klik Pengenalan JQuery
Website

tulis codenya, Letakkan di bawah tag Title

setelah itu tambahkan code Javascript ini,
letakkan di bawah tag JQuery
<script type="text/javascript">
$(function(){
$('.dropdown').mouseenter(function(){
$('.sublinks').stop(false, true).hide();

var submenu = $(this).parent().next();
submenu.css({
position:'absolute',
top: $(this).offset().top + $(this).height() + 'px',
left: $(this).offset().left + 'px',
zIndex:1000
});

submenu.stop().slideDown(300);

submenu.mouseleave(function(){
$(this).slideUp(300);
});
});
});
</script>
ini gambarnya

Selesai, dan hasilnya kira - kira seperti ini

Gambar: Drop down menu sederhana

Anda mungkin juga menyukai