tutorial web abdul malik karim

30
TUTORIAL WEB RPL ABDUL MALIK KARIM NISN : 9975510671

Upload: amkaabdulmalik

Post on 06-Jul-2015

83 views

Category:

Documents


3 download

TRANSCRIPT

Page 1: Tutorial web abdul malik karim

TUTORIAL WEB

RPL

ABDUL MALIK KARIM

NISN : 9975510671

Page 2: Tutorial web abdul malik karim

KATA PENGANTAR KATA PENGANTAR

Moduldenganjudul “Web Design & Web Programing“ merupakanbahanacuan yang

digunakansebagaipanduandalam proses belajarTeman

untukmembentuksalahsatubagiandarikompetensibidangkeahlianTeknologiInformasidanKomunik

asi.

Modulinimencakuppenguasaankonsepfile-filegrafik, memahamidasar-dasarpemrogramanWeb,

memahamiperintah-perintahpemrogramanWeb,

danbagaimanamembangunsebuahaplikasipemrogramanberbasisWeb.

Penyusun

ABDUL MALIK KARIM

Page 3: Tutorial web abdul malik karim

Menginstal Adobe Dream

Weaver Cs6

PertamaKlik setup untukmemulaimenginstal:

Page 4: Tutorial web abdul malik karim

Laluklik install:

LaluKlik Accept:

Page 5: Tutorial web abdul malik karim

Klik language untukmenentukanbahasadanKlikgambar folder untukmenempatkanlokasi dream Weaver,

laluklik install:

Mulaimenginstall:

Page 6: Tutorial web abdul malik karim

Menginstallselesai:

Page 7: Tutorial web abdul malik karim

LangkahPenyimpanan Web Tulisnama web yang ingindibuat, LaluKlikgambar folder untukMenempatkan web yang ingindisimpan:

Apabila folder sudahdibuatlalusimpan web di folder yang dibuat:

Page 8: Tutorial web abdul malik karim

Apabilasudahdimpan, lanjutklik server-kliktanda plus +:

Laluganti FTP menjadi Local/Network:

Page 9: Tutorial web abdul malik karim

Hasilya,laluisidansimpan:

LaluCheklist testing-simpan:

Page 10: Tutorial web abdul malik karim

MulaiMembuat Web Hal pertama yang sayalakukandalammembuat web adalahmembuatpokokdari web yang

sayainginbuatadalahtable.Berikutlangkah-langkahnya :

Pertamaklikinsert :

Lalu klik Table

Lalu tentukan baris/rows dan colomnya:

Page 11: Tutorial web abdul malik karim

Apabila sudah menentukan baris/rows dan colomnya lalu klik ok.

Hasilnya:

Apabila ada baris/rows yang ingin dihilangkan, blok baris yang ingin dihilangkan:

Page 12: Tutorial web abdul malik karim

Lalu klik rows, Hasilnya:

Apabila ada colom yang ingin dihilangkan, blok colom yang ingin dihilangkan:

Page 13: Tutorial web abdul malik karim

Lalu klik cell, Hasilnya:

Apabila table ingin diisi colom, caranya klik table yang ingin diisi colom laluklik insert-klik Table-tentukan

berapa colom yang di isi.

Page 14: Tutorial web abdul malik karim

Pertamaklikinsert :

Lalu klik Table

Lalu tentukan baris/rows dan colomnya:

Page 15: Tutorial web abdul malik karim

Hasilnya:

Apabila ingin di isikan tulisan, klik table yang ingin ditulis:

Hasilnya:

Page 16: Tutorial web abdul malik karim

Apabila ingin meratakan tulisan, blok table yang ada tulisannya dan yang ingin diratakan:

Lalu Horznya diganti dengan Center:

Page 17: Tutorial web abdul malik karim

Hasilnya:

Page 18: Tutorial web abdul malik karim

Mendesain Web Apabila ingin memasukan gambar untuk background, caranya klik Page properties

Lalu klik browser, untuk mencari gambar yang ingin di jadikan background

Page 19: Tutorial web abdul malik karim

Gambar ini yang terpilih:

lalu klik ok:

Page 20: Tutorial web abdul malik karim

Hasilnya:

Apabila sudah selesai, simpan di folder yang pertama kamu buat lalu namakan webnya, lalu ok:

Lalu seterusnya Buat Link Profile, Galery, dan About.

Apabila sudah, lanjut ke pengisian Link di masing-masing Link.

Lanjut Kebawah

Page 21: Tutorial web abdul malik karim

Mengisi Link

Apabila ingin mengisikan link ke home, caranya:

Blok tulisan Home:

Lalu klik Kanan-Make Link

Page 22: Tutorial web abdul malik karim

Lalu masukan link yang dinginkan-Lalu ok:

Apabila berasil, warna Home yang sudah diisikan link itu berubah dan ada garis Bawahnya.

Hasilnya:

Page 23: Tutorial web abdul malik karim

Apabila ingin mengisikan link ke Profile, caranya:

Blok tulisan Profile:

Lalu klik Kanan-Make Link:

Page 24: Tutorial web abdul malik karim

Lalu masukan link yang dinginkan-Lalu ok:

Apabila berasil, warna Profile yang sudah diisikan link itu berubah dan ada garis Bawahnya.

Hasilnya:

Page 25: Tutorial web abdul malik karim

Apabila ingin mengisikan link ke Galery, caranya:

Blok tulisan Galery:

Lalu klik Kanan-Make Link:

Page 26: Tutorial web abdul malik karim

Lalu masukan link yang dinginkan-Lalu ok:

Apabila berasil, warna Galery yang sudah diisikan link itu berubah dan ada garis Bawahnya.

Hasilnya:

Page 27: Tutorial web abdul malik karim

Tampilan daftar tamu

Cara membuat DATABASE

Page 28: Tutorial web abdul malik karim

Ini hasilnya :

Masukan kode koneksi :

<?

mysql_connect("localhost","root","");

mysql_select_db("bikin");

?>

Page 29: Tutorial web abdul malik karim

Masukan index.php

TERIMA KASIH… SEKIAN YANG BISA SAYA BUAT, MOHON

MAAF APABILA BUKU TUTORIAL INI TIDAK DAPAT

DIMENGERTI OLEH ANDA YANG MELIHAT BUKU

TUTORIAL INI…

<?

include "koneksi.php";

$nama=$_POST['nama'];

$alamat=$_POST['alamat'];

$ttl=$_POST['ttl'];

$email=$_POST['email'];

//cek

if (!empty($nama) || !empty($alamat) || !empty($ttl)|| !empty($email)) {

// true; insert db

$sql = "INSERT INTO buat (nama,alamat,ttl,email) VALUES ('".$nama."','".$alamat."','".$ttl."','".$email."')";

$hasil=mysql_query($sql);

if ($hasil==1)

{

echo "<script> alert ('Data Sukses Disimpan');

location='contact.php';

</script>";

}else{

echo "<script> alert ('Data Gagal Disimpan');

location='contact.php';

</script>";

}

Page 30: Tutorial web abdul malik karim

JADILAH HASIL WEB PROJECT SAYA