Sistem Informasi Berbasis Web pada Yanti Catering Kota Pematangsiantar

KOTA PEMATANGSIANTAR

TUGAS AKHIR

RIKO ADE SANJAYA 112406077

PROGRAM STUDI D3 TEKNIK INFORMATIKA DEPARTEMEN MATEMATIKA

FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM UNIVERSITAS SUMATERA UTARA

MEDAN 2014

KOTA PEMATANGSIANTAR

TUGAS AKHIR

Diajukan untuk melengkapi tugas dan memenuhi syarat memperoleh gelar Ahli Madya

RIKO ADE SANJAYA 112406077

PROGRAM STUDI D3 TEKNIK INFORMATIKA DEPARTEMEN MATEMATIKA

FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM UNIVERSITAS SUMATERA UTARA

MEDAN 2014

PERSETUJUAN

Judul : Sistem Informasi Berbasis Web pada Yanti Catering Kota Pematangsiantar

Kategori : Tugas Akhir Nama : Riko Ade Sanjaya Nomor Induk Mahasiswa : 112406077

Program Studi : D3 Teknik Infomatika Departemen : Matematika

Fakultas : Matematika Dan Ilmu Pengetahuan Alam Universitas Sumatera Utara

Disetujui di Medan, Juni 2014

Disetujui Oleh

Program Studi D3 Teknik Informatika Pembimbing FMIPA USU

Ketua,

Dr. Elly Rosmaini M.Si Drs. Rosman Siregar M.Si NIP. 196005201 198503 2 002 NIP : 19610107 198601 1 001

PERNYATAAN

SISTEM INFORMASI BERBASIS WEB PADA YANTI CATERING KOTA PEMATANGSIANTAR

TUGAS AKHIR

Saya mengakui bahwa tugas akhir ini adalah hasil kerja saya sendiri, kecuali beberapa kutipan dan ringkasan yang masing-masing disebut sumbernya.

Medan, Juni 2014

RIKO ADE SANJAYA 112406077

PENGHARGAAN

Puji dan syukur penulis ucapkan atas kehadirat Allah SWT yang telah memberikan Rahmat serta Hidayah kepada kita semua, sehingga berkat Karunia-Nya penulis dapat menyelesaikan Tugas Akhir dengan baik yang berjudul “Sistem Informasi Berbasis Web Pada Yanti catering kota Pematangsiantar”.

Terimakasih penulis sampaikan kepada Bapak Drs. Rosman Siregar M.Si selaku pembimbing yang telah meluangkan waktunya selama penyusunan tugas akhir. Terimakasih kepada Ibu Dr. Elly Rosmaini, M.Si dan Bapak Syahriol Sitorus, S.Si, M.IT selaku Ketua dan Sekretaris Program Studi D3 Teknik Informatika FMIPA USU, Bapak Prof. Dr. Tulus, M.Si dan Ibu Dr. Mardiningsih, M.Si selaku Ketua Departemen dan Sekertaris Departemen Matematika FMIPA USU, Bapak Dr. Sutarman M.Sc selaku Dekan FMIPA USU, seluruh Staff dan Dosen Program Studi D3 Teknik Informatika FMIPA USU, pegawai FMIPA USU dan rekan-rekan kuliah. Teristimewa kepada kedua orang tua dan keluarga dan yang selama ini memberikan bantuan dan dorongan yang diperlukan. Semoga Allah SWT akan membalasnya.

ABSTRAK

Kajian ini bertujuan untuk membangun sistem informasi pada usaha catering secara online. Sistem informasi ini dikembangkan dengan menggunakan perangkat lunak Adobe Dreamweaver CS5, Adobe Photoshop CS5, XAMPP yang merupakan gabungan dari Apache Web Server, PHP, dan MySQL, dan browser Google Chrome.

Sistem informasi ini bekerja untuk dapat melakukan pemasaran. Tujuan sistem informasi ini adalah untuk memberikan kemudahan kepada usaha konsumen untuk dapat melakukan transaksi pemasaran.

DAFTAR ISI

Halaman

Persetujuan ii

Pernyataan iii

Penghargaan iv

Abstrak v

Daftar Isi vi

Daftar Tabel viii

Daftar Gambar ix

Bab 1 Pendahuluan 1

1.1 Latar Belakang 1

1.2 Rumusan Masalah 2

1.3 Maksud dan Tujuan 2

1.4 Manfaat 3

1.5 Tinjauan Pustaka 3

1.6 Metodologi Penelitian 5

1.7 Sistematika Penelitian 6

Bab 2 Landasan Teori 8

2.1 Pengertian Sistem Informasi 8

2.2 Pengertian Komputer 11

2.3 Pengenlan Internet 12

2.3.1 Network 13

2.3.2 Web Server 13

2.3.3 World Wide Web (WWW) 14

2.3.4 Hyper Text Transfer Protocol (HTTP) 15

2.4 Pengenalan HTML 15

2.4 Pengenalan Personal Home Page (PHP) 17

2.5.1 Sejarah PHP 18

2.5.2 Variabel pada PHP 20 2.5.3 Konsep Dasar Penggunaan PHP 21

2.6 Database MySQL 22

2.7 Adobe Dreamwaver 24

2.8 Casding Style Sheet (CSS) 24

2.9 JavaSript 25

Bab 3 Perancangan Sistem 26

3.1 Data Flow Diagram (DFD) 26 3.2 Merancang Database Server 28

3.3 Perancangan Database 29

3.3.1 Flowchart Tabel Akun 29

3.3.2 Flowchart Tabel Hubungi 30

3.3.3 Flowchart Tabel Galery 30

3.3.4 Flowchart Tabel Barang 31

3.4 Flowchart 31

3.6 Tabel Flowchart 31

3.5 Perncangan Algoritma 34

3.5.1 Algoritma Hompage 34 3.5.2 Algoritma Admin 35

Bab 4 Implementasi Sistem 36

4.1 Pengertian Implementasi Sistem 37

4.2 Tujuan Implementasi 37

4.3 Komponen dalam Implementasi Sistem 37 4.3.1 Kebutuhan Perangkat Keras (Hardware) 38 4.3.2 Kebutuhan Perangkat Lunak (Software) 38 4.4 Tampilan Halaman Website 39

Bab 5 Kesimpulan dan Saran 42

5.1 Kesimpulan 42

5.2 Saran 43

Daftar Pustaka Lampiran

DAFTAR TABEL

Halaman Tabel 3.1.Tabel Simbol–Simbol Data Flow Diagram 28

Tabel 3.2 Tabel akun 29

Tabel 3.3 Tabel hubungi 30

Tabel 3.4 Tabel galerry 30

Tabel 3.5 Tabel barang 31

DAFTAR GAMBAR

Halaman

Gambar 3.1 Data Flow Diagram (DFD) 28

Gambar 3.2 Alur Flowchart Menu Utama 29 Gambar 3.3 Alur Flowchart Tabel Hubungi 30 Gambar 3.4 Alur Flowchart Tabel Galery 30 Gambar 3.5 Alur Flowchart Tabel Barang 31

Gambar 4.1 Halaman Beranda 39

Gambar 4.2 Halaman About 40

Gambar 4.3 Halaman Galery 40

Gambar 4.4 Halaman Contact 41

ABSTRAK

Kajian ini bertujuan untuk membangun sistem informasi pada usaha catering secara online. Sistem informasi ini dikembangkan dengan menggunakan perangkat lunak Adobe Dreamweaver CS5, Adobe Photoshop CS5, XAMPP yang merupakan gabungan dari Apache Web Server, PHP, dan MySQL, dan browser Google Chrome.

Sistem informasi ini bekerja untuk dapat melakukan pemasaran. Tujuan sistem informasi ini adalah untuk memberikan kemudahan kepada usaha konsumen untuk dapat melakukan transaksi pemasaran.

BAB 1

PENDAHULUAN

1.1 Latar Belakang

Dalam era globalisasi sekarang ini, komputer merupakan alat yang sangat dibutuhkan oleh banyak instansi dan perusahaan–perusahaan milik negara maupun swasta. Pemakaian komputer dewasa ini semakin berkembang pesat di segala bidang sesuai dengan kemajuan zaman. Sejalan dengan lajunya perkembangan dunia teknologi modern saat ini, banyak mengakibatkan perubahan kehidupan manusia dalam menangani setiap permasalahan yang terjadi yang ada hubungannya dengan proses pembangunan secara menyeluruh.

Kemajuan teknologi ini semakin banyak dan semakin tidak terkendali. Salah satu teknologi informasi yang paling cepat perkembangannya adalah internet. Karena melalui internet dapat diketahui segala informasi yang diperlukan dan sangat mendukung untuk informasi yang lebih baru. Dan dewasa ini hampir semua lapisan masyarakat sudah mengetahui tentang adanya internet dan semakin banyak yang tahu bagaimana cara untuk mengakses dan menggunakan jaringan internet (dalam hal ini

web page). Baik digunakan untuk kepentingan pekerjaan ataupun hanya untuk sekedar

Atas dasar inilah, maka penulis berinisiatif untuk membuat suatu sistem informasi yang dapat mempermudah jalannya suatu sistem informasi pemasaran secara online. Penulis tertarik mengangkat judul “Sistem Informasi Berbasis Web Pada Yanti Catering Kota Pematangsiantar”.

1.2 Rumusan Masalah

Kemampuan manusia dalam menyelesaikan pekerjaan yang semakin banyak dan rumit sangatlah terbatas, sehingga disini dibutuhkan suatu sistem yang dapat mengolah data dan transaksi dengan baik sehingga dapat mempercepat serta mengefisienkan pekerjaan pengolahan data dan transaksi tersebut. Untuk menghindari terjadinya kesimpang siuran dalam pembahasan masalah dengan mengingat akan keterbatasan penulis dalam hal ilmu dan keterampilan serta waktu maka penulis membatasi permasalahan hanya pada sistem informasi berbasis web melalui media internet.

Identifikasi masalahnya yaitu bagaimana cara pemasaran produk yang dihasilkan oleh usaha catering melaui media internet .

1.3 Tujuan Penelitian

Maksud dan tujuan penulis adalah untuk merancang sistem informasi berbasis web dalam hal memberikan informasi dengan tujuan agar mempermudah kinerja dari Yanti Catering Pematangsiantar secara efektif dan efesien bagi pelanggan yang membutuhkan.

1.4 Manfaat

Adapun manfaat dari sistem informasi ini adalah:

1. Untuk membantu para pembeli mendapatkan informasi tentang produk dari Yanti Catering.

2. Untuk membangun suatu sistem pemasaran yang lebih efektif dan efisien. 3. Untuk mempermudah mengolah dan mengorganisir data–data transaksi

pemasaran.

1.5 Tinjauan Pustaka

Sebagai suatu sistem informasi penjualan yang ingin dinilai baik haruslah memiliki referensi dan program aplikasi pendukung yang cukup. Oleh karena itu penulis mengumpulkan bahan bacaan guna mengumpulkan informasi yang berhubungan dengan materi yang terdapat dalam tugas akhir nantinya. Sebagai sumber bahan bacaan atau informasi tersebut penulis mendapatkannya dari perpustakaan Universitas Sumatera Utara, koleksi buku pribadi milik sendiri serta pinjaman dari teman–teman

penulis. Kemudian adapun beberapa program aplikasi pendukung dalam pembentukkan sistem informasi ini, yaitu:

1. MySQL adalah sebuah perangkat lunak manajemen basis data SQL (database

management system) atau DBMS yang multithread, multi-user, dengan sekitar

6 juta instalasi di seluruh dunia. MySQL AB membuat MySQL tersedia sebagai perangkat lunak gratis dibawah lisensi GNU General Public License (GPL), tetapi mereka juga menjual dibawah lisensi komersial untuk kasus-kasus dimana penggunaannya tidak cocok dengan penggunaan GPL.

2. Adobe Dreamweaver merupakan program yang banyak digunakan oleh pengembang web 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 yang ada dalam Adobe Creative Suite 5.5 (sering disingkat Adobe CS5.5).

3. PHP adalah sebuah program bahasa script yang tidak melakukan sebuah kompilasi dalam penggunaanya. Web Server yang mendukung php dapat ditemukan dimana-mana dari mulai IIS sampai dengan apache, dengan konfigurasi yang relatif mudah. Dalam sisi pengembangan lebih mudah, karena banyaknya milis-milis dan developer yang siap membantu dalam pengembangan. 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 sistem.

1.6 Metodologi Penelitian

Untuk menyusun tugas akhir ini, penulis melakukan penerapan metode penelitian dalam memperoleh data–data yang dibutuhkan sehingga penyusunan tugas akhir ini dapat diselesaikan dengan baik. adapun metode penelitian yang penulis lakukan adalah sebagai berikut :

1. Penelitian Lapangan (Field Research)

Penelitian ini dilakukan penulis secara langsung di lapangan, dalam hal ini penulis melakukan penelitian pada beberapa tempat catering.

2. Wawancara (Interview)

Penulis mengajukan pertanyaan langsung kepada pemilik Yanti Catering,sehingga dapat mengetahui kendala-kendala yang dihadapi.

3. Penellitian Perpustakaan (Library Research)

Penulis menggunakan buku-buku yang berhubungan dengan tujuan yang dapat membantu menyelesaikan masalah yang dapat dipakai sebagai landasan teori.

4. Pengamatan (Observasi)

Penulis melakukan pengamatan langsung ke objek penelitian untuk mengamati secara dekat masalah yang sedang duhadapi dan melakkukan pencatatan terhadap teman secara khusus.

1.7 Sistematika Penulisan

Adapun sistematika penulisan laporan Tugas ini adalah sebagai berikut :

BAB 1 : PENDAHULUAN

Dalam bab ini penulis menguraikan Latar Belakang, Rumusan Masalah, Maksud Dan Tujuan Penelitian, Batasan Masalah, Metode Penelitian dan Sistematika Penulisan.

BAB 2 : LANDASAN TEORI

Dalam bab ini penulis menguraikan beberapa hal yang berhubungan dengan aplikasi web dinamis yang ingin dibangun penulis yaitu sejarah singkat internet, World Wide Web, HTML (HyperText Markup

BAB 3 : PERANCANGAN SISTEM

Dalam bab ini penulis menguraikan tentang perancangan sistem yang dirancang yang meliputi perancangan layout, perancangan

database, gambaran aplikasi web yang akan dibuat serta bagaimana

algoritma aplikasi tersebut saat dijalankan.

BAB 4 : IMPLEMENTASI SISTEM

Dalam bab ini penulis menyajikan tentang pengertian implementasi sistem, tujuan implementasi sistem serta spesifikasi aplikasi.

BAB 5 : KESIMPULAN DAN SARAN

BAB 2

LANDASAN TEORI

2.1 Pengertian Sistem Informasi

Suatu sistem pada dasarnya adalah sekolompok unsur yang erat hubungannya satu dengan yang lain, yang berfungsi bersama–sama untuk mencapai tujuan tertentu. Secara sederhana, suatu sistem dapat diartikan sebagai suatu kumpulan atau himpunan dari unsur, komponen, atau variabel yang terorganisir, saling berinteraksi, saling tergantung satu sama lain dan terpadu. Dari defenisi ini dapat dirinci lebih lanjut pengertian sistem secara umum, yaitu :

1. Setiap sistem terdiri dari unsur–unsur.

2. Unsur – unsur tersebut merupakan bagian terpadu sistem yang bersangkutan. 3. Unsur sistem tersebut bekerja sama untuk mencapai tujuan sistem.

4. Suatu sistem merupakan bagian dari sistem lain yang lebih besar.

Secara umum, informasi dapat didefinisikan sebagai hasil dari pengolahan data dalam suatu bentuk yang lebih berguna dan lebih berarti bagi penerimanya. Hal ini menggambarkan suatu kejadian–kejadian yang nyata dan digunakan untuk

pengambilan keputusan. Informasi merupakan data yang telah diklasifikasikan atau diolah atau di interpretasi untuk digunakan dalam proses pengabilan keputusan.

Sistem informasi adalah suatu sistem dalam suatu organisasi yang mempertemukan kebutuhan pengolahan transaksi harian. Sistem informasi mendukung fungsi operasi organisasi yang bersifat manajerial, dengan kegiatan strategi dari suatu organisasi untuk dapat menyediakan kepada pihak luar tertentu dengan informasi yang diperlukan untuk pengambilan keputusan. Sistem informasi dalam suatu organisasi dapat dikatakan sebagai suatu sistem yang menyediakan informasi bagi semua tingkatan dalam organisasi tersebut kapan saja diperlukan. Sistem ini menyimpan, mengambil, mengubah, mengolah dan mengkomunikasikan informasi yang diterima dengan menggunakan sistem informasi atau peralatan sistem lainnya.

Sistem informasi terdiri dari komponen–komponen yang disebut blok bangunan (building blok), yang terdiri dari komponen input, komponen model, komponen output, komponen teknologi, komponen hardware, komponen software, komponen basis data, dan komponen kontrol. Semua komponen tersebut saling berinteraksi satu dengan yang lain membentuk suatu kesatuan untuk mencapai sasaran.

1. Komponen input mewakili data yang masuk ke dalam sistem informasi. Input disini termasuk metode dan media untuk menangkap data yang akan dimasukkan, yang dapat berupa dokumen–dokumen dasar.

2. Komponen model terdiri dari kombinasi prosedur, logika, dan model matematika yang akan memanipulasi data input dan data yang tersimpan di basis data dengan cara yag sudah ditentukan untuk menghasilkan keluaran yang diinginkan.

3. Komponen output adalah hasil dari sistem informasi atau keluaran yang merupakan informasi yang berkualitas dan dokumentasi yang berguna untuk semua pemakai sistem.

4. Komponen teknologi merupakan “tool box” dalam sistem informasi. Teknologi digunakan untuk menerima input, menjalankan model, menyimpan, mengakses data, menghasilkan dan mengirimkan keluaran, serta membantu pengendalian dari sistem secara keseluruhan.

5. Komponen hardware berperan penting sebagai suatu media penyimpanan vital bagi sistem informasi, yang berfungsi sebagai tempat untuk menampung

database atau lebih mudah dikatakan sebagai sumber data dan informasi untuk

memperlancar dan mempermudah kerja dari sistem informasi.

6. Komponen software berfungsi sebagai tempat untuk mengolah, menghitung dan memanipulasi data yang diambil dari hardware untuk menciptakan suatu informasi.

7. Komponen basis data (database) merupakan kumpulan data yang saling berkaitan dan berhubungan satu dengan yang lain, tersimpan diperangkat keras komputer dan menggunakan perangkat lunak untuk memanipulasinya. Data perlu disimpan dalam basis data untuk keperluan penyediaan informasi lebih lanjut. Data di dalam basis data perlu diorganisasikan sedemikian rupa supaya informasi yang dihasilkan berkualitas. Organisasi basis data yang baik juga berguna untuk efisiensi kapasitas penyimpanannya. Basis data diakses atau

dimanipulasi menggunakan perangkat lunak paket yang disebut DBMS

(Database Management System).

8. Komponen kontrol. Banyak hal yang dapat merusak sistem informasi, seperti bencana alam, api, temperatur, air, debu, kecurangan–kecurangan, kegagalan – kegagalan sistem itu sendiri, ketidakefisienan, sabotase dan lain sebagainya. Beberapa pengendalian perlu dirancang dan diterapkan untuk meyakinkan bahwa hal–hal yang dapat merusak sistem dapat dicegah ataupun bila terlanjur terjadi kesalahan–kesalahan dapat langsung cepat diatasi.

2.2 Pengertian Komputer

Istilah komputer mempunyai arti yang luas dan berbeda.Istilah Komputer (computer) diambil dari bahasa Latin Computare yang berarti menghitung (to compute).Berikut ini adalah beberapa defenisi tentang komputer yang disajikan oleh beberapa buku komputer:

1. Menurut Robert H.Blissmer (1985), komputer adalah suatu alat elektronik yang mampu melakukan beberapa tugas seperti menerima input, memproses input sesuai dengan programnya, menyimpan perintah-perintah dan hasil dari pengolahan dan menyediakan output dalam bentuk nformasi.

2. Menurut Donald H. Sanderes (1930;35), komputer adalah sistem elektronik untuk memanipulasi data yang cepat dan tepat dirancang dan diorganisasikan supaya secara otomatis menerima dan menyimpan data input,memprosesnya,dan menghasilkan output di bawah pengawas suatu

langkah-langkah intruksi program yang tersimpan di memori (stored program).

3. Menurut V. C. Hamacher, Z. G. Zaky (2001), komputer adalah mesin penghitung elektronik yang dengan cepat dapat menerima informasi input digital,memprosesnya sesuai dengan program yang tersimpan di memorinya dan menghasilkan output infomasi.

4. Menurut Gordo B. Devis (1973), komputer adalh tipe khusus alat perhitungan yang mempunyai sifat tertentu yang pasti.

Dari beberapa pengertian di atas dapat disimpulkan bahwa komputer adalh suatu alat elektronik yang menerima input data, mengolah data, memberikan informasi dengan menggunakan suatu program yang tersimpan di memri komputer ( stored program) serta dapat menyimpan program dan hasil dari pengolahan secara otomatis.

2.3 Pengenalan Internet

Internet (Interconnected Network) merupakan jaringan komputer yang terdiri dari

jaringan independen yang dihubungkan satu dengan yang lainnya. Secara etimologis,

internet berasal dari bahasa Inggris yakni Inter berarti antar dan Net yang berarti

jaringan sehingga dapat diartikan hubungan antar jaringan.

Internet merupakan jaringan komputer yang tersebar luas di dunia. Sampai saat

ini internet sudah menghubungkan lebih dari 1 juta jaringan komputer dengan

lazim disebut dengan World Wide Web, yang secara ringkas internet adalah sumber informasi dan alat komunikasi serta hiburan.

2.3.1 Network

Network adalah jaringan sistem komunikasi data yang melibatkan sebuah atau lebih

sistem komputer yang dihubungkan dengan jalur transmisi alat komunikasi membentuk satu sistem. Dengan network, komputer yang satu dapat menggunakan data di komputer lain, dapat mencetak laporan di printer komputer lain, dapat memberi berita ke komputer lain walaupun berlainan area. Network merupakan cara yang sangat berguna untuk mengintegrasikan sistem informasi dan menyalurkan arus informasi dari satu area ke area lainnya.

2.3.2 Web Server

Web server adalah internet server yang mampu untuk melayani koneksi perpindahan

data dalam protokol http web server dari internet server di samping e-mail. Dikarenakan web server dirancang untuk menampilkan data, dimulai dari teks,

hypertext, gambar, yang merupakan keunggulan dari web sehingga web tidak hanya

dapat diterima di universitas tetapi di seluruh perusahaan komersial yang dapat menampilkan datanya dalam internet. Macam–macam web server antara lain :

1. Apache (Open Source). 2. Xitami.

3. IIS. 4. PWS.

Website (situs web) merupakan alamat (URL) yang berfungsi sebagai tempat

penyimpanan data dan informasi dengan berdasarkan topik tertentu. URL adalah suatu sarana yang digunakan untuk menentukan lokasi informasi pada suatu web server. Situs atau web dapat dikategorikan menjadi 2 yaitu :

1. Web Static, yaitu web yang berisi atau menampilkan infomasi–informasi

yang sifatnya statis (tetap).

2. Web Dinamic, yaitu web yang menampilkan informasi serta dapat berinteraksi

dengan user yang sifatnya dinamis.

2.3.3 World Wide Web (WWW)

World Wide Web (WWW) adalah jaringan tak terbatas komputer yang dikategorikan

menjadi dua, yaitu Client dan Server dengan menggunakan software khusus membentuk sebuah jaringan yang disebut jaringan client–server. Pada prinsipnya

World Wide Web bekerja dengan cara menampilkan file–file HTML yang berasal dari

server web pada program client khusus, yaitu browser web. Program browser web

pada client mengirimkan permintaan kepada server web, yang kemudian akan dikirimkan oleh server dalam bentuk HTML. File HTML berisi instruksi yang

diperlukan untuk membentuk tampilan. Perintah–perintah HTML ini kemudian diterjemahkan oleh browser web sehingga isi informasinya dapat ditampilkan secara visual kepada pengguna. ( Tutang, 2001 )

2.3.4 Hyper Text Transfer Protocol (HTTP)

Hyper Text Transfer Protocol (HTTP) adalah suatu protokol yang menentukan

aturan yang perlu diikuti oleh web browser dalam menyediakan dokumen yang diminta web browser. Protokol ini merupakan protokol standar yang digunakan untuk mengakses dokumen HTML. Apabila kita menjelajah web dan pada address tertulis seperti http://www.google.com ini merupakan salah satu penggunan protokol HTTP dalam web. ( Tutang, 2001 )

2.4 Pengenalan HTML

Hypertext Markup Language (HTML) adalah script di mana kita bisa menampilkan

informasi dan daya kreasi kita lewat internet. HTML sendiri adalah suatu dokumen teks biasa yang mudah dimengerti dibanding bahasa pemrograman lainnya, dan karena bentuknya itu maka HTML dapat dibaca oleh berbagai platform seperti Windows, Linux, dan Macintosh. Kata “Markup Language“ pada HTML menunjukkan fasilitas yang berupa tanda tertentu dalam skrip HTML dimana kita bisa mengatur judul, garis, tabel, gambar, dan lain–lain dengan perintah yang telah ditentukan pada elemen HTML.

Penamaan dokumen HTML dapat dilakukan dengan memilih suatu nama, sembarang nama, kemudian menambahkan sebuah ekstensi “.htm” atau “.html” (tanda kutip tidak perlu dituliskan karena digunakan sebagai penjelas saja).

HTML sendiri dikeluarkan oleh W3C (World Wide Web Consortium), setiap terjadi perkembangan level HTML, harus dievaluasi ketat dan disetujui oleh W3C. Hingga kini versi terakhir HTML yang telah disetujui oleh W3C HTML4.01.

HTML terdiri dari beberapa bagian yang fungsinya sebagai penanda suatu kelompok perintah tertentu, misalnya kelompok perintah form yang ditandai dengan kode <form>, judul dengan <title> dan sebagainya. Untuk mengetahui lebih lanjut mengenai bagian – bagian HTML perhatikan skema di bawah ini:

<html>

<head>

<title> </title>

</head>

<body>

isi dari halaman web </body>

</html>

Keterangan:

1. Dokumen HTML selalu diawali dengan tanda tag pembuka <html> dan diakhiri dengan tanda tag penutup </html>.

2. Pada elemen head <head> </head>, dapat kita sisipkan kode – kode untuk menuliskan keterangan tentang dokumen HTML. Atau dapat juga kita sisipkan kode – kode pemrograman web seperti JavaScript, VBScripts, atau CSS untuk menambah daya tarik pada situs yang kita buat agar lebih menarik dan dinamis.

3. Elemen body <body> </body> berisi tag – tag untuk isi atau layout tampilan situs kita, seperti <font></font>, <table></table>, <form></form>.

Jadi jelas bahwa elemen adalah suatu bagian yang besar yang terdiri dari kode tag tersebut. Sedangkan tag hanyalah merupakan bagian dari elemen. Tag adalah kode – kode yang digunakan untuk men-setting dokumen HTML. Secara garis besar bentuk umum tag adalah sebagai berikut: <tag-awal>TEKS</tag-akhir>. Namun ada juga tag yang tidak perlu ada penutup seperti <br>, <hr>, <img>, dan lain – lain.

2.5 Pengenalan Personal Home Page (PHP)

PHP adalah singkatan dari Personal Home Page yang merupakan bahasa standar yang digunakan dalam dunia website. PHP adalah bahasa pemrograman yang berbentuk

script yang diletakkan didalam server web. Kelebihan PHP dari bahasa pemrograman

lain :

1. Bahasa pemrograman PHP adalah sebuah bahasa script yang tidak melakukan sebuah kompilasi dalam penggunaanya.

mulai IIS sampai dengan apache, dengan konfigurasi yang relatif mudah. 3. Dalam sisi pengembangan lebih muda h, karena banyaknya milis–milis dan

developer yang siap membantu dalam pengembangan.

4. Dalam sisi pemahamanan, PHP adalah bahasa scripting yang paling mudah karena referensi yang banyak.

PHP adalah bahasa open source yang dapat digunakan diberbagai mesin (Linux, Unix, Windows) dan dapat dijalankan secara runtime melalui console serta juga dapat menjalankan perintah–perintah sistem. Sistem database yang didukung oleh PHP adalah :

1. Oracle 2. Sybase 3. MySQL

2.5.1 Sejarah PHP

PHP pertama kali dibuat oleh Rasmus Lerdorf pada tahun 1995. Pada waktu itu PHP bernama FI (Form Interpreted). Pada saat tersebut PHP adalah sekumpulan

script yang digunakan untuk mengolah data form dari web.

Perkembangan selanjutnya adalah Rasmus melepaskan kode sumber tersebut dan menamakannya PHP/FI, pada saat tersebut kepanjangan dari PHP/FI adalah Personal Home Page/Form Interpreter. Dengan pelepasan kode sumber ini

menjadi open source, maka banyak programmer yang tertarik untuk ikut mengembangkan PHP.

Pada November 1997, dirilis PHP/FI 2.0. Pada rilis ini interpreter sudah diimplementasikan dalam C. Dalam rilis ini disertakan juga modul–modul ekstensi yang meningkatkan kemampuan PHP/FI secara signifikan. Sebuah perusahaan bernama Zend, menulis ulang interpreter PHP menjadi lebih bersih, lebih baik dan lebih cepat. Kemudian pada Juni 1998 perusahaan tersebut merilis interpreter baru untuk PHP dan meresmikan nama rilis tersebut menjadi PHP 3.0.

Pada pertengahan tahun 1999, Zend merilis interpreter PHP baru dan rilis tersebut dikenal dengan PHP 4.0. PHP 4.0 adalah versi PHP yang paling banyak dipakai. Versi ini banyak dipakai sebab versi ini mampu dipakai untuk membangun aplikasi web kompleks tetapi tetap memiliki kecepatan proses dan stabilitas yang tinggi.

Pada Juni 2004, Zend merilis PHP 5.0. Versi ini adalah versi mutakhir dari PHP. Dalam versi ini, inti dari interpreter PHP mengalami perubahan besar. Dalam versi ini juga dikenalkan model pemrograman berorientasi objek baru untuk menjawab perkembangan bahas pemrograman ke arah pemrograman berorientasi objek.

2.5.2 Variabel pada PHP

Variabel dapat disebut sebagai sebuah tempat penyimpanan data bagi nilai numeris maupun non numeris, agar dapat digunakan pada bagian lain dari script program PHP. PHP mendukung berbagai jenis variabel yaitu:

1. Integer (bilangan bulat).

2. Bilangan floating point (presisi tunggal, ganda).

3. Boolean.

2. Null (untuk variabel yang belum diset).

3. String dan Array.

4. Object.

5. Resource.

Jika menggunakan bahasa pemrograman C atau Pascal, maka kita harus mendefinisikan variabel tiap elemen, namun pada PHP kita tidak perlu mendefinisikan terlebih dahulu jenis variabel sebelum menggunakannya. PHP memiliki kepandaian untuk membedakan jenis variabel secara otomatis berdasarkan konteks yang sedang berlaku bagi variabel tersebut.

Setiap variabel dalam PHP selalu dimulai dengan tanda dolar ("$") dan harus dimulai dengan huruf dan dapat diikuti oleh huruf dan angka. Dengan demikian, $warpspeed, $impuls_speed, $LCAR dan $Dilithium1 adalah contoh penamaan

Setiap variabel dalam PHP peka terhadap perbedaan huruf kapital dan non kapital, sehingga $subspace, $SubSpace, dan $SUBSPACE adalah tiga buah variabel yang berbeda.

2.5.3 Konsep Dasar Penggunaan PHP

Kode PHP diawali dengan tanda lebih kecil (<) dan diakhiri dengan tanda lebih besar (>). Ada empat cara untuk menuliskan script PHP yaitu :

1. <? Apa kabar.. ?>

2. <?php Apa kabar.. ?>

3. <% Apa kabar.. %>

4. <SCRIPT LANGUAGE=”php”> Apa kabar..</SCRIPT>

Pemisah antar instruksi adalah titik koma (;) dan untuk membuat atau menambahkan komentar standar penulisan adalah : /* komentar */, // komentar, # komentar. Cara penulisan dibedakan menjadi Embeded dan Non Embeded script.

1. Embeded Script

Contoh dari Embeded script : <html>

<head>

<title>Coba</title> </head>

<body>

<?php echo ”web developer”; ?> </body>

</html>

Script diatas merupakan script yang sederhana. Script PHP disisipkan diantara

tag – tag html.

2. Non Embeded Script

Contoh dari Non Embeded Script :

<?php echo”<html>”; echo”<head>”; echo”<title>”;

echo”we learn about php”; echo”</title>”; echo”</head>”; echo”<body>”; echo”<p> My Project </p>”; echo”</body>”; echo”</html>”;

?>

Script ini digunakan murni pembuatan program dengan PHP, tag HTML yang

dihasilkan untuk membuat dokumen merupakan bagian dari script PHP. (Syafii, 2005)

2.6 Database MySQL

MySQL adalah salah satu jenis database server yang sangat terkenal. Kepopulerannya

disebabkan MySQL menggunakan Structure Query Language (SQL) sebagai bahasa dasar untuk mengakses database-nya. Selain itu, ia bersifat gratis (tidak perlu

membayar untuk menggunakannya) pada berbagai platform (kecuali pada Windows, yang bersifat shareware atau perlu membayar setelah melakukan evaluasi dan memutuskan untuk digunakan untuk kepeluan produksi). Perangkat lunak MySQL sendiri bisa didownload dari http://www.mysql.org atau http://www.mysql.com.

MySQL termasuk jenis Relation Database Management Sistem (DBMS). Pada

MySQL, sebuah database mengandung satu atau sejumlah tabel. Tabel terdiri atas

sejumlah baris dan setiap baris mengandung satu atau beberapa kolom.

Dalam menjalan MySQL diperlukan berbagai perintah untuk membuat suatu

database, berikut ini disebutkan beberapa perintah dasar dalam menggunakan

MySQL. Untuk menjalankan MySQL pertama kali cukup dengan mengetikkan mysql

–u root -p pada Command Prompt. Perintah-perintahnya adalah sebagai berikut :

1. Menampilkan database : SHOW DATABASES;

2. Membuat database baru : CREATE DATABASE nama_database; 3. Memilih database yang akan digunakan : USE nama_database; 4. Menampilkan tabel : SHOW TABLES;

5. Membuat tabel baru : CREATE TABLE nama_tabel (field spesifikasi_field,...); 6. Menampilkan struktur tabel : SHOW COLUMNS FROM nama_tabel; atau

DESCRIBE nama_tabel;

7. Mengubah struktur tabel : ALTER TABLE nama_tabel Jenis_Pengubahan; 8. Mengisikan data pada tabel : INSERT INTO nama_tabel (kolom1,...) VALUES

(data_kolom1,..) atau INSERT INTO tabel SET kolom1 = data_kolom1,...;

10.Mengubah data pada tabel : UPDATE nama_tabel SET kolom = pengubahan_data WHERE kriteria;

11.Menghapus data pada tabel : DELETE FROM nama_tabel WHERE kriteria; 12.Menghapus tabel : DROP nama_tabel;

13.Menghapus database : DROP nama_database; 14.Keluar dari MySQL : QUIT atau EXIT;

2.7 Adobe Dreamwaver

Adobe Dreamwaver merupakan pengembangan dari Macromedia Dreamwaver MX semenjak perusahaan Macromedia dimiliki oleh perusahaan software Adobe Inc.

Software ini merupakan salah satu software terpopuler dalam bidang desain web.

Dalam versinya saat ini, Adobe Dreamwaver CS5 dapat menggabungkan fungsi penulisan script client side dan server side menjadi satu dan mampu mengolah beberapa script pemrograman berbasis server side yang sangat terkenal seperti ASP dan PHP. Dengan fasilitasnya yang kaya warna, penuh icon, dan user interface yang menarik. Adobe Dreamwaver CS5 sungguh berbeda dengan logo versi generasi sebelumnya yang terkesan formal.

2.8 Cascading Style Sheet (CSS)

CSS merupakan kependekan dari Cascading Style Sheet yang berfungsi untuk mengatur tampilan dengan kemampuan jauh lebih baik dari tag maupun atribut

standar HTML (Hyper Text Markup Language). CSS sebenarnya adalah suatu kumpulan atribut untuk fungsi format tampilan dan dapat digunakan untuk mengontrol tampilan banyak dokumen secara bersama. Keuntungan menggunakn CSS yaitu jika kita ingin mengubah format dokumen, maka tidak perlu mengedit satu persatu.

Penggunaan CSS ada dua cara yaitu dengan menyisipkan kode CSS langsung dalam kode HTML atau simpan file tersendiri berekstensi “.css”. dengan menyimpan sebagai file tersendiri akan lebih memudahkan untuk mengontrol tampilan dalam banyak dokumen secara langsung. CSS mendapat dukungan penuh pada browser versi 4 (empat) dan pada versi sebelumnya. Perlu diketahui bahwa tampilan CSS dapat berbeda bila ditampilkan pada menu browser yang berbeda pula. (Abdullah, 2003)

2.9 JavaScript

JavaScript mulanya bernama LiveScript, dikembangkan pertama kali pada tahun 1995

di Netscape Communication. Pada akhir tahun 1995 Netscape Communication dan

Sun Microsystem berkolaborasi dan mengganti nama LiveScript menjadi JavaScript.

JavaScript adalah bahasa script yang ditempatkan pada kode HTML dan

diproses pada sisi client. Dengan adanya bahasa ini maka kemampuan dokumen HTML menjadi lebih luas. Sebagai contoh, digunakan untuk validasi masukan formulir sebelum diproses ke tahap selanjutnya. Bisa untuk membuat permainan interaktif dan juga bisa untuk menambah designweb.

BAB 3

PERANCANGAN SISTEM

3.1 Data Flow Diagram (DFD)

Dalam perancangan sistem informasi ini penulis menggunakan MySQL sebaagai aplikasi database yang dapat berjalan pada server jaringan, dan merupakan free software (perangkat lunak yang gratis penggunaannya). PHP dan MySQL merupakan pasangan aplikasi untuk merancang sistem informasi. Penulis juga merancang beberapa animasi dan warna-warna yang menarik untuk tampilan menu utama sehingga menambah daya tarik pengguna yang mengunjungi. Selama membuat suatu rancangan masukan-masukan, keluaran-keluaran penulis juga mempersiapkan dokumen-dokumen, file-file sistem, fasilitas perangkat lunak (software). Penulis membuat suatu rancangan sistem informasi yang benar-benar bermanfaat dengan menghasilkan informasi yang benar (program lembaran atau listing program).

Membuat sustu situs memrlukan persiapan yang baik, tujuan yang jelas dari percobaan yang berulang-ulag karena semua elamen yang membentuk situs. Sebelum

membangun situs, perllu dilakukan identifikasi awal antara lain: a. Situs apa yang ingin dibuat?

b. Apa saja aktivitas yang dapat dilakukan dalam situs?

c. Apa terget yang ingin dicapai dari pembuatan situs tersebut?

Dengan menjawab pertanyaan-pertanyaan di atas , aan semakin memperjelas dan mempermudah dalam membangun situs karena nantinya akan terbentuk kata kunci untuk membuat dan mengembangkan situs lebih lanjut. Berkenaan dengan situs yang akan dibangun, jawaban untuk pertanyaan di atas sebagai berikut:

a. Situs yang akan dibuat adalah situs catering, dalam hal ini adalah Yanti Catering yang menyediakan informasi-informasi mengenai catering tersebut.

b. Aktivitas yang akan dijumpai dari situs tersebut adalah pengunjung dapat mengetahui informasi seputar Yanti Catering.

c. Target yang akan dicapai dari situs tersebut adalah pengunjung menadapatkan informasi tentang Yanti Catering.

Kemudian langkah selanjutnya adalah membuat outline atau garis dari situs tersebut.Di samping itu, juga dapat mempermudah dalam mengatur kode dan file HTML-nya.

3.2 Mempersiapkan Database Server

Pada tahap ini dipersiapkan tempat untuk menampung data dari server, data tersebut nantinya akan diproses oleh program yang dibuat pada tahap pemograman, baik penambahan, pengeditan, penghapusan, penampilan isi database kehalaman web.

Tabel 3.1 Simbol-simbol Data Flow Diagram

No. Simbol Fungsi

1. Eksternal Entity merupakan kesatuan di luar lingkungan system yang dapat berupa seseorang, organisasi yang dapat mengirimkan data atau menerima data dari sistem.

2. Arus data merupakan tempat mengalirnya informasi menunjukan arus data berupa sistem. 3. Proses merupakan pengolahan data atau aliran

data masuk menjadi data aliran keluar.

4. Penyimpanan data merupakan tempat penyimpanan data yang ada di dalam sistem.

3.3 Perancangan Database

Database adalah kumpulan dari data yang berhubungan antara yang satu dengan yang

lainnya, tersimpan diperangkat keras komputer dan menggunakan perangkat lunak untuk memanipulasinya. Database merupakan salah satu komponen yang penting dalam sistem komputerisasi, karena database merupakan kumpulan dari beberapa file, dalam hal ini file–file tersebut dikelompokan secara terstruktur dalam beberapa table sesuai dengan informasi yang terkandung di dalamnya. Berikut ini rancangan table yang penulis gunakan dalam membangun sistem informasi :

a. Tabel akun terdiri dari :

Table 3.2 Tabel User

Nama Field Tipe Data Lebar Data

Id_hubungi Int 10

username Varchar 25

b. Tabel Hubungi terdiri dari :

Table 3.3 Tabel Hubungi

Nama Field Tipe Data Lebar Data

id_hubungi Int 10

nama Varchar 100

email Varchar 100

alamat Varchar 100

pesan Varchar 100

c. Tabel galery terdiri dari :

Table 3.4 Tabel galery

Nama Field Tipe Data Lebar Data

id_galery Int 10

gambar Varchar 255

d. Tabel barang terdiri dari :

Table 3.5 Tabel barang

Nama Field Tipe Data Lebar Data

id_barang Int 10

Nama_barang Varchar 100

gambar Varchar 100

keterangan Varchar 100

3.4 Flowchart

Flowchart adalah sekumpulan simbol–simbol yang menunjukan atau menggambarkan

rangkaian kegiatan–kegitan program dari awal hingga akhir. Jadi flowchart juga dapat digunakan untuk menggambarkan urutan langkah–langkah pekerjaan dalam suatu

algoritma. Penjelasan arti dari lambang–lambang flowchart dapat didefinisikan seperti

tabel dibawah ini :

Tabel 3.6 Arti lambang – lambang Flowchart

No. Simbol Fungsi

1 Terminator, untuk memulai dan mengakhiri suatu

2 Process, suatu simbol yang menunjukan setiap pengolahan yang dilakukan oleh komputer.

3 Data, untuk memasukkan data maupun menunjukan hasil dari suatu proses.

4 Decision, suatu kondisi yang akan menghasilkan

beberapa kemungkinan jawaban atau pilihan.

5 Preparation, suatu simbol untuk menyediakan

tempat – tempat pengolahan data dalam storage.

6 Connector, suatu simbol untuk masuk dan keluarnya

suatu prosedur pada lembar kertas yang sama.

7 Arus atau flow, suatu prosedur yang dapat dilakukan dari atas ke bawah, bawah ke atas, dari kiri ke kanan atau dari kanan ke kiri.

8 Off-page Connector, suatu simbol untuk masuk dan

keluarnya prosedur pada lembar kertas yang lain.

9 Document, suatu simbol untuk data yang berbentuk

Tidak

Tidak

Tidak

Tidak

Tidak

Tidak

Tidak

Tidak

Ya

Ya

Ya

Ya

Ya

Ya

Ya

Ya 3.3.1 Flowchart Menu Utama

Flowchart menu utama dapat dilihat pada gambar dibawah ini:

Gambar 3.1 Alur Flowchart Menu Utama Finish

Start

Tampilan Web

Pilih Link Pada

Beranda

About

Galery

Contact

Download

Kontak Kami

Tentang Kami

Login

Tampilan Beranda

Tampilan About

Tampilan Galery

Tampilan Contact

Tampilan Download

Tampilan Kontak

Tampilan Tentang

3.5 Perancangan Algoritma

Algoritma merupakan suatu cara menganalisa (menjelaskan) urutan dan hubungan kegiatan–kegiatan yang dilakukan untuk memecahkan suatu permasalahan sehingga tercapai tujuan yang diinginkan.

3.5.1 Algoritma Homepage

Berfungsi untuk menampilkan tampilan utama web, dengan pilihan menu antara lain : Beranda, About, G a l e r y, Contact, Download dan Admin.

Algorit ma Home

Langkah I : Pilih menu Home.

Langkah II : Menampilkan halaman utama website.

Algorit ma About

Langkah I : Pilih menu About.

Langkah II : Menampilkan tentang Yanti Catering .

Algorit ma Galery

Langkah I : Pilih menu Galery.

Langkah II : Menampilkan Foto dar Yanti Catering.

Algorit ma Login

Langkah I : Pilih menu Login

Langkah II : Menampilkan form isian untuk login user atau .

3.5.2 Algoritma Admin

Berfungsi untuk menampilkan tampilan web, dengan pilihan menu antara lain : Tampilan

database, hapus dan Logout.

Algorit ma Logout

Langkah I : Pilih menu Logout

BAB 4

IMPLEMENTASI SISTEM

4.1 Pengertian Implementasi Sistem

Setelah dianalisis, dirancang secara rinci teknologi telah diseleksi dan dipilih. Tiba saatnya, sistem untuk di implementasikan. Implementasi sistem adalah langkah atau prosedur yang dilakukan dalam menyelesaikan desain sistem yang telah disetujui, untuk menguji, meng-install, dan memulai sistem baru atau sistem yang diperbaiki untuk menggantikan sistem yang lama, sedangkan tahap implementasi sistem merupakan tahap meletakkan sistem agar sistem dapat siap untuk dioperasikan. Tahap implementasi sistem terdiri dari langkah-langkah sebagai berikut ini :

1. Menerapkan rencana implementasi. 2. Melakukan kegiatan implementasi. 3. Tindak lanjut implementasi.

4.2 Tujuan Implementasi

Adapun tujuan–tujuan dari implementasi sistem, yaitu :

1. Mengkaji rangkaian sistem baik dari segi software maupun hardware sebagai sarana pengolah data dan penyaji informasi.

2. Menyelesaikan rancangan sistem yang ada dalam dokumen sistem yang baru atau yang telah disetujui.

3. Memastikan bahwa pemakai dapat mengoperasikan dengan mudah terhadap sistem yang baru dan mendapat informasi yang baik dan jelas.

4. Memperhitungkan bahwa sistem telah memenuhi permintaan pemakai yaitu dengan menguji sistem secara menyeluruh.

5. Memastikan bahwa sistem telah berjalan lancar dengann mengontrol dan melalukan instalasi secara benar.

4.3 Komponen Dalam Implementasi Sistem

Agar perancangan sistem yang telah kita kerjakan dapat berjalan baik atau tidak, maka perlu dilakukan pengujian terhadap sistem yang telah dikerjakan. Untuk itu dibutuhkan beberapa komponen utama yang mencakup perangkat keras (hardware), perangkat lunak (software).

4.3.1 Kebutuhan Perangkat Keras (Hardware)

Perangkat keras (hardware) merupakan komponen–komponen peralatan yang membentuk suatu sistem komputer dan peralatan–peralatan tambahan lainnya yang mungkin komputer menjalankan tugasnya sesuai dengan yang diberikan. Komponen ini bersifat nyata secara fisik, artinya dapat dilihat dan dipergunakan, misalnya monitor, CPU (Central Processing Unit), printer, keyboard, dan mouse.

Spesifikasi perangkat keras komputer yang digunakan dalam pembuatan website ini adalah :

1. Personal Computer dengan Processor min Intel Core i3.

2. Memory 2048 MB.

3. Monitor Width 15,6” resolution 1024x768. 4. Hardisk sebagai media penyimpan.

5. DVDR/W.

4.3.2 Kebutuhan Perangkat Lunak (Software)

Hardware tidak dapat menyelesaikan masalah tanpa adanya software. Software

merupakan komponen di dalam sistem data berupa program atau instruksi untuk mengontrol suatu sistem. Perangkat lunak yang diperlukan untuk menjalankan perangkat kerasnya adalah:

1. Windows 8 Professional 2. Apache

3. MySQL 4. Browser

5. Macromedia Dreamweaver 8/Adobe Dreamweaver CS5

4.4 Tampilan Halaman Website

Untuk menjalankan system guna web browser pada pengujian ini penulis menggunakan web browser Mozilla Firefox dan Google Chrome setelah web browser jalan, ketikkan pada addres bar http://localhost/yanticatering/index.php untuk pengetesan halaman utama. Halaman utama sistem tersebut seperti pada gambar berikut :

Gambar 4.2 Halaman About

Gambar 4.4 Halaman Galery

BAB 5

KESIMPULAN DAN SARAN

5.1 Kesimpulan

Setelah dilakukan perancangan, pembuatan, implementasi dan pengujian Sistem Informasi Berbasis Web Pada Yanti Catering Kota Pematangsiantar, kesimpulan yang diperoleh adalah sebagai berikut:

1. Sistem informasi ini dapat membantu mempermudah pemasaran .

2. Dengan adanya sistem informasi ini, Konsumen lebih mudah untuk mencari informasi tentang Yanti Catering.

3. Sistem informasi ini adalah sarana untuk memasarkan produk dengan mudah tanpa mengeluarkan biaya yang besar.

4. Sistem informasi ini berhubungan langsung dengan database, sehingga mempermudah untuk mengatur dan mengelola data.

5.2 Saran

Adapun saran penulis dalam merancang dan membuat sistem informasi ini, yaiu:

1. Lebih mengembangkan sistem informasi pemasaran yang lebih baik, aman dan terpercaya.

2. Setiap usaha dapat memasarkan setiap produknya secara online .

3. Lebih mengefesienkan dan mengefektifkan penggunaan database.

4. Melakukan penelitian yang lebih terhadap kendala–kendala yang dihadapi usaha catering dalam melakukan pemasaran.

Kadir, Abdul. 2005. Dasar Pemrograman Web Dinamis Menggunakan PHP. Yogyakarta : Informatika Bandung

Mulyana. Y.B. 2004. Trik Membangun Situs Menggunakan PHP dan MySQL. Jakarta: Elex Media Komputindo

Purwanto. Yudhi. 2001. Pemrograman Web dengan PHP. Jakarta : Elex Media Komputindo

Riyanto, 2011. Sistem Informasi Penjualan dengan PHP dan MySQL. Yogyakarta : Penerbit Gava Media

Jl. Bioteknologi No.1 Kampus USU Padang Bulan Medan-20155 Telp. (061) 8211050, Fax. (061) 8214290

KARTU BIMBINGAN TUGAS AKHIR MAHASISWA

Nama Mahasiswa : RIKO ADE SANJAYA Nomor Stambuk : 112406077

Judul Tugas Akhir : SISTEM INFORMASI BERBASIS WEB PADA YANTI CATERING KOTA PEMATANGSIANTAR Dosen Pembimbing : Drs.Rosman Siregar, M.Si

Tanggal Mulai Bimbingan : Tanggal Selesai Bimbingan :

No. Tanggal Asisten Bimbingan

Pembahasan pada Asistensi Mengenai, pada

Bab :

Paraf Dosen Pembimbing

Keterangan

1. 2. 3. 4. 5. 6.

 Kartu ini harap dikembalikan ke Departemen Matematika bila bimbingan telah selesai.

Diketahui, Disetujui,

Ketua Departemen Matematika Pembimbing Utama

Dra Elly Rosmaini,M.Si Drs.Rosman Siregar,M.Si NIP 196005201985032002 NIP 19610107 1986011001

Yang bertanda tangan di bawah ini, menerangkan bahwa Mahasiswa Tugas Akhir Program D3 Teknik Informatika :

Nama : RIKO ADE SANJAYA NIM : 112406077

Program Studi : D3 Teknik Informatika

Judul Tugas Akhir : SISTEM INFORMASI BERBASIS WEB PADA YANTI CATERING KOTA PEMATANGSIANTAR

telah melakukan test program Tugas Akhir Mahasiswa tersebut di atas pada tanggal …..../06/2014.

Dengan hasil : SUKSES / GAGAL

Demikian diterangkan untuk digunakan melengkapi Syarat Pendaftaran Meja Hijau Tugas Akhir Mahasiswa bersangkutan di Departemen Matematika FMIPA USU Medan.

Medan, Juni 2014 Dosen Pembimbing Program D3 Teknik Informatika

Drs.Rosman Siregar,M.Si NIP 19610107 1986011001

<?php

session_start(); ?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1 /DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/199 9/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <link href="css/style.css" rel="stylesheet" type="text/css" /> <link href="css/highslide.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="js/utilities.js"></scri pt> <script type="text/javascript" src="js/highslide-with-html.js"></script> <script type="text/javascript" src="js/slideshow.js"></scri pt>

<link rel="shortcut icon" href="images/mm.png" /> <script type="text/javascript"> hs.graphicsDir = 'http://localhost/distro/ima ges/';

hs.outlineType = 'rounded-white'; hs.wrapperClassName = 'draggable-header'; </script> <script type="text/javascript" src="js/jquery-1.10.2.min.js"></script> <script type="text/javascript"> $(document).ready(function() {

var pageTitle =

document.title; //HTML page title

var pageUrl =

location.href; //Location of the page

//user hovers on the share button

$('#share-wrapper li').hover(function() {

var hoverEl = $(this); //get element

//browsers with width > 699 get button slide effect if($(window).width() > 699) { if (hoverEl.hasClass('visible') ){ hoverEl.animate({"margi n-left":"-117px"}, "fast").removeClass('visible ');

} else { hoverEl.animate({"margi n-left":"0px"}, "fast").addClass('visible'); } } });

wrap').click(function(event) {

var shareName =

$(this).attr('class').split( ' ')[0]; //get the first class name of clicked element

switch (shareName) //switch to different links based on different social name

{ case 'facebook': var openLink = 'https://www.facebook.com/sh arer/sharer.php?u=' + encodeURIComponent(pageUrl) + '&amp;title=' +

encodeURIComponent(pageTitle ); break; case 'twitter': var openLink = 'http://twitter.com/home?sta tus=' + encodeURIComponent(pageTitle + ' ' + pageUrl);

break; case 'digg': var openLink = 'http://www.digg.com/submit? phase=2&amp;url=' + encodeURIComponent(pageUrl) + '&amp;title=' +

encodeURIComponent(pageTitle ); break; openLink = 'http://www.stumbleupon.com/ submit?url=' + encodeURIComponent(pageUrl) + '&amp;title=' +

encodeURIComponent(pageTitle ); break; case 'delicious': var openLink = 'http://del.icio.us/post?url =' + encodeURIComponent(pageUrl) + '&amp;title=' +

encodeURIComponent(pageTitle ); break; case 'google': var openLink = 'https://plus.google.com/sha re?url=' + encodeURIComponent(pageUrl) + '&amp;title=' +

encodeURIComponent(pageTitle ); break; case 'email': var openLink = 'mailto:?subject=' + pageTitle + '&body=Found this useful link for you : ' + pageUrl;

break;

}

//Parameters for the Popup window

winLeft = ($(window).width() -

winWidth) / 2,

winTop =

($(window).height() - winHeight) / 2,

winOptions = 'width=' + winWidth + ',height=' + winHeight + ',top=' + winTop + ',left=' + winLeft;

//open Popup

window and redirect user to share website.

window.open(openLink,'S hare This Link',winOptions);

return false; }); }); </script> </head> <body> <?php include('koneksi.php'); ?> <div id="share-wrapper"> <ul class="share-inner-wrp"> <!-- Facebook -->

<li class="facebook button-wrap"><a

href="#">Facebook</a></li> <!-- Twitter -->

<li class="twitter button-wrap"><a

href="#">Tweet</a></li> <!-- Email -->

<li class="email button-wrap"><a href="#">Email</a></li> </ul> </div> class="logo"><img src="images/cat11.jpg" /></div>

<div class="menu" id="nav"> <ul> <li><a href="admin.php">Login Admin</a></li> <li><a href="download.php">Download </a></li> <li><a href="hubungi.php">Contact</ a></li> <li><a href="galeri.php">Galeri</a> </li> <li><a href="about.php">About</a></ li> <li><a href="index.php">Beranda</a> </li> </ul> </div> <div id="head"> <div id="imgSShow" align="center"><img src="images/header.jpg" alt="large image" name="SLIDESIMG" id="SLIDESIMG" style="opacity: 1;"><script type="text/javascript" src="js/slide-2.js"></script></div> </div> </div> </div> <div id="isi"> <div id="kiri"> <div id="judul">YANTI CATERING</div>

Yanti Catering menerima pesanan untuk acara

besar,rapat-rapat,dan nasi kotak <br /><br />

$q=mysql_query("select * from tbl_barang order by id_barang DESC LIMIT 3"); while($r=mysql_fetch_array($ q)) { echo"<div id='sub-barang'><div class='jdl-brg'>$r[nama_barang]</div><i mg src='barang/$r[gambar]' width='90' class='gambar'><div id='harga'> </div></div>"; } ?>

<br /><br /><p

align="center">kLik menu untuk melihat selanjutnya</p> <a href="product.php"><div class="submitButton2">MENU</ div></a> </div> <div id="kanan">

<div id="judul">Lokasi Yanti Catering</div> <div id="widget"> <li class="li-class">PEMATANGSIANTAR</li> <li class="li-class-no">Jl. Jawa no.29 </li> <li class="li-class">Rumah Pribadi</li> <li class="li-class-no">JL.Jawa.Gg sate</li> <li class="li-class">Nomor Hp</li> <li class="li-class-no">081396200370</li> <a href="hubungi.php"><div class="submitButton2"> Hubungi Kami </div></a> </div>

</div>

<div id="footer">Copyright © Yanti catering </div>

</div> </body> </html> About.php <?php session_start(); ?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1 /DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/199 9/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <link href="css/style.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="js/utilities.js"></scri pt> <script type="text/javascript" src="js/slideshow.js"></scri pt>

<link rel="shortcut icon" href="images/mm.png" /> <title>Yanti Catering</title> <script type="text/javascript" src="js/jquery-1.10.2.min.js"></script> <script type="text/javascript">

document.title; //HTML page title

var pageUrl =

location.href; //Location of the page

//user hovers on the share button

$('#share-wrapper li').hover(function() {

var hoverEl = $(this); //get element

//browsers with width > 699 get button slide effect if($(window).width() > 699) { if (hoverEl.hasClass('visible') ){ hoverEl.animate({"margi n-left":"-117px"}, "fast").removeClass('visible ');

} else { hoverEl.animate({"margi n-left":"0px"}, "fast").addClass('visible'); } } });

//user clicks on a share button $('.button-wrap').click(function(event) { var shareName = $(this).attr('class').split( ' ')[0]; //get the first class name of clicked element

different links based on different social name

{ case 'facebook': var openLink = 'https://www.facebook.com/sh arer/sharer.php?u=' + encodeURIComponent(pageUrl) + '&amp;title=' +

encodeURIComponent(pageTitle ); break; case 'twitter': var openLink = 'http://twitter.com/home?sta tus=' + encodeURIComponent(pageTitle + ' ' + pageUrl);

break; case 'digg': var openLink = 'http://www.digg.com/submit? phase=2&amp;url=' + encodeURIComponent(pageUrl) + '&amp;title=' +

encodeURIComponent(pageTitle ); break; case 'stumbleupon': var openLink = 'http://www.stumbleupon.com/ submit?url=' + encodeURIComponent(pageUrl) + '&amp;title=' +

encodeURIComponent(pageTitle );

'delicious': var openLink = 'http://del.icio.us/post?url =' + encodeURIComponent(pageUrl) + '&amp;title=' +

encodeURIComponent(pageTitle ); break; case 'google': var openLink = 'https://plus.google.com/sha re?url=' + encodeURIComponent(pageUrl) + '&amp;title=' +

encodeURIComponent(pageTitle ); break; case 'email': var openLink = 'mailto:?subject=' + pageTitle + '&body=Found this useful link for you : ' + pageUrl;

break;

}

//Parameters for the Popup window

winWidth = 650; winHeight = 450;

winLeft =

($(window).width() - winWidth) / 2,

winTop =

($(window).height() - winHeight) / 2,

winOptions = 'width=' + winWidth +

//open Popup

window and redirect user to share website.

window.open(openLink,'S hare This Link',winOptions);

return false; }); }); </script> </head> <body> <?php include('koneksi.php'); ?> <div id="share-wrapper"> <ul class="share-inner-wrp"> <!-- Facebook -->

<li class="facebook button-wrap"><a

href="#">Facebook</a></li> <!-- Twitter -->

<li class="twitter button-wrap"><a

href="#">Tweet</a></li> <!-- Email -->

<li class="email button-wrap"><a href="#">Email</a></li> </ul> </div> <div id="menu-atas"> <div id="atas"><div class="logo"><img src="images/cat11.jpg" /></div>

<div class="menu" id="nav"> <ul>

<li><a

href="admin.php">Login Admin</a></li>

<li><a href="hubungi.php">Contact</ a></li> <li><a href="galeri.php">Galeri</a> </li> <li><a href="about.php">About</a></ li> <li><a href="index.php">Beranda</a> </li> </ul> </div> <div id="head"> <div id="imgSShow" align="center"><img src="images/header.jpg" alt="large image" name="SLIDESIMG" id="SLIDESIMG" style="opacity: 1;"><script type="text/javascript" src="js/slide-2.js"></script></div> </div> </div> </div> <div id="isi"> <div id="kiri"> <div id="judul">Tentang Yanti Catering</div>

<h1>Apa sih Yanti Catering itu???</h1><br></br>

Yanti catering adalah catering keluarga yang dibuat sekitar tahun 2009.Memulai dari bawah yanti catering perlahan-lahan mulai memuncak di daerah kota Pematangsiantar para pekerja di Yanti

Catering rata-rata semuanya adalah keluarga. Yanti

Catering mengandalkan cita rasa secara

turun-menurun.Yanti Catering

menyediakan berbagai jenis makanan ringan,seperti

berbagai jenis kue,dan juga menyediakan pelaminan dan teratak untuk pesta dan pernikahan<br /><br /> </div>

<div id="kanan">

<div id="judul">Lokasi Yanti Catering</div> <div id="widget"> <li class="li-class">PEMATANGSIANTAR</li> <li class="li-class-no">Jl. Jawa no.29 </li> <li class="li-class">Rumah Pribadi</li> <li class="li-class-no">JL.Jawa.Gg sate</li> <li class="li-class">Nomor Hp</li> <li class="li-class-no">081396200370</li> <a href="hubungi.php"><div class="submitButton2"> Hubungi Kami</div></a> </div> </div> </div> </div> <div id="menu-bawah">

<div id="footer">Copyright © Yanti Catering</div> </div> </body> </html> Galery.php <?php

//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1 /DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/199 9/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <link href="css/style.css" rel="stylesheet" type="text/css" /> <link href="css/highslide.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="js/utilities.js"></scri pt> <script type="text/javascript" src="js/highslide-with-html.js"></script> <script type="text/javascript" src="js/slideshow.js"></scri pt>

<link rel="shortcut icon" href="images/icon.png" /> <script type="text/javascript"> hs.graphicsDir = 'http://localhost/distro/ima ges/';

hs.outlineType = 'rounded-white'; hs.wrapperClassName = 'draggable-header'; </script> <title>Yanti Catering</title> <script type="text/javascript" <script type="text/javascript"> $(document).ready(function() {

var pageTitle =

document.title; //HTML page title

var pageUrl =

location.href; //Location of the page

//user hovers on the share button

$('#share-wrapper li').hover(function() {

var hoverEl = $(this); //get element

//browsers with width > 699 get button slide effect if($(window).width() > 699) { if (hoverEl.hasClass('visible') ){ hoverEl.animate({"margi n-left":"-117px"}, "fast").removeClass('visible ');

} else { hoverEl.animate({"margi n-left":"0px"}, "fast").addClass('visible'); } } });

//user clicks on a share button

$('.button-wrap').click(function(event) {

' ')[0]; //get the first class name of clicked element

switch (shareName) //switch to different links based on different social name

{ case 'facebook': var openLink = 'https://www.facebook.com/sh arer/sharer.php?u=' + encodeURIComponent(pageUrl) + '&amp;title=' +

encodeURIComponent(pageTitle ); break; case 'twitter': var openLink = 'http://twitter.com/home?sta tus=' + encodeURIComponent(pageTitle + ' ' + pageUrl);

break; case 'digg': var openLink = 'http://www.digg.com/submit? phase=2&amp;url=' + encodeURIComponent(pageUrl) + '&amp;title=' +

encodeURIComponent(pageTitle ); break; case 'stumbleupon': var openLink = 'http://www.stumbleupon.com/ encodeURIComponent(pageTitle ); break; case 'delicious': var openLink = 'http://del.icio.us/post?url =' + encodeURIComponent(pageUrl) + '&amp;title=' +

encodeURIComponent(pageTitle ); break; case 'google': var openLink = 'https://plus.google.com/sha re?url=' + encodeURIComponent(pageUrl) + '&amp;title=' +

encodeURIComponent(pageTitle ); break; case 'email': var openLink = 'mailto:?subject=' + pageTitle + '&body=Found this useful link for you : ' + pageUrl;

break;

}

//Parameters for the Popup window

winWidth = 650; winHeight = 450;

winLeft =

($(window).width() - winWidth) / 2,

winOptions = 'width=' + winWidth + ',height=' + winHeight + ',top=' + winTop + ',left=' + winLeft;

//open Popup

window and redirect user to share website.

window.open(openLink,'S hare This Link',winOptions);

return false; }); }); </script> </head> <body> <?php include('koneksi.php'); ?> <div id="share-wrapper"> <ul class="share-inner-wrp"> <!-- Facebook -->

<li class="facebook button-wrap"><a

href="#">Facebook</a></li> <!-- Twitter -->

<li class="twitter button-wrap"><a

href="#">Tweet</a></li> <!-- Email -->

<li class="email button-wrap"><a href="#">Email</a></li> </ul> </div> <div id="menu-atas"> <div id="atas"><div class="logo"><img src="images/cat11.jpg" /></div> href="admin.php">Login Admin</a></li> <li><a href="download.php">Download </a></li> <li><a href="hubungi.php">Contact</ a></li> <li><a href="galeri.php">Galeri</a> </li> <li><a href="about.php">About</a></ li> <li><a href="index.php">Beranda</a> </li> </ul> </div> <div id="head"> <div id="imgSShow" align="center"><img src="images/header.jpg" alt="large image" name="SLIDESIMG" id="SLIDESIMG" style="opacity: 1;"><script type="text/javascript" src="js/slide-2.js"></script></div> </div> </div> </div> <div id="isi"> <div id="kiri">

<div id="judul">Galeri Yanti Catering</div> <?php $batas=6; if(empty($paging)) { $posisi=0; $paging=1; } else{ $posisi=($paging-1) * $batas;

winTop = ($(window).height() -

winHeight) / 2,

winOptions = 'width=' + winWidth + ',height=' + winHeight + ',top=' + winTop + ',left=' + winLeft;

//open Popup

window and redirect user to share website.

window.open(openLink,'S hare This Link',winOptions);

return false; });

});

</script> </head> <body> <?php

include('koneksi.php'); ?>

<div id="share-wrapper"> <ul class="share-inner-wrp"> <!-- Facebook -->

<li class="facebook button-wrap"><a

href="#">Facebook</a></li> <!-- Twitter -->

<li class="twitter button-wrap"><a

href="#">Tweet</a></li> <!-- Email -->

<li class="email button-wrap"><a

href="#">Email</a></li> </ul>

</div>

<div id="menu-atas"> <div id="atas"><div class="logo"><img

src="images/cat11.jpg" /></div>

<div class="menu" id="nav"> <ul>

<li><a

href="admin.php">Login Admin</a></li>

<li><a

href="download.php">Download </a></li>

<li><a

href="hubungi.php">Contact</ a></li>

<li><a

href="galeri.php">Galeri</a> </li>

<li><a

href="about.php">About</a></ li>

<li><a

href="index.php">Beranda</a> </li>

</ul> </div>

<div id="head"> <div id="imgSShow" align="center"><img src="images/header.jpg" alt="large image"

name="SLIDESIMG" id="SLIDESIMG"

style="opacity: 1;"><script type="text/javascript"

src="js/slide-2.js"></script></div> </div>

</div> </div>

<div id="isi"> <div id="kiri">

<div id="judul">Galeri Yanti Catering</div>

<?php $batas=6;

if(empty($paging)) {

$posisi=0; $paging=1; }

else{

$posisi=($paging-1) * $batas;

}

$query=mysql_query("select * from tbl_galeri order by id_galeri desc limit $posisi,$batas");

while($r=mysql_fetch_array($ query))

{

echo"<div

id='sub-barang'><div class='jdl-brg'>$r[keterangan]</div><a href='galeri/$r[gambar]' onclick=\"return

hs.htmlExpand(this, { objectType: 'iframe' } )\"><img

src='galeri/$r[gambar]' width='150' height='120' class='gambar'></a></div>"; }

?> </div>

<div id="kanan">

<div id="judul">Lokasi Yanti Catering</div>

<div id="widget"> <li

class="li-class">PEMATANGSIANTAR</li> <li class="li-class-no">Jl. Jawa no.29

</li>

<li class="li-class">Rumah Pribadi</li>

<li

class="li-class-no">JL.Jawa.Gg sate</li> <li class="li-class">Nomor Hp</li>

<li class="li-class-no">081396200370</li>

<a href="hubungi.php"><div class="submitButton2">Hubung i Kami </div></a>

</div>

</div> </div>

</div>

<div id="menu-bawah">

<div id="footer">Copyright © Yanti Catering </div>

</div> </body> </html>

Hubungi.php <?php

session_start(); ?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1

/DTD/xhtml1-transitional.dtd"> <html

xmlns="http://www.w3.org/199 9/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <link href="css/style.css" rel="stylesheet"

type="text/css" /> <script

type="text/javascript"

src="js/utilities.js"></scri pt>

<script

type="text/javascript"

src="js/slideshow.js"></scri pt>

<link rel="shortcut icon" href="images/mm.png" /> <title>Yanti

Catering</title> <script

type="text/javascript"

src="js/jquery-1.10.2.min.js"></script> <script

type="text/javascript">

$(document).ready(function() {

var pageTitle =

document.title; //HTML page title

var pageUrl =

location.href; //Location of the page

//user hovers on the share button

$('#share-wrapper li').hover(function() {

var hoverEl = $(this); //get element

//browsers with width > 699 get button slide effect

if($(window).width() > 699) {

if

(hoverEl.hasClass('visible') ){

hoverEl.animate({"margi n-left":"-117px"},

"fast").removeClass('visible ');

} else { hoverEl.animate({"margi n-left":"0px"},

"fast").addClass('visible'); }

} });

//user clicks on a share button

$('.button-wrap').click(function(event) {

var shareName =

$(this).attr('class').split( ' ')[0]; //get the first class name of clicked element

switch (shareName) //switch to different links based on different social name

{

case 'facebook':

var openLink =

'https://www.facebook.com/sh arer/sharer.php?u=' +

encodeURIComponent(pageUrl) + '&amp;title=' +

encodeURIComponent(pageTitle );

break;

case 'twitter':

var openLink =

'http://twitter.com/home?sta tus=' +

encodeURIComponent(pageTitle + ' ' + pageUrl);

break;

case 'digg':

var openLink =

'http://www.digg.com/submit? phase=2&amp;url=' +

encodeURIComponent(pageUrl) + '&amp;title=' +

encodeURIComponent(pageTitle );

break;

case 'stumbleupon':

var openLink =

'http://www.stumbleupon.com/ submit?url=' +

encodeURIComponent(pageUrl) + '&amp;title=' +

encodeURIComponent(pageTitle );

case 'delicious':

var openLink =

'http://del.icio.us/post?url =' +

encodeURIComponent(pageUrl) + '&amp;title=' +

encodeURIComponent(pageTitle );

break;

case 'google':

var openLink =

'https://plus.google.com/sha re?url=' +

encodeURIComponent(pageUrl) + '&amp;title=' +

encodeURIComponent(pageTitle );

break;

case 'email':

var openLink =

'mailto:?subject=' + pageTitle + '&body=Found this useful link for you : ' + pageUrl;

break;

}

//Parameters for the Popup window

winWidth = 650; winHeight = 450;

winLeft =

($(window).width() - winWidth) / 2,

winTop =

($(window).height() - winHeight) / 2,

winOptions = 'width=' + winWidth + ',height=' + winHeight +

',top=' + winTop + ',left=' + winLeft;

//open Popup

window and redirect user to share website.

window.open(openLink,'S hare This Link',winOptions);

return false; });

});

</script> </head> <body> <?php

include('koneksi.php'); ?>

<div id="share-wrapper"> <ul class="share-inner-wrp"> <!-- Facebook -->

<li class="facebook button-wrap"><a

href="#">Facebook</a></li> <!-- Twitter -->

<li class="twitter button-wrap"><a

href="#">Tweet</a></li> <!-- Email -->

<li class="email button-wrap"><a

href="#">Email</a></li> </ul>

</div>

<div id="menu-atas"> <div id="atas"><div class="logo"><img

src="images/cat11.jpg" /></div>

<div class="menu" id="nav"> <ul>

<li><a

href="admin.php">Login Admin</a></li>

<li><a

href="download.php">Download </a></li>

<li><a

href="hubungi.php">Contact</ a></li>

<li><a

href="galeri.php">Galeri</a> </li>

<li><a

href="about.php">About</a></ li>

<li><a

href="index.php">Beranda</a> </li>

</ul>

<div id="head"> <div id="imgSShow" align="center"><img src="images/header.jpg" alt="large image"

name="SLIDESIMG" id="SLIDESIMG"

style="opacity: 1;"><script type="text/javascript"

src="js/slide-2.js"></script></div> </div>

</div> </div>

<div id="isi-k"> <div id="kiri">

<div id="judul">Hubungi Kami</div>

Menemukan masalah dengan situs Yanti Catering?<br /> Atau kamu pingin menanyakan sesuatu terkait kemungkinan kerjasama dengan kami?<br /> Jangan ragu-ragu, silakan hubungi kami melalui form kontak yang ada di bawah ini, dan kami akan merespon secepatnya.<br /><br /> <form method="post"

action="kirim-pesan.php"> <table>

<tr><td

width="100">Nama</td><td width="20">:</td><td><input type="text" class="input"

size="50" name="nama" /> *</td></tr>

<tr><td

width="100">Email</td><td width="20">:</td><td><input type="text" class="input" size="50" name="email" /> *</td></tr>

<tr><td

width="100">Alamat</td><td width="20">:</td><td><input type="text" class="input" size="50" name="alamat" /> *</td></tr>

<tr><td width="100">No Hp</td><td

width="20">:</td><td><input type="text" class="input" size="50" name="nope" /> *</td></tr>

<tr><td width="100"

valign="top">Pesan</td><td width="20"

valign="top">:</td><td><text area name="pesan" cols="40" rows="8"

class="input"></textarea></t d></tr>

<tr><td width="100"></td><td width="20"></td><td><input type="submit"

class="submitButton"

value="Kirim Pesan"/><input type="reset"

class="submitButton"

value="Hapus"/></td></tr> </table>

</form><br />

* Wajib diisi dan gak boleh kosong...!!! :D<br />

</div> </div> </div> </div>

<div id="menu-bawah">

<div id="footer">Copyright © Yanti Catering </div>

</div> </body> </html>

Kirim-pesan.php <?php

include('koneksi.php'); $n=$_POST['nama'];

$e=$_POST['email']; $a=$_POST['alamat']; $p=$_POST['pesan']; $nope=$_POST['nope']; mysql_query("insert into tbl_hubungi values

(null,'$n','$e','$a','$p','$ nope')");

?>

<script

type="text/javascript"> alert("Pesan Terkirim...!!!");

</script> <?php

echo "<meta

http-equiv='refresh' content='0; url=index.php'>";