Lamp Iran

-----------Source Code-----------1. Membuat Database Langkah pertama dalam membuat Perancangan Website Penyewaan Lapangan Futsal Secara Online adalah membuat database dengan nama database “Pemesanan” dengan cara masuk kedalam MySQL login dengan User : root Password : 123456 Create Database Pemesanan; Use Pemesanan; Setelah itu buat table dibawah ini: a) Tabel pemesanan CREATE TABLE pemesanan(no_KTP INT UNSIGNED AUTO_INCREMENT PIMARY Key. id VARCHAR(10) NOT NULL, Kd_Lapangan INT(3). Nama VARCHAR (200). Alamat VARCHAR(200). No_Tlp INT(9).

b)

Tabel Admin CREATE TABLE `koffka`.`admin` ( `noid` INTEGER(11) UNSIGNED NOT NULL AUTO_INCREMENT, `user_name` VARCHAR(10) NOT NULL DEFAULT '', `password` VARCHAR(10) NOT NULL DEFAULT '', `name` VARCHAR(20) NOT NULL DEFAULT '', `alamat` VARCHAR(45) NOT NULL DEFAULT '', `no_telp` VARCHAR(11) NOT NULL DEFAULT '', PRIMARY KEY(`asd`)ENGINE = InnoDB;

2.

Koneksi.php Script ini digunakan untuk menghubungkan php ke server MYSQL mengkoneksikan database

L1

3.

Index.html ( halaman utama ) <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <style type="text/css">
L2

width:422px; height:323px; z-index:4; left: 248px; top: 224px; } .style9 { font-family: "Arial Black"; font-size: 14px; color: #FFFFFF; } #Layer5 { position:absolute; width:201px; height:149px; z-index:5; left: 24px; top: 491px; } .style10 {color: #FFFFFF} body,td,th { color: #ECE9D8; } body { background-color: #000000; } #Layer6 { position:absolute; width:200px; height:130px; z-index:6; left: 690px; top: 243px; } #Layer7 { position:absolute; width:417px; height:79px; z-index:7; left: 8px; top: 561px; } #Layer8 { position:absolute; width:190px; height:115px; z-index:7; left: 722px; top: 546px; } -->

4.

Daftar_Lapangan.html

L4

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <style type="text/css">
L5

z-index:4; left: 280px; top: 244px; } .style10 {color: #FFFFFF} body { background-color: #000000; } .style12 {font-family: "Bernard MT Condensed"; font-style: italic; } #Layer5 { position:absolute; width:128px; height:89px; z-index:5; left: 511px; top: 177px; } #Layer6 { position:absolute; width:244px; height:85px; z-index:6; top: 524px; left: 313px; } body,td,th { color: #CCCCCC; } -->

5.

Lapangan 1.html <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <style type="text/css">
L7

color: #FFFFFF; } #Layer2 { position:absolute; width:493px; height:26px; z-index:2; left: 146px; top: 147px; } #Layer3 { position:absolute; width:195px; height:157px; z-index:3; top: 223px; left: 8px; } #Layer4 { position:absolute; width:279px; height:77px; z-index:4; left: 280px; top: 244px; } .style10 {color: #FFFFFF} body { background-color: #000000; } #Layer5 { position:absolute; width:588px; height:157px; z-index:4; left: 223px; top: 228px; } body,td,th { color: #FFFFFF; } .style11 { font-family: "Bernard MT Condensed"; font-size: 24px; } #Layer6 { position:absolute; width:234px; height:115px; z-index:5; left: 376px; top: 401px; } #Layer7 { position:absolute; width:248px;

L8

height:115px; z-index:1; left: -13px; top: 197px; } #Layer8 { position:absolute; width:63px; height:25px; z-index:6; left: 603px; top: 353px; } .style12 {color: #FF0000} --> 6.

Lapangan 2.html <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <style type="text/css">
L 10

height:26px; z-index:2; left: 146px; top: 147px; } #Layer3 { position:absolute; width:195px; height:157px; z-index:3; top: 223px; left: 8px; } #Layer4 { position:absolute; width:279px; height:77px; z-index:4; left: 280px; top: 244px; } .style10 {color: #FFFFFF} body { background-color: #000000; } #Layer5 { position:absolute; width:588px; height:157px; z-index:4; left: 225px; top: 229px; } body,td,th { color: #FFFFFF; } .style11 { font-family: "Bernard MT Condensed"; font-size: 24px; } #Layer6 { position:absolute; width:200px; height:115px; z-index:1; left: 379px; top: 186px; } #Layer7 { position:absolute; width:256px; height:115px; z-index:5; left: 380px; top: 650px; }

L 11

.style12 {color: #FF0000} #Layer8 { position:absolute; width:63px; height:25px; z-index:6; left: 603px; top: 353px; } --> 7.

Lapangan 3.html <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <style type="text/css">
L 13

position:absolute; width:195px; height:157px; z-index:3; top: 223px; left: 8px; } #Layer4 { position:absolute; width:279px; height:77px; z-index:4; left: 280px; top: 244px; } .style10 {color: #FFFFFF} body { background-color: #000000; } #Layer5 { position:absolute; width:588px; height:98px; z-index:4; left: 223px; top: 228px; } body,td,th { color: #FFFFFF; } .style11 { font-family: "Bernard MT Condensed"; font-size: 24px; } #Layer6 { position:absolute; width:233px; height:136px; z-index:5; left: 367px; top: 389px; } #Layer7 { position:absolute; width:257px; height:115px; z-index:6; left: 356px; top: 586px; } .style12 {color: #FF0000} #Layer8 { position:absolute; width:63px; height:25px; z-index:6; left: 603px;

L 14

top: 353px; } --> 8.

Pemesanan.php <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

L 16

<style type="text/css"> <style type="text/css">
L 17

width:201px; height:149px; z-index:5; left: 17px; top: 480px; } body,td,th { color: #FF00FF; } body { background-color: #000000; } #Layer6 { position:absolute; width:200px; height:130px; z-index:6; left: 679px; top: 336px; } #Layer7 { position:absolute; width:417px; height:79px; z-index:7; left: 8px; top: 561px; } #Layer8 { position:absolute; width:402px; height:151px; z-index:7; left: 254px; top: 287px; } a:link { color: #FFFFFF; } a:active { color: #FF0000; } #Layer9 { position:absolute; width:390px; height:115px; z-index:7; left: 240px; top: 260px; } .style13 { font-family: "Bernard MT Condensed"; font-size: 24px; } -->

L 18

 

 

 

 

 

Kd_lapangan:
Nama:
Alamat:
No_tlp:
	L 19 <span class="style13">isi formulir penyewaan

 

9.

Login

L 20

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <style type="text/css">
L 21

background-image:url(My%20Pictures/gambar%20planet/architecture011.jpg); layer-background-image:url(My%20Pictures/gambar%20planet/architecture011.jpg); border:1px none #000000; z-index:1; left: 0px; top: 0px; } #Layer2 { position:absolute; width:811px; height:18px; background-image:url(My%20Pictures/gambar%20planet/architecture011.jpg); layer-background-image:url(My%20Pictures/gambar%20planet/architecture011.jpg); border:1px none #000000; z-index:2; top: 132px; left: -20px; } #Layer3 { position:absolute; width:797px; height:19px; background-image:url(My%20Pictures/gambar%20planet/architecture011.jpg); layer-background-image:url(My%20Pictures/gambar%20planet/architecture011.jpg); border:1px none #000000; z-index:3; left: 10px; top: 155px; } #Layer4 { position:absolute; width:210px; height:202px; background-image:url(My%20Pictures/gambar%20planet/architecture011.jpg); layer-background-image:url(My%20Pictures/gambar%20planet/architecture011.jpg); border:1px none #000000; z-index:4; left: 9px; top: 365px; } #Layer5 { position:absolute; width:290px; height:92px; background-image:url(My%20Pictures/gambar%20planet/architecture011.jpg); layer-background-image:url(My%20Pictures/gambar%20planet/architecture011.jpg); border:1px none #000000; z-index:5; left: 310px; top: 504px; } #Layer6 { position:absolute; width:200px; height:115px; background-image:url(My%20Pictures/gambar%20planet/architecture011.jpg);

L 22

layer-background-image:url(My%20Pictures/gambar%20planet/architecture011.jpg); border:1px none #000000; z-index:6; } #Layer7 { position:absolute; width:599px; height:465px; background-image:url(My%20Pictures/gambar%20planet/architecture011.jpg); layer-background-image:url(My%20Pictures/gambar%20planet/architecture011.jpg); border:1px none #000000; z-index:6; left: 213px; top: 184px; } #Layer8 { position:absolute; width:195px; height:125px; background-image:url(My%20Pictures/gambar%20planet/architecture011.jpg); layer-background-image:url(My%20Pictures/gambar%20planet/architecture011.jpg); border:1px none #000000; z-index:7; left: 771px; top: 349px; } body,td,th { color: #CCCCCC; } body { background-color: #000000; } #Layer9 { position:absolute; width:200px; height:1px; background-image:url(My%20Pictures/gambar%20planet/architecture011.jpg); layer-background-image:url(My%20Pictures/gambar%20planet/architecture011.jpg); border:1px none #000000; z-index:8; top: 28px; } #Layer10 { position:absolute; width:200px; height:6px; background-image:url(My%20Pictures/gambar%20planet/architecture011.jpg); layer-background-image:url(My%20Pictures/gambar%20planet/architecture011.jpg); border:1px none #000000; z-index:8; top: 166px; left: -190px; } #Layer11 { position:absolute; width:808px;

L 23

height:27px; background-image:url(My%20Pictures/gambar%20planet/architecture011.jpg); layer-background-image:url(My%20Pictures/gambar%20planet/architecture011.jpg); border:1px none #000000; z-index:8; left: 0px; top: 155px; } .style7 { font-family: "Goudy Stout"; font-size: 24px; font-style: italic; color: #FFFFFF; } .style4 { font-family: "Goudy Stout"; font-size: 18px; font-style: italic; color: #FFFFFF; } .style5 { font-family: "Goudy Stout"; font-size: 16px; font-style: italic; color: #FFFFFF; } #Layer12 { position:absolute; width:498px; height:29px; z-index:7; left: 110px; top: 156px; } .style8 {color: #00FF80} .style9 { font-family: "Bernard MT Condensed"; font-size: 36px; } -->

 

 

 

L 24

 

x

_______TAMPILAN WEBSITE_______

L 25

Halaman home.html

Halaman Daftar Lapangan

L 26

Halaman Lapangan 1

L 27

Halaman Lapangan 2

L 28

Halaman Lapangan 3

L 29

Halaman Input Pemesanan

L 30

Halaman Logi Admin

L 31

L 32