Sistem Informasi Pemasaran Pada Showroom Mutiara Motor Berbasis Web

(1)

TUGAS AKHIR

RIZTANTY SEPTIYANI LUBIS

102406186

PROGRAM STUDI D3 TEKNIK INFORMATIKA

DEPARTEMEN MATEMATIKA

FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM

UNIVERSITAS SUMATERA UTARA

MEDAN

2013


(2)

PERSETUJUAN

Judul : SISTEM INFORMASI PEMASARAN PADA SHOWROOM MUTIARA MOTOR BERBASIS WEB

Kategori : TUGAS AKHIR

Nama : RIZTANTY SEPTIYANI LUBIS

Nomor Induk Mahasiswa : 102406186

Program Studi : DIPLOMA (D3) TEKNIK INFORMATIKA

Departemen : MATEMATIKA

Fakultas : MATEMATIKA DAN ILMU PENGETAHUAN ALAM (FMIPA) UNIVERSITAS SUMATERA UTARA

Diluluskan di Medan, Juli 2013

Diketahui/Disetujui oleh

Departemen Matematika FMIPA USU

Ketua, Pembimbing,

Prof.Dr.Tulus,M.Si. Syahriol Sitorus,S.Si.,M.IT. NIP. 196209011988031002 NIP. 195912311998021001


(3)

PERNYATAAN

SISTEM INFORMASI PEMASARAN PADA SHOWROOM MUTIARA MOTOR BERBASIS WEB

TUGAS AKHIR

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

Medan, Juli 2013

RIZTANTY SEPTIYANI LUBIS 102406186

PENGHARGAAN

Bismillahirrahmannirahim

Alhamdulillahi rabbil „alamin, segala puji dan syukur bagi ALLAH SWT dan junjungan

Nabi Muhammad SAW atas limpahan rahmat dan karunia-Nya serta kekuatan dan semangat sehingga penulis dapat menyelesaikan Tugas Akhir ini dengan baik.

Adapun judul Tugas Akhir ini adalah “SISTEM INFORMASI PEMASARAN PADA SHOWROOM MUTIARA MOTOR BERBASIS WEB”. Tugas Akhir ini merupakan syarat untuk dapat menyelesaikan pendidikan program D3 Teknik Informatika Fakultas MIPA di Sumatera Utara.


(4)

Penulisan Tugas Akhir ini tidak akan selesai dengan baik tanpa adanya bantuan dari berbagai pihak. Untuk itu penulis mengucapkan terima kasih sebesar-besarnya kepada :

1. Bapak Dr. Sutarman, M.Sc selaku Dekan Fakultas MIPA Universitas Sumatera Utara .

2. Bapak Prof. Dr. Tulus, Vordipl.Math., M.Si selaku Ketua Departemen Matematika Fakultas MIPA Universitas Sumatera Utara.

3. Bapak Syahriol Sitorus, S.Si, M.IT, selaku ketua pelaksanaan Program D3 Teknik Informatika Fakultas MIPA Universitas Sumatera Utara dan sekaligus selaku dosen pembimbing tugas akhir yang telah memberikan bimbingan dan pengarahan kepada saya selama menyusun tugas akhir ini.

4. Seluruh dosen Program Studi D3 Teknik Informatika Fakultas Matematika dan Ilmu Pengetahuan Alam Universitas Sumatera Utara yang telah memberikan ilmu pengetahuannya kepada penulis selama masa perkuliahan.

5. Teristimewa untuk Ayahanda Rizaldi Lubis dan Ibunda Sri Mulianingsih tercinta, serta kedua adik saya Rizvandi Yudha Lubis dan Riznadhila Ghadati Lubis dan Keluarga Besar yang telah memberikan doa, dukungan moril/materil, motivasi, semangat dan kasih sayang kepada penulis dalam menyelesaikan Tugas Akhir ini. 6. Buat sahabat Kerucut (Fanny, Desi, Febby, Tri, Rinda dan Tiara) sahabat

Khabe+Ab (Muza, Charles, Widya, Santa, Tari, Nesa dan Difa) yang terkasih Wirandi Pranoto, dan teman-teman Kom C‟10 terimakasih atas dukungan, motivasi dan semangat kepada penulis dalam membantu menyelesaikan Tugas Akhir ini .

7. Kepada rekan-rekan dhuo creative yang telah banyak memberikan ilmu dan dukungan juga bantuan kepada penulis baik dalam penyusunan tugas akhir ini maupun pada masa perkuliahan.

Penulis berharap semoga Tugas Akhir ini bermanfaat bagi penulis sendiri maupun pembaca. Walaupun penulis menyadari bahwa Tugas Akhir ini masih memiliki kekurangan dan jauh dari kesempurnaan. Untuk itu penulis mengharapkan kritik dan saran yang membangun.

Medan, Juli 2013


(5)

ABSTRAK

Tulisan ini bertujuan untuk membangun suatu sistem informasi pemasaran pada Showroom Mutiara Motor. Sistem informasi ini dikembangkan dengan menggunakan perangkat lunak seperti Macromedia Dreamweaver CS5 XAMPP yang merupakan gabungan dari PHP, MySQL, Apache, dan Mozilla Firefox. Tujuan dari sistem informasi akademik ini adalah untuk menyajikan informasi kepada user/pengguna dengan baik dan dapat memasarkan isi dari informasi yang terdapat pada web tersebut dengan mudah pada waktu yang diinginkan.


(6)

DAFTAR ISI

Halaman

Persetujuan ii

Persetujuan iii

Penghargaan iv

Abstrak vi

Daftar Isi vii

Daftar Tabel x

Daftar Gambar xi

BAB 1 PENDAHULUAN 1

1.1 Latar Belakang 1

1.2 Rumusan Masalah 2

1.3 Batasan Masalah 3

1.4 Tujuan dan Manfaat 3

1.5 Metodologi Penelitian 3

1.6 Sistematika Penulisan 4

BAB 2 LANDASAN TEORI 6

2.1 Pengertian Data 6


(7)

2.3 Informasi 8

2.4 Sistem Informasi 8

2.5 Pemasaran 9

2.6 PHP 10

2.7 MySQL 11

2.8 Database 13

2.9 Internet 13

2.9.1 Sekilas Mengenai Web 14

2.9.2 Sejarah Web 15

2.9.3 Web Server 15

2.9.4 HTTP 16

2.9.5 Browser 16

2.10 Macromedia Dreamweaver CS5 18

2.10.1 Ruang Lingkup Macromedia Dreamweaver CS5 19

2.11 Flowchart 21

2.12 Data Flow Diagram 23

BAB 3 PERANCANGAN SISTEM 25

3.1 Perancangan Sistem 25

3.2 Entity Relationship Diagram(ERD) 25

3.3 Normalisasi 27

3.4 Data Flow Diagram (DFD) 32


(8)

3.5.1 Tabel Berita 34

3.5.2 Tabel Category 35

3.5.3 Tabel Merk 35

3.5.4 Tabel Motor 36

3.5.5 Tabel User 36

3.6 Flowchart Halaman Utama 38

3.7 Flowchart Login 39

3.8 Flowchart Halaman Admin 40

BAB 4 IMPLEMENTASI SISTEM 41

4.1 Pengertian Implementasi 41

4.2 Tujuan Implementasi 41

4.3 Komponen Utama Implementasi Sistem 42

4.3.1 Hardware(Perangkat Keras) 42

4.3.2 Software(Perangkat Lunak) 43

4.3.3 Brainware 43

4.4 Instalasi XAMPP 44

4.4.1 Persiapan Instalasi XAMPP 44

4.4.2 Memulai Proses Instalasi XAMPP 45

4.5 Menjalankan Apache 50

4.6 Hasil Program 51

4.6.1 Tampilan Awal 51


(9)

4.6.3 Tampilan Admin 52

4.6.4 Tampilan Category 53

4.6.5 Tampilan Merk 54

4.6.6 Tampilan Motor 54

BAB 5 KESIMPULAN DAN SARAN 55

5.1 Kesimpulan 55

5.2 Saran 55

DAFTAR PUSTAKA


(10)

DAFTAR TABEL

Halaman

Tabel 2.1 Simbol Flowchart 21

Tabel 3.1 Entitas Normalisasi Motor 30

Tabel 3.2 Entitas Normalisasi Motor (1NF) 30

Tabel 3.3 Entitas Normalisasi Motor (2NF) 31

Tabel 3.4 Tabel Berita 34

Tabel 3.5 Tabel Category 35

Tabel 3.6 Tabel Merk 35

Tabel 3.7 Tabel Motor 36


(11)

DAFTAR GAMBAR

Halaman

Gambar 2.1 Tampilan Dreamweaver 20

Gambar 2.2 Simbol DFD 23

Gambar 3.1 Entity Relationship Diagram 26

Gambar 3.2 Diagram Konteks 32

Gambar 3.3 DFD Level 0 33

Gambar 3.4 Flowchart Halaman Utama 38

Gambar 3.5 Flowchart Login 39

Gambar 3.6 Flowchart Halaman Admin 40

Gambar 4.1 XAMPP Installer 45

Gambar 4.2 Select a Language 46

Gambar 4.3 XAMPP Setup Wizard 46

Gambar 4.4 Memilih Folder Penyimpanan XAMPP 47

Gambar 4.5 Service Section XAMPP 47

Gambar 4.6 Installing XAMPP 48

Gambar 4.7 Completing XAMPP 48

Gambar 4.8 XAMPP Control Panel 49

Gambar 4.9 XAMPP Control Panel Application 49

Gambar 4.10 Running Apache dan MySQL 50


(12)

Gambar 4.12 Tampilan Awal 51

Gambar 4.13 Tampilan Login 52

Gambar 4.14 Tampilan Admin 53

Gambar 4.15 Tampilan Category 53

Gambar 4.16 Tampilan Merk 54


(13)

ABSTRAK

Tulisan ini bertujuan untuk membangun suatu sistem informasi pemasaran pada Showroom Mutiara Motor. Sistem informasi ini dikembangkan dengan menggunakan perangkat lunak seperti Macromedia Dreamweaver CS5 XAMPP yang merupakan gabungan dari PHP, MySQL, Apache, dan Mozilla Firefox. Tujuan dari sistem informasi akademik ini adalah untuk menyajikan informasi kepada user/pengguna dengan baik dan dapat memasarkan isi dari informasi yang terdapat pada web tersebut dengan mudah pada waktu yang diinginkan.


(14)

PENDAHULUAN

1.1Latar Belakang

Perkembangan dunia komputer yang semakin kompleks mendorong setiap individu

ataupun kelompok mau tidak mau harus menerapkannya dalam segala aktivitas. Ada satu

kalimat yang menarik mengatakan bahwa siapa saja yang menguasai teknologi informasi

akan menjadi pemenangnya. Mau disadari atau tidaknya, setiap sistem yang ada seakan

kurang lengkap jika masih menggunakan model ataupun pengarsipan secara manual.

Disamping banyak energi sumber daya yang terbuang sia-sia dan juga dari segi finansial

tentunya menjadikan biaya tinggi.

Dengan adanya suatu sistem informasi dapat membantu dalam pengembangan

mutu maupun kinerja dari sebuah instansi ataupun sekolah. Karena sistem informasi

digunakan untuk menampilkan informasi dengan cepat tanpa adanya redudansi yang tidak

diperlukan. Juga dengan adanya sistem berbasis komputer maupun sistem informasi dapat

menghindari kesalahan-kesalahan yang disebabkan oleh user atau pegawai. Selain daripada cepat dan mudah dalam menampilkan informasi yang baru oleh adanya update

data yang dilakukan admin. Hal tersebut terjadi dikarenakan oleh adanya database berupa kumpulan data yang telah diolah dan disimpan dalam komputer.


(15)

Showroom Mutiara Motor adalah salah satu showroom motor yang masih

memiliki kekurangan dalam penyampaian data dengan cepat dan efisien. Penyajian dan

penyampaian data yang masih menggunakan cara manual membuat data tersebut sulit

untuk didapatkan secara tepat dan akurat.

Oleh karena itu, penulis merasa perlu untuk membuat suatu sistem informasi

pemasaran berbasis web yang dapat mengatasi kelemahan dan kekurangan dari

penyampaian data sebelumnya. Dimana dengan sistem informasi yang baru ini dapat

dilakukan penyampaian data dengan cepat, efektif dan akurat.

Atas dasar inilah penulis mengajukan sebuah proposal yang berjudul “SISTEM INFORMASI PEMASARAN PADA SHOWROOM MUTIARA MOTOR BERBASIS

WEB” sebagai judul Tugas Akhir.

1.2Rumusan Masalah

Dari permasalahan latar belakang diatas, adapun yang menjadi rumusan masalah dalam

penelitian ini adalah karena tidak adanya sistem informasi pemasaran motor serta

kurangnya informasi mengenai showroom tersebut, penulis membuat suatu sistem

informasi pemasaran motor agar mampu memberikan berbagai jenis informasi dalam

bentuk website dengan mengutamakan kemudahan dalam mengaksesnya, penerapan, pemeliharaan dan pengembangannya sehingga menghasilkan sistem informasi yang dapat


(16)

diakses kapan dan dimana saja secara mudah melalui perangkat-perangkat yang

terhubung dengan internet.

1.3Batasan Masalah

Adapun batasan masalahnya yaitu memberikan informasi mengenai jenis-jenis sepeda

motor terbaru yang berisi tentang nama sepeda motor, jenis sepeda motor, harga sepeda

motor dan pemasaran motor yang sedang laris di pasaran. Pada website ini, user hanya dapat melihat jenis-jenis sepeda motor tanpa bisa melakukan pemesanan melalui website

tersebut.

1.4Tujuan dan Manfaat

Adapun maksud penulis membuat Sistem Informasi Pemasaran Pada Showroom Mutiara

Motor ini adalah untuk merancang dan membuat informasi dengan tujuan yaitu :

1. Menyediakan informasi tentang Showroom Mutiara Motor.

2. Mempromosikan dan mengenalkan Showroom Mutiara Motor sebagai showroom

motor yang menyediakan berbagai jenis motor.


(17)

1.5Metodologi penelitian

Penelitian ini akan dilaksanakan dengan mengikuti beberapa langkah yang akan

digunakan penulis, yaitu:

1. Observasi

Melakukan pengamatan langsung ke Showroom Mutiara Motor untuk

mendapatkan data yang valid. 2. Membuat Rancangan Aplikasi

Pembuatan ini meliputi pembuatan rancangan aplikasi dan pembuatan user interface aplikasi.

3. Pengujian Aplikasi Web

Menguji apakah aplikasi web yang dibuat telah berhasil berjalan sesuai dengan

keinginan dan melakukan perbaikan kesalahan jika masih terdapat error pada aplikasi.

4. Implementasi Aplikasi

Penerapan aplikasi yang dirancang setelah melalui tahap pengujian dan telah

berjalan dengan baik.

5. Penyusunan dan pengadaan laporan

Tahap akhir dari penelitian yang dilakukan, yaitu membuat laporan tentang


(18)

1.6Sistematika Penulisan

Sistematika penulisan tugas akhir ini dibagi menjadi lima bab, yaitu sebagai berikut :

BAB 1 PENDAHULUAN

Pada bab ini berisikan tentang Latar Belakang, Identifikasi Masalah, Batasan

Masalah, Maksud dan Tujuan, Metodologi Penelitian, dan Sistematika Penulisan.

BAB 2 LANDASAN TEORI

Pada bab ini berisikan tentang konsep dasar dan teori-teori yang mendukung

pembahasan sitem informasi, PHP, MySQL, dan database dalam pembuatan tugas

akhir ini.

BAB 3 PERANCANGAN SISTEM

Pada bab ini berisikan tentang pembuatan serta perancangan sistem.

BAB 4 IMPLEMENTASI SISTEM

Pada bab ini berisikan tentang definisi, tujuan, tampilan interface program dan langkah-langkah dalam implementasi sistem yang disertai dengan


(19)

BAB 5 KESIMPULAN DAN SARAN

Pada bab terakhir ini berisikan beberapa kesimpulan dan uraian bab-bab


(20)

LANDASAN TEORI

2.1 Pengertian Data

Banyak terdapat pengertian data yang dirangkumkan dari berbagai sumber. Menurut

berbagai kamus bahasa Inggris-Indonesia, data diterjemahkan sebagai istilah yang berasal

dari kata “datum” yang berarti fakta atau bahan-bahan keterangan. Dari sudut pandang

bisnis, terdapat pengertian data bisnis sebagai berikut: “Business data is an orgabization’s

description of things (resources) and events (transactions) that it faces”. Jadi data, dalam hal ini disebut sebagai data bisnis, merupakan diskripsi organisasi tentang sesuatu

(resources) dan kejadian (transaction) yang terjadi. Pengertian yang lain mengatakan

bahwa “data is the description of things and events that we faces”. Data merupakan

deskripsi dari sesuatu dan kejadian yang kita hadapi. Gordon B Davis dalam bukunya

Management Information System: Conceptual Foundation, Structures, and Development

menyebutkan data sebagai bahan mentah dari informasi, yang dirumuskan sebagai

sekelompok lambang-lambang tidak acak yang menunjukkan jumlah atau tindakan atau

hal-hal lain.

Sedangkan menurut Murdick, dkk (1984) merumuskan bahwa data adalah fakta yang tidak sedang digunakan pada proses keputusan, biasanya dicatat dan diarsipkan


(21)

tanpa maksud untuk segera diambil kembali untuk pengambilan keputusan. Menurut

Zulkifli Amsyah (1987) data adalah fakta yang sudah ditulis dalam bentuk catatan atau

direkam ke dalam berbagai bentuk media.

Dari pengertian di atas dapat diambil kesimpulan bahwa data adalah bahan baku

informasi, didefinisikan sebagai kelompok teratur simbol-simbol yang mewakili

kuantitas, tindakan, benda, dan sebagainya. Data terbentuk dari karakter, dapat berupa

alphabet, angka, maupun simbol khusus seperti *, $ dan /. Data disusun untuk diolah

dalam bentuk struktur data, struktur file, dan basis data.

2.2Sistem

Suatu sistem adalah merupakan suatu kesatuan yang terdiri dari interaksi subsistem yang

berusaha untuk mencapai tujuan (goal) yang sama. Kata sistem mengandung arti kumpulan dari komponen-komponen yang memiliki unsur keterkaitan antara satu dan

lainnya.

Sistem adalah sebagai satu kesatuan yang terdiri dari dua atau lebih komponen

atau subsistem yang berinteraksi untuk mencapai suatu tujuan. Suatu sistem dapat terdiri

dari sistem-sistem bagian (subsistem). Subsistem saling berinteraksi dan saling

berhubungan membentuk satu kesatuan sehingga suatu tujuan atau sasaran sistem tersebut


(22)

2.3Informasi

Informasi adalah data yang telah diolah menjadi sebuah pengetahuan yang langsung

berguna bagi yang memilikinya atau dapat dikatakan sebagai hasil dari pengolahan data

yang dapat berfungsi untuk mencapai suatu tujuan tertentu atau untuk analisa dalam

pengambilan keputusan.

Informasi adalah data yang diolah menjadi bentuk yang lebih berguna dan lebih

berarti bagi yang menerimanya.

2.4Sistem Informasi

Suatu sistem informasi adalah suatu kegiatan dari prosedur-prosedur yang

diorganisasikan, dieksekusi akan menyediakan informasi untuk mendukung pengambilan

keputusan dan pengendalian di dalam organisasi.

Sistem informasi merupakan suatu kumpulan dari komponen-komponen dalam

perusahaan atau organisasi yang berhubungan dengan proses penciptaan dan pengaliran


(23)

Sistem informasi adalah suatu cara yang sudah tertentu untuk menyediakan

informasi yang dibutuhkan oleh organisasi untuk beroperasi dengan cara yang sukses dan

untuk organisasi bisnis dengan cara yang menguntungkan.

2.5Pemasaran

Pemasaran adalah salah satu kegiatan pokok yang perlu dilakukan oleh perusahaan baik

itu perusahaan barang atau jasa dalam upaya untuk mempertahankan kelangsungan hidup

usahanya. Hal tersebut disebabkan karena pemasaran merupakan salah satu kegiatan

perusahaan, di mana secara langsung berhubungan dengan konsumen. Maka kegiatan

pemasaran dapat diartikan sebagai kegiatan manusia yang berlangsung dalam kaitannya

dengan pasar. Kotler (2001) mengemukakan definisi pemasaran berarti bekerja dengan pasar sasaran untuk mewujudkan pertukaran yang potensial dengan maksud memuaskan

kebutuhan dan keinginan manusia. Sehingga dapat dikatakan bahwa keberhasilan

pemasaran merupakan kunci kesuksesan dari suatu perusahaan.

Menurut Stanton (2001), definisi pemasaran adalah suatu sistem keseluruhan dari kegiatan-kegiatan bisnis yang ditujukan untuk merencanakan, menentukan harga,

mempromosikan dan mendistribusikan barang atau jasa yang memuaskan kebutuhan baik


(24)

Dari definisi tersebut di atas, dapat ditarik kesimpulan bahwa pemasaran

merupakan usaha terpadu untuk menggabungkan rencana-rencana strategis yang

diarahkan kepada usaha pemuas kebutuhan dan keinginan konsumen untuk memperoleh

keuntungan yang diharapkan melalui proses pertukaran atau transaksi. Kegiatan

pemasaran perusahaan harus dapat memberikan kepuasan kepada konsumen bila ingin

mendapatkan tanggapan yang baik dari konsumen. Perusahaan harus secara penuh

tanggung jawab tentang kepuasan produk yang ditawarkan tersebut. Dengan demikian,

maka segala aktivitas perusahaan, harusnya diarahkan untuk dapat memuaskan konsumen

yang pada akhirnya bertujuan untuk memperoleh laba.

2.6 PHP

PHP merupakan bahasa pemrograman web atau scripting language yang didesain untuk

web. PHP dibuat pertama kali oleh satuorang yaitu Rasmus Lerdorf, yang pada awalnya dibuat untuk menghitung jumlah pengunjung pada homepage-nya. 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 Interpreted. Dengan melepaskan kode sumber ini menjadi open source, maka banyak programer yang tertarik untuk mengembangkan PHP.


(25)

Script PHP mampu membaca melaksanakan ke relasi hanya berdasarkan data tabel yang dibaca melalui tiap-tiap tabel. Script PHP sangat mudah untuk digunakan. Dimana suatu script akan dikenali sebagai script PHP bila diapit oleh tanda :

<?php

Echo “Selamat Datang di Website Saya”;

?>

Atau bisa juga ditulis dalam format sebagai berikut :

<?

Echo “Selamat Datang di Website Saya”;

?>

Script yang dibuat dengan PHP disimpan menggunakan nama yang diikuti dengan ekstensi *.php, misalnya : contoh.php. Bila script PHP diakses melalui komputer lokal maka file PHP disimpan di dalam folder htdocs di web server. Pemberian nama dokumen yang sama tetapi menggunakan case yang berbeda akan dianggap sebagai dokumen yang berbeda, misalnya contoh.php akan dianggap berbeda dengan contoh.php atau


(26)

2.7MySQL

MySQL dikembangkan oleh sebuah perusahaan swedia yang pada saat itu bernama TcX Data Konsult AB, dan pada akhirnya berubah nama menjadi MySQL AB. Sekitar tahun 1994-1995, TcX membuat database MySQL untuk mengembangkan aplikasi web client. TcX merupakan perusahaan pengembang software dan consult database.

Michael Widenius atau disebut “ Monty “ adalah pengembangan satu-satunya di TcX. Dengan berlandasan pada aplikasi UNIREG dan ISAM yang dibuat sendiri, dia

memutuskan untuk mencari antarmuka SQL yang sangat tepat untuk ditempelkan diatasnya. Awalnya dia menggunakan mSQL singkatan mini SQL (Structure Query Language). Dia beranggapan bahwa mSQL merupakan satu-satunya kode database open source yang tersedia dan cukup sederhana saat itu. Namun setelah dia melakukan uji coba, ternyata mSQL tidak cukup cepat dan fleksibel. Dan pada versi pertama mSQL tidak memiliki indeks. Setelah itu, dia menghubungi David Hughes sebagai pembuat mSQL, namun karena David tengah sibuk dalam mengembangkan versi 2 mSQL, maka dia (Monty) memutuskan untuk membuat sendiri mesin SQL yang antarmuka mirip dengan

SQL, namun memiliki kemampuan yang lebih sesuai kebutuhan sehinggan lahirnya

MySQL.

Pada bulan Mei 1996, versi 1.0 berhasil dirilis secara terbatas hanya untuk empat

orang saja. Namun di bulan Oktober pada tahun yang sama versi 3.11.0 dilepas ke publik.


(27)

License), melainkan lisensi khusus yang intinya kurang lebih seperti ini : “ Source code MySQL dapat dilihat dan gratis, serta server MySQL dapat dipakai tanpa biaya hanya untuk kebutuhan nonkomersial. Untuk kebutuhan komersial (misal : mengemas dan

menjual MySQL atau menyertakan MySQL dalam program komersial lain), anda harus

bayar lisensi”.

Pada bulan Juni 2000, MySQL AB mengumumkan bahwa sejak versi 3.23.19,

MySQL adalah merupakan software database yang bebas berlisensi GPL. Artinya :

Source code MySQL dapat dilihat dan gratis, serta server MySQL dapat dipakai tanpa biaya untuk kebutuhan apapun. Tapi jika anda memodifikasi source code, anda juga harus melepasnya dibawah lisensi yang sama, yaitu GPL”. Kini perusahaan MySQL AB yang beranggotakan 10 programmer dan 10 karyawan lain dapat memperoleh pemasukan terutama dari jasa konsultasi seputar MySQL.

Pada versi awal, MySQL hanya berjalan di Linux, Solaris dan juga masih banyak terdapat kelemahan walau sudah dapat digunakan untuk aplikasi web sederhana, namun belum memadai untuk aplikasi bisnis.

2.8Database

Database merupakan kumpulan data yang saling berhubungan satu sama lain. Database


(28)

merupakan dasar dalam penyediaan informasi.

Database digunakan untuk menampung beberapa tabel atau query yang digunakan untuk menyimpan data sebagai sumber pengolahan data. Penerapan dalam sistem

informasi disebut database sistem. Sistem database merupakan suatu informasi yang mengintegrasikan kumpulan dari data yang saling berhubungan satu sama lain dan

membuatnya tersedia untuk beberapa aplikasi yang bermacaam-macam didalam suatu

organisasi.

2.9 Internet

Internet berasal dari kata Interconection Network yang mempunyai arti hubungan komputer dengan berbagai tipe dan sistem yang berbeda yang membentuk sistem jaringan

yang mencakup seluruh dunia (jaringan computer global) dengan melalui telekomunikasi. Jaringan komputer ini sangat luas sehingga tidak ada satu orang, satu organisasi, atau satu

Negara yang menanganinya sendiri. Asal usul internet dari jaringan komputer yang

disusun oleh APRA (Advance Research Project Agency) yang bernaung dibawah departemen petahanan Amerika Serikat atau DoD (Departement of Defense) sehingga terbentuk APRAnet, jaringan komputer bentukan departemen pertahanan Amerika

Serikat, tahun 70-an. Pada awalnya, APRAnet hanya menghubungkan 4 buah situs saja,

yaitu:


(29)

2. USCB (University of California at Santa Barbara). 3. UCLA (University of California at Los Angles). 4. University of Utah at Utah.

Jaringan tersebut selanjutnya diperbaharui dan dikembangkan, dan saat ini

digunakakan sebagai tulang punggung jaringan informasi yang disebut dengan internet. Penelitian di Stanford menghasilkan sebuah protokol yang disebut TCP/Ip, inilah yang berkembang terus hingga sekarang dan menjadi protocol standar dalam internet.

2.9.1 Sekilas Mengenai Web

World Wide Web (WWW) atau biasa disebut dengan Web, merupakan salah satu sumber daya internet yang berkembang pesat. Informasi Web didistribusikan melalui pendekatan

hypertext, yang memungkinkan suatu teks pendek menjadi acuan untuk membukadokumen yang lain. Dokumen-dokumen yang diaksespun dapat tersebar

diberbagai mesin dan bahkan di berbagai Negara.

Jaringan web telah membentang ke seluruh penjuru dunia. Tidak hanya terbatas pada lembaga-lembaga penelitian yang ingin mempublikasikan hasil riset, web juga banyak digunakan oleh perusahaan bisnis yang ingin mengklaim produk atau melakukan


(30)

Pada awalnya aplikasi Web dibangun hanya dengan menggunakan bahasa yang

disebut HTML (HyperText Markup Language) dan protocol yang digunakan HTTP

(HyperText Transfer Protocol). Pada perkembangan berikutnya, sejumlah skrip dan objek dikembangkan untuk memperluas kemampuan HTML, antara lain yaitu PHP.

2.9.2 Sejarah Web

Sejarah Web dimulai pada tahun 1989 ketika tim Berner-Lee yang bekerja di laboratorium Fisika Partikel Eropa atau yang dikenal dengan nama CERN (Consei European pour la Recherce Nuclaire) yang berada di genewa, swiss, mengajukan protocol (suatu tatacara untuk berkomunikasi) system distribusi informasi internet yang digunakan untuk berbagai informasi diantaranya para fisikawan. Protokol inilah yang selanjutnya dikenal sebagai

Protokol World Wide Web dan dikembangkan oleh World Wide Web Consortium (W3C).

2.9.3 Web Server

Web server adalah server yang melayani permintaan client terhadap halaman web.

Middleware adalah perangkat lunak yang bekerja sama dengan web server dan berfungsi menerjemahkan kode-kode tertentu. Menjalankan kode-kode tersebut dan memungkinkan

berinteraksi dengan basis data. Web browser adalah perangkat lunak disisi client yang digunakan untuk mengakses informasi web. Contoh : Internet Explorer , Netscape, dan


(31)

2.9.4 HTTP

HTTP (Hypertext Transfer Protocol) adalah suatu protocol yang digunakan oleh web server untuk mengirim dan menerima informasi. Bisa digunakan untuk mengirim dan menerima teks, grafik, gambar, suara, video, dan file multimedia lainnya. Biasanya file

dimulai dengan kata “http”, biarpun saat ini bisa dihilangkan (Sutedjo Dharma Oetomo

Budi, 2003, hal:78).

HTTP tidak memiliki apa yang disebut session, seperti FTP yang menjaga hubungan antara server dan client secara konsisten. Setelah data di transfer, koneksi antara client dan server akan terputus. Sifat ini membuat HTTP sering disebut dengan istilah protocol hit-and-run (Muhammad Sutiyadi,2003);

2.9.5 Browser

Browser adalah sebuah program yang berfungsi untuk menjelajahi halaman-halaman web

yang terdapat dalam internet. Menjelajahi atau sering disebut sebagai browsing adalah suatu aktifitas membuka atau menuju ke situs-situs (server-server) web dan membaca informasi yang terdapat didalamnya.

Netscape Navigator adalah program browser yang banyak digunakan, selain itu terdapat juga produk Microsoft yang sangat terkenal yaitu Internet Eksplorer. Beberapa komponen-komponen browser :


(32)

1. Menu

Terletak dibagian atas jendela browser, terdiri deretan menu yang mengandung perintah-perintah untuk pengaturan, memanipulasi tampilan, serta menjalankan

perintah-perintah browser. 2. Toolbar

Toolbar adalah tombol-tombol navigasi yang digunakan untuk menjelajahi halaman-halaman internet. Tombol-tombol tersebut antara lain forward untuk menuju ke halaman beriutnya, back untuk menuju halaman sebelumnya, stop

untuk menghentikan download (pengambilan data) halaman, search untuk menuju

search engine (situs web pencari informasi), refresh/reload untuk mendownload

(pengambilan data) ulang halaman, home untuk kembali ke halaman default browser. Selain tombol-tomol tersebut terdapat tombol-tmbol lain yang bersifat spesifik untuk setiap browser.

3. Bookmark (netscape)/favorites

Berisi alamat-alamat halaman web yang sudah disimpan agar user dapat langsung menuju alamat tersebut tanpa harus kesulitan dalam mengetikan atau

menghafalkan lokasinya. Alamat URL disimpan agar mempermudah pengaksesan di kemudian hari.

4. Location Toolbar

Text box ini merupakan alamat lengkap dari halaman yang sedang anda lihat. Anda dapat mengetikan alamat yang akan dituju baik yang berada di internet

maupun yang ada di komputer local.


(33)

Berguna untuk memantau penerimaan data, saat proses download sedang berlangsung maka logo terlihat melakukan gerakan bila download halaman web

selesai logo berupa gambar diam.

6. Layar Utama Browser

Layar ini merupakan tempat tampilan halaman web, yang berisi text, gambar, serta animasi, dan interaksi multimedia.

7. Status bar

Terdapat pada bagian kiri bawah layar utama. Terdiri bagian yang menunjukkan

kemajuan download halaman web dan pesan status yang menunjukkan URL yang sedang ditampilkan, URL dari suatu letak (loncatan ke halaman lain) serta pesan-pesan khusus tertentu.

Dengan menggunakan Netscape Navigator atau Mozzila Firefox anda siap menjelajahi internet untuk mendapatkan informasi yang dibutuhkan.

2.10 Macromedia Dreamweaver CS5

Macromedia Dreamweaver adalah sebuah HTML editor professional untuk mendesain secara visual dan mengelola situs web maupun halaman web. Bilamana kita menyukai untuk berurusan dengan kode-kode HTML secara manual atau lebih menyukian bekerja dengan lingkungan secara visual dalam melakukan editing, dreamweaver membuatnya menjadi lebih mudah dengan menyediakan tool-tool yang sangat berguna dalam


(34)

peningkatan kemampuan dan pengalaman kita dalam mendesain web

Dreamweaver dalam hal ini digunakan untuk web desain. Dreamweaver

mengikutsertakan banyak tool untuk kode-kode dalam halaman web beserta fasilitas-fasilitasnya, antara lain : Referensi HTML, CSS dan Javascript, Javascript debugger,

editor kode (tampilan kode dan code inspector) yang mengizinkan kita mengedit kode

Javascript, XML, dan dokumen teks lain secara langsung dalam dreamweaver. Teknologi

dreamweaver roundtrip HTML mampu mengimpor dokumen HTML tanpa perlu memformat ulang kode tersebut dan kita dapat menggunakan dreamweaver pula untuk membersihkan dan memformat ulang HTML bila kita menginginkannya.

Selain itu dreamweaver juga dilengkapi kemampuan manajemen situs, yang memudahkan kita mengelola keseluruhan elemen yang ada dalam situs. Kita juga dapat

melakukan eveluasi situs dengan melakukan pengecekan broken link, kompatibilitas

browser, maupun perkiraan waktu download halaman web.

2.10.1 Ruang Kerja Macromedia Dreamweaver CS5

Macromedia Dreamweaver CS5 adalah sebuah HTML editor professional untuk mendesain web secara visual dan mengelola situs atau halaman web. Versi terbaru dari

Adobe Dreamweaver CS5 memiliki beberapa kemampuan bukan hanya sebagai software

untuk desain web saja, tetapi juga menyunting kode serta pembuatan aplikasi web. Antara lain : JSP, PHP, ASP, XML, dan ColdFusion (Christianus Sigit, 2010 :1)


(35)

Hal ini disebabkan oleh ruang kerja, fasilitas, dan kemampuan dreamweaver yang mamou meningkatkan produktivitas dan efektivitas, baik dalam desain maupun

membangun suatu situs web.

Fitur baru yang semakin handal untuk versi terbaru ini dimunculkan, diantaranya

adalah Integrated CMS Support, CSS Inspection, PHP Custom Class Code Hinting dan

Site-Specific Code Hinting. Semua fitur baru tersebut semakin memantapkan pengguna

Adobe Dreamweavwer CS5 untuk semakin mengeksplorasi dan mengeksplorasi ide kreasi pengolahan website.


(36)

2.11 Flowchart

Diagram alir (flowchart) ini menjelaskan secara rinci langkah-langkah dari proses program. Flowchart dibuat dengan menggunakan simbol-simbol tertentu yang menyatakan setiap langkah program.

Berikut ini adalah gambar simbol – simbol standar dalam flowchart beserta dengan arti dari masing – masing simbol :

Tabel 2.1 Simbol Flowchart

Simbol Keterangan

Terminal/Interupt

(Mulai/Berhenti)

Simbol ini dipergunakan untuk menunjukkan

awal kegiatan atau akhir kegiatan atau

berhentinya suatu program.

Input/Output (data/hasil)

Untuk mewakili data input dan menuliskan

output-nya

Process (Pengolahan)

Suatu simbol yang melambangkan diprosesnya


(37)

Decision (Keputusan)

Dipakai untuk menuliskan jika adanya

percabangan,

seperti if, case.

Prefendefined

Untuk program-program yang sering

dipergunakan sebuah program berulang kali,

biasanya dibuat program terpisah dengan sebuah

sub program (subroutine). Untuk menghubungkan program utama dengan subroutine dipergunakan

symbol ini.

Connector (Penghubung)

Bila suatu flow-chart sangat panjang dan diputus di tengah sebelum selesai, jika disambung dalam

halaman yang sama lagi, maka digunakan symbol

ini.

Flow lines (Garis Alir)

Bila suatu flow-chart dihubungkan dengan garis-garis ini. Garis-garis-garis ini menunjukkan akar

selanjutnya yang akan dituju. Bila arahnya ke

bawah atau ke kanan tidak perlu memakai tanda

panah. Bila ke atas atau ke kiri , tanda panah

harus dipakai, untuk membedakannya.


(38)

2.12 Data Flow Diagram (DFD)

Data Flow Diagram adalah gambaran sistem secara logika. Gambaran ini tidak tergantung pada perangkat keras, perangkat lunak, struktur data atau organisasi. Pada tahap analisis,

penanganan notasi simbol lingkaran dan anak panah mewakili/menggambarkan arus data

pada perancangan sistem sangat membantu di dalam komunikasi dengan pemakaian

sistem menggunakan notasi – notasi ini untuk menggambarkan arus dari data sistem. Komponen (simbol) yang digunakan dalam diagram aliran data, dapat dilihat pada

gambar berikut :

Sumber : Julie, E. Kendall


(39)

Keterangan gambar:

1. Kotak persegi digunakan untuk menggambarkan suatu entitas eksternal yang dapat

mengirim data atau menerima data dari sistem.

2. Tanda panah menunjukkan perpindahan data dari suatu titik ke titik lain dengan

kepala tanda panah mengarah ke tujuan data.

3. Kotak dengan sudut membulat digunakan untuk menunjukkan adanya proses

transformasi.

4. Penyimpanan data menandakan penyimpanan manual, seperti lemari file atau sebuah file atau basis data terkomputerisasi. Karena penyimpanan data mewakili sebuah atau sesuatu, maka diberi nama dengan sebuah kata benda (Kenneth. E. Kendall dan Julie. E. Kendall, Jilid I, 2003:264).

Keuntungan menggunakan DFD adalah memudahkan pemakai yang kurang

menguasai bidang komputer untuk mengerti sistem yang sedang dikerjakan atau

dikembangkan.


(40)

PERANCANGAN SISTEM

3.1 Perancangan Sistem

Tujuan dari perancangan sistem adalah untuk memenuhi kebutuhan user (pemakai) mengenai gambaran yang jelas tentang perancangan sistem yang akan dibuat serta

diimplementasikan. Perancangan sistem adalah suatu upaya untuk membuat suatu sistam

yang baru atau memperbaiki sistem yang telah ada. Desain sistem secara umum

mengidentifikasikan komponen-komponen sistem informasi yang akan didesain secara

terinci. Desain terinci dimaksudkan untuk pemrogram komputer dan ahli teknik ahlinya

yang akan mengimplementasikan sistem.

3.2. Entity Relationship Diagram (ERD)

Entity Relationship Diagram (ERD) tersusun atas 3 komponen yaitu entitas, atribut dan kerelasian antar entitas. Secara garis besar entitas merupakan objek yang terlibat dalam

sebuah system. Atribut berperan sebagai penjelas entitas dan kerelasian menunjukkan


(41)

Gambar 3.1 Entity Relationship Diagram KETERANGAN :

Produk : {id_berita, judul_berita, isi_berita} User : {id_user, username, password, status}

Motor : {id_motor, nama_motor, id_merk, id_category, stok_motor, harga_motor, foto_motor, ket_motor}

Merk : {id_category, nama_category, ket_category} Category : {id_category, nama_category, ket_category}

Berita

Akses

User

Mengisi

Motor Punya

Merk

M

1

M N

1

N

N N


(42)

3.3 Normalisasi

Normalisasi adalah suatu proses untuk mengubah suatu tabel yang memiliki masalah

tertentu ke dalam dua buah tabel atau lebih, yang tidak lagi memiliki masalah tersebut

(Abdul Kadir, 2002: 52). Masalah tersebut biasanya merupakan suatu ketidakkonsistenan

(tidak normal) apabila dilakukan penghapusan (delete), pengubahan (update) dan pembacaan (retrieve) pada suatu basis data.

Pada proses normalisasi terhadap tabel pada database dapat dilakukan dengan tiga

tahap normalisasi antara lain :

a) Bentuk Tidak Normal (Unnormalized Form)

Bentuk ini merupakan kumpulan data yang akan direkam, tidak ada keharusan

mengikukti format tertentu, dapat saja data tidak lengkap atau terduplikasi.

Data dikumpulkan apa adanya sesuai dengan saat menginput. Untuk mentransformasikan

tabel yang belum ternomalisasi di atas menjadi tabel yang memenuhi kriteria 1NF adalah

kita harus merubah seluruh atribut yang multivalue menjadi atribut single value, dengan cara menghilangkan repeating group pada tabel di atas.

b) Bentuk Normal ke Satu (First Normal Form / 1 NF)

Pada tahap ini dilakukan penghilangan beberapa group elemen yang berulang agar menjadi satu harga tunggal yang berinteraksi di antara setiap baris pada suatu tabel,


(43)

adalah zat terkecil yang masih memiliki sifat induknya, bila terpecah lagi maka ia tidak

memiliki sifat induknya.

Syarat normal ke satu (1-NF) antara lain:

1. setiap data dibentuk dalam flat file, data dibentuk dalam satu record demi satu

record nilai dari fieldberupa “atomic value”.

2. tidak ada set atribute yang berulang atau bernilai ganda. 3. telah ditentukannya primary key untuk tabel / relasi tersebut. 4. tiapatribut hanya memiliki satu pengertian.

c) Bentuk Normal ke Dua (Second Normal Form / 2 NF)

Bentuk normal kedua didasari atas konsep full functional dependency (ketergantungan fungsional sepenuhnya) yang dapat didefinisikan sebagai berikut. Jika A adalah

atribut-atribut dari suatu relasi, B dikatakan full functional dependency (memiliki ketergantungan fungsional terhadap A, tetapi tidak secara tepat memiliki ketergantungan fungsional dari

subset (himpunan bagian) dari A.

Syarat normal kedua (2-NF) sebagai berikut.

1. Bentuk data telah memenuhi kriteria bentuk normal kesatu.

2. Atribute bukan kunci (non-key) haruslah memiliki ketergantungan fungsional sepenuhnya (fully functional dependency) pada kunci utama / primary key.


(44)

d) Bentuk Normal ke Tiga (Third Normal Form / 3 NF)

Walaupun relasi 2-NF memiliki redudansi yang lebih sedikit dari pada relasi

1-NF, namun relasi tersebut masih mungkin mengalami kendala bila terjadi

anomaly peremajaan (update) terhadap relasi tersebut. Jika kita hanya meng-update satu baris saja, sementara baris yang lainnya tidak, maka data didalam database tersebut akan

inkonsisten / tidak teratur. Anomaly update ini disebabkan oleh suatu ketergantungan transitif (transitive dependency). Kita harus menghilangkan ketergantungan tersebut dengan melakukan normalisasi ketiga (3-NF).

Syarat normal ketiga (Third Normal Form / 3 NF) sebagai berikut. 1. Bentuk data telah memenuhi kriteria bentuk normal kedua.

2. Atribute bukan kunci (non-key) harus tidak memiliki ketergantungan transitif, dengan kata lain suatu atribut bukan kunci (non_key) tidak boleh memiliki ketergantungan fungsional (functional dependency) terhadap atribut bukan kunci lainnya, seluruh atribut bukan kunci pada suatu relasi hanya memiliki ketergantungan fungsional


(45)

3.3.1 Perancangan Tabel Normalisasi

1. Entitas Normalisasi Motor Bentuk Tabel Tidak Normal

Tabel 3.1 Entitas Normalisasi Motor

Motor Id_motor

Nama_motor

Id_merk

Id_category

Stok_motor

Harga_motor

Foto_motor

Ket_motor

Id_category

Nama_category

Ket_category

Id_merk

Nama_merk


(46)

Bentuk Normal Pertama (1 NF)

Motor Ket

Id_motor *

Id_category **

Id_merk Nama_motor

Stok_motor Harga_motor

Foto_motor Ket_motor Nama_category

Ket_category Nama_merk

Ket_merk Category Ket

Id_category *

Nama_category Ket_category


(47)

Bentuk Normal Kedua (2NF)

Tabel 3.3 Entitas Normalisasi Motor

Motor Ket

Id_motor *

Id_category **

Id_merk Nama_motor

Stok_motor Harga_motor

Foto_motor Ket_motor Nama_category

Ket_category Nama_merk

Ket_merk Category Ket

Id_category *

Nama_category Ket_category

Merk Ket

Id_merk *

Nama_merk Ket_merk


(48)

3.4 Data Flow Diagram (DFD)

Berikut adalah Data Flow Diagram dari Sistem Informasi :

Gambar 3.2 Diagram Konteks Admin

0

Sistem Informasi Pemasaran Pada ShowroomMutiara

Motor

Pengunjung

Data Gallery, Data News, Data About Us Data Kategory, Data Merk, Data Motor, Data Berita


(49)

D1 Informasi

Gambar 3.3 DFD Level 0

1

Halaman Admin Admin

2

Halaman Utama/Depan

Web

Pengunjung Data Kategory,

Data Merk,

Data Motor, Data Berita

Data Kategory, Data Merk, Data Motor, Data Berita

Data Kategory, Data Merk, Data Motor, Data Berita

Data Gallery, Data News, Data About Us


(50)

3.5 Perancangan Database

Database merupakan kumpulan dari data yang saling berhubungan satu dengan lainnya,

tersimpan di simpanan luar komputer dan digunakan perangkat lunak tertentu untuk

memanipulasinya. Database merupakan salah satu komponen yang penting dalam sistem

informasi, karena berfungsi sebagai basis penyedia informasi bagi para pemakainya.

Karena database merupakan kumpulan dari beberapa file, dalam hal ini file-file tersebut dikelompokkan secara terstruktur dalam beberapa tabel sesuai dengan informasi yang

terkandung didalamnya. Berikut rancangan tabel yang digunakan penulis dalam

membangun sistem informasi ini :

3.5.1 Tabel Berita

Tabel ini berisikan tentang berita-berita terbaru dari jenis-jenis motor.

Tabel 3.4 Tabel Berita

Field Type Keterangan

id_berita int(11) Primary key/auto_increment

judul_berita varchar(50)


(51)

3.5.2 Tabel Category

Tabel ini berisikan tentang jenis-jenis category motor.

Tabel 3.5 Tabel Category

Field Type Keterangan

id_category int(11) Primary key/auto_increment

nama_category varchar(50)

ket_category text

3.5.3 Tabel Merk

Tabel ini berisikan tentang merk motor.

Tabel 3.6 Tabel Merk

Field Type Keterangan

id_merk int(11) Primary key/auto_increment

nama_merk varchar(50)


(52)

3.5.4 Tabel Motor

Tabel ini berisikan tentang nama motor beserta category, merk, harga, stok dan keterangan motor sehingga dapat memudahkan user untuk melihat informasi yang

lengkap.

Tabel 3.7 Tabel Motor

Field Type Keterangan

id_motor int(11) Primary key/auto_increment

nama_motor varchar(50)

id_merk int(11)

id_category int(11)

stok_motor varchar(50)

harga_motor int(11)

foto_motor varchar(11)

ket_motor text

3.5.5 Tabel User

Tabel User digunakan untuk melakukan registrasi admin. Mengisi tabel user dengan memasukkan username dan password .


(53)

Tabel 3.8 Tabel User

Field Type Keterangan

id_user int(11) Primary key/auto_increment

username varchar(50)

password varchar(50)


(54)

3.6 Flowchart Halaman Utama

Gambar 3.4 Flowchart Halaman Utama Mulai Home Gallery News About Us Login Tampilan Gallery Tampilan News Tampilan About Us Menu

Admin A

Ya Ya Ya Tidak Tidak Tidak Akhir Ya Tidak Tidak Selesai? Ya


(55)

3.7 Flowchart Login

Gambar 3.5 Flowchart Login Mulai

Input Username dan password

admin

Jika username dan password

benar?

Halaman Admin

Selesai

Login Gagal Tidak


(56)

3.8 Flowchart Halaman Admin

Gambar 3.6 Flowchart Halaman Admin Admin Home Category Merk Motor Berita Logout Menu Berita Menu Motor Menu Merk Menu Category Tampilan Home B C D E Ya Tidak Ya Ya Ya Ya Tidak Tidak Tidak Tidak Home User Ya Selesai? Ya Tidak


(57)

IMPLEMENTASI SISTEM

4.1 Pengertian Implementasi

Implementasi sistem adalah prosedur yang dilakukan untuk menyelesaikan desain sistem

yang telah dirancang, sistem yang disetujui, menguji sistem, menginstal dan memwulai

menggunakan sistem baru tersebut atau sistem yang diperbaiki. Adapun langkah-langkah

yang dibutuhkan dalam implementasi sistem adalah :

1. Mendapatkan software dan hardware yang tepat serta sesuai untuk merancang

website.

2. Menyelesaikan rancangan sistem.

3. Menulis, menguji, mengontrol dan mendokumentasikan website. 4. Mendapatkan persetujuan.


(58)

4.2 Tujuan Implementasi

Tujuan implementasi sistem adalah :

1. Menyelesaikan sistem yang ada dalam dokumen desain sistem yang telah

disetujui, menyusun dokumen-dokumen baru atau dokumen yang baru diperbaiki.

2. Menulis, menguji, mendokumentasikan program-program dan prosedur yang

diperlukan dalam desain sistem yang telah disetujui.

3. Memastikan bahwa pengguna dapat mengoperasikan sistem yang baru yaitu

dengan mempersiapkan manual pemakaian (tata cara penggunaan) dan melatih

pengguna tersebut.

4. Memperhitungkan bahwa sistem tersebut dapat memenuhi permintaan pengguna

yaitu dengan menguji sistem.

5. Memastikan bahwa konversi ke sistem baru berjalan secara lancar, yaitu dengan

membuat perencanaan, mengontrol, dan melakukan instalasi sistem baru secara

baik dan benar.

4.3 Komponen Utama Implementasi Sistem

Dalam menjalankan sistem tersebut dengan menggunakan komputer harus memiliki 3

komponen utama, antara lain Hardware (Perangkat Keras), Software (Perangkat Lunak) dan Brainware (Unsur Manusia).


(59)

4.3.1 Hardware (Perangkat Keras)

Hardware adalah suatu komponen yang sangat dibutuhkan dalam mewujudkan sistem yang diusulkan. Dalam hal ini penulis merinci spesifikasi komponen hardware yaitu :

1. PC dengan processor minimal intel Pentium III 733 MHz. 2. Microsoft Windows XP Professional (lebih disarankan) 3. Microsoft Windows 2000 service pack 4 atau XP Home. 4. Memory Minimal 128 MB

5. Hard disk 20 GB 6. Monitor Super VGA

7. Keyboard 8. Mouse

4.3.2 Software (Perangkat Lunak)

Software adalah perangkat lunak atau program-program komputer yang dapat digunakan oleh komputer dengan memberikan fungsi serta menampilkan performance mikrotik yang diinginkan.

Adapun software yang digunakan dalam pembuatan website ini adalah : 1. Apache sebagai web server


(60)

3. MySQL sebagai database server

4. Macromedia Dreamweaver CS5 sebagai tempat penulisan script

4.3.3 Brainware

Brainware merupakan faktor manusia yang menangani fasilitas komputer yang ada.

Faktor manusia yang dimaksud adalah orang-orang yang memiliki bagian untuk

menangani sistem dan merupakan unsur manusia yang meliputi :

1. Analis Sistem, yaitu orang membentuk dan membangun fasilitas rancangan sistem

atau program.

2. Programmer, yaitu orang yang mengerti bahasa pemrograman yang digunakan dalam membuat dan membangun suatu program.

3. Operator (Admininistrator), yaitu orang yang mengoperasikan sistem seperti memasukkan data untuk dioperasikan oleh komputer dalam menghasilkan informasi

dan lain sebagainya.

4. Public (Pengguna), yaitu orang yang memakai sistem yang telah dirancang untuk


(61)

4.4 Instalasi XAMPP

Seperti kepanjangannya XAMPP merupakan tool yang menyediakan paket perangkat lunak ke dalam satu buah paket. Dalam paketnya sudah terdapat Apache (web server),

MySQL (database), PHP (server side scripting), Perl, FTP server, phpMyAdmin dan berbagai pustaka bantu lainnya. Dengan menginstall XAMPP maka tidak perlu lagi melakukan instalasi dan konfigurasi web server Apache, PHP dan MySQL secara manual.

XAMPP akan menginstalasi dan mengkonfigurasikannya secara otomatis untuk Anda.

4.4.1 Persiapan Instalasi XAMPP

1. Pastikan komputer Anda belum terinstall web server lain seperti IIS atau PWS

karena dapat menyebabkan bentrok dengan web server Apache . Tetapi apabila anda ingin tetap mempertahankan program tersebut, setelah instalasi selesai anda

dapat mengkonfigurasikan Apache secara manual dengan mengganti nomor port

yang digunakan.

2. Download Source XAMPP versi stabil terbaru di http://apachefriends.org. Pilih versi sesuai dengan sistem operasi yang Anda gunakan (tersedia versi untuk

Windows, Linux dan Mac.

3. Pastikan komputer yang Anda gunakan berjalan dengan baik dengan kapasitas


(62)

4.4.2 Memulai Proses Instalasi XAMPP

Berikut ini adalah langkah-langkah yang perlu Anda lakukan untuk menginstall XAMPP

di windows :

1. Klik dua kali file XAMPP yang telah anda download.

Gambar 4.1 XAMPP Installer

2. Berikutnya klik saja [OK] untuk pilihan bahasa, English

Gambar 4.2 Select a Language


(63)

Gambar 4.3 XAMPP Setup Wizard

4. Berikutnya Anda diminta memilih folder tempat XAMPP dipasang. Untuk mudahnya pilih saja di c:\ seperti default-nya dan klik [Next].

Gambar 4.4 Memilih Folder Penyimpanan XAMPP

5. Pada jendela yang muncul berikutnya, Jangan lupa klik 3 kotak pada service section. Yaitu anda harus menginstall apache as service, mysql as service dan


(64)

filezilla as service. Klik saja Install, dimana shortcut untuk menjalankan XAMPP

akan ada di desktop dan di menu Start.

Gambar 4.5 Service Section XAMPP

6. Tunggu beberapa menit sementara XAMPP diinstall.


(65)

7. Klik [Finish] setelah XAMPP selesai diinstal.

Gambar 4.7 Completing XAMPP

8. Anda akan mendapati tawaran, apakah akan menjalankan XAMPP Control Panel

sekarang atau lain kali. Klik [Yes] bila Anda akan menjalankannya.

Gambar 4.8 XAMPP Control Panel

9. Setiap kali Anda akan mengelola situs Web Anda di PC lokal, Anda harus menjalankan XAMPP. Menjalankan XAMPP berarti memfungsikan PC Anda sebagai server Web. Untuk menjalankannya, klik ikon XAMPP dan Anda dihadapkan pada XAMPP ControlPanel.


(66)

Gambar 4.9 XAMPP Control Panel Application

10. Klik [Start] masing-masing untuk Apache dan MySql, sehingga muncul tanda

Running untuk keduanya. PC lokal Anda kini sudah menjadi server Web lokal.

Gambar 4.10 Running Apache dan MySql

11. Jalankan browser Anda dan ketikkan: http://localhost. Bila muncul tampilan seperti di bawah ini, berarti PC Anda sudah berfungsi sebagai server Web. Klik [English] untuk memilih bahasa Inggris.


(67)

Gambar 4.11 Jalankan Localhost

12. Jika sukses dijalankan , maka XAMPP siap untuk dipergunakan

4.5 Menjalankan Apache

Setelah proses instalasi XAMPP selesai dilakukan, langkah selanjutnya adalah menjalankan apache. Adapun cara menjalankan apache adalah :

1. Klik XAMPPControl Panel Application

2. Klik [Start] masing-masing untuk Apache dan MySql, sehingga muncul tanda

Running untuk keduanya. PC lokal Anda kini sudah menjadi server Web lokal. 3. Apache telah aktif.

4.6 Hasil Program

Sistem yang dibuat dalam situs ini bersifat umum, yang berarti semua pengguna bisa

melihat informasi website ini. Berikut ini beberapa tampilan yang ada pada website


(68)

4.6.1 Tampilan Awal

Halaman umum merupakan gambaran dari seluruh isi website yang dirancang oleh

admin. Pada halaman umum ini, terdapat beberapa menu , yaitu Home, Gallery, News, About Us dan Login.

Gambar 4.12 Tampilan Awal

4.6.2 Tampilan Login

Halaman login digunakan hanya untuk admin agar dapat masuk kehalaman privasi admin. Seorang admin dapat masuk kehalaman admin jika password dan username benar


(69)

Gambar 4.13 Tampilan Login

4.6.3 Tampilan Admin

Halaman ini merupakan halam untuk admin. Pada halaman ini admin melakukan tambah,

edit serta delete data. Pada halaman admin terdapat beberapa menu , yaitu :


(70)

Gambar 4.14 Tampilan Admin

4.6.4 Tampilan Category

Halaman ini digunakan untuk menambah, meng-edit dan menghapus category motor.


(71)

4.6.5 Tampilan Merk

Halaman ini digunakan untuk menambah, meng-edit dan menghapus merk motor.

Gambar 4.16 Tampilan Merk

4.6.6 Tampilan Motor

Halaman ini digunakan untuk menambah, meng-edit, dan menghapus jenis motor.


(72)

(73)

KESIMPULAN DAN SARAN

5.1 Kesimpulan

Adapun kesimpulan yang dapat diambil oleh penulis dalam pembuatan Sistem Informasi

Pemasaran Pada Showroom Mutiara Motor adalah sebagai berikut :

1. Dengan adanya Sistem Informasi Pemasaran Pada Showroom Mutiara Motor ini,

dapat memperluas pemasaran produk yang dapat meningkatkan jumlah

keuntungan bagi Showroom Mutiara Motor.

2. Memberikan Informasi seperti tampilan produk dan harga sehingga pelanggan

bisa mendapatkan informasi yang terbaru hanya dengan membuka website

Showroom ini.

5.2 Saran

Dengan selesainya website Sistem Informasi Pemasaran Pada Showroom Mutiara Motor ini, penulis memberikan beberapa saran yang dapat mendukung pengembangan sistem


(74)

1. Tampilan website dibuat semenarik mungkin, sehingga dapat meningkatkan daya tarik kepada pengunjung website ini.

2. Pemeliharaan keamanan terhadap data pada server sangat perlu diawasi dan dijaga dengan baik agar tidak bisa diakses oleh orang yang tidak berkepentingan.

3. Komputer yang digunakan dalam membuat suatu aplikasi web sebaiknya memiliki spesifikasi dengan level menengah karena penggunaan software yang banyak memakan sumber daya komputer seperti memori dan kapasitas hardisk.


(75)

Kotler, Philip.2011. Manajemen Pemasaran di Indonesia : Analisis, Perencanaan, Implementasi dan Pengendalian. Jakarta : Penerbit Salemba Empat

S.Betha., P.H. Iskandar. 2012. Pemrograman Web Dengan HTML. Jakarta: Penerbit INFORMATIKA

Stanto, William J.2001. Prinsip Pemasaran. Jakarta : Penerbit Erlangga

Wahana,Komputer. 2012. Shortcourse Series Adobe Dreamweaver CS5 untuk Beragam Desain Website Interaktif. Yogyakarta : Andi


(76)

1. Index.php

<!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/1999/xhtml"> <head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Showroom Mutiara Motor</title>

<meta name="keywords" content="agency, model girls, free website template, CSS, HTML" />

<meta name="description" content="Agency is a free website template by templatemo.com for everyone. Feel free to use this template for any purpose." />

<link href="templatemo_style.css" rel="stylesheet" type="text/css" />

<link rel="stylesheet" href="css/orman.css" type="text/css" media="screen" />

<link rel="stylesheet" href="css/nivo-slider.css" type="text/css" media="screen" />

<script language="javascript" type="text/javascript"> function clearText(field)

{

if (field.defaultValue == field.value) field.value = '';


(77)

</script>

<link rel="stylesheet" type="text/css" href="ddsmoothmenu.css" />

<script type="text/javascript" src="js/jquery.min.js"></script> <script type="text/javascript" src="js/ddsmoothmenu.js">

/*********************************************** * Smooth Navigational Menu- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)

* This notice MUST stay intact for legal use

* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code

***********************************************/

</script>

<script type="text/javascript">

ddsmoothmenu.init({

mainmenuid: "templatemo_menu", //menu DIV id orientation: 'h', //Horizontal or vertical menu: Set to "h" or "v"

classname: 'ddsmoothmenu', //class added to menu's outer DIV


(78)

})

</script>

<link rel="stylesheet" href="css/slimbox2.css" type="text/css" media="screen" />

<script type="text/JavaScript" src="js/slimbox2.js"></script>

</head> <body>

<div id="templatemo_menu_wrapper">

<div id="templatemo_menu" class="ddsmoothmenu"> <?php include "include/menu.php"?>

<br style="clear: left" />

</div> <!-- end of templatemo_menu --> </div> <!-- end of templatemo_menu_wrapper -->

<div id="templatemo_header_wrapper">

<div id="templatemo_header" class="header_sub"> <div id="templatemo_sitetitle_bar">

<div id="site_title"><h1><font

color="#C05F37">Mutiara Motor</font></h1></p></div> <div id="templatemo_search">

<!--<form action="#" method="get"> <input type="text" value="Search" name="keyword" id="keyword" title="keyword"


(79)

value="" alt="Search" id="searchbutton" title="Search" class="sub_btn" />

</form>--> </div>

<div class="cleaner"></div> </div>

</div> <!-- end of header --> </div> <!-- end of header_wrapper -->

<div id="templatemo_main"> <?php

$p=$_REQUEST['p']; if($p)

{

include "include/$p"; }

else {

include "include/content.php"; }

?>

<div class="cleaner"></div> </div>

<div id="templatemo_footer_wrapper"> <div id="templatemo_footer">

<?php include "include/footer.php"?> <div class="cleaner"></div>


(80)

<div id="templatemo_cr_bar_wrapper"> <div id="templatemo_cr_bar">

Copyright © 2013 <a href="#">Riztanty Septiyani Lubis</a>

</div> </div>

</body> </html>

2. Cek Login.php <?php

session_start();

if(!isset($_SESSION['admin'])) {

?>

<script language="javascript">

alert ("Silahkan Login terlebih dahulu..") location.href="../index.php?p=login.php"; </script>

<?php } ?>

3. Class_pagging.php <?php

class Paging {


(81)

{

if(empty($_GET[halaman])){ $posisi=0;

$_GET[halaman]=1; }

else{

$posisi = ($_GET[halaman]-1) * $batas; }

return $posisi; }

// Fungsi untuk menghitung total halaman function jumlahHalaman($jmldata, $batas) {

$jmlhalaman = ceil($jmldata/$batas); return $jmlhalaman;

}

// Fungsi untuk link halaman 1,2,3 ... Next, Prev, First, Last

function navHalaman($halaman_aktif, $jmlhalaman, $page) {

$link_halaman = "";

// Link First dan Previous if ($halaman_aktif > 1) {

$link_halaman .= " <a href=$file?$page&amp;halaman=1><< First</a> | ";


(82)

if (($halaman_aktif-1) > 0) {

$previous = $halaman_aktif-1; $link_halaman .= "<a

href=$file?$page&amp;halaman=$previous>< Previous</a> | ";

}

// Link halaman 1,2,3, ...

for ($i=1; $i<=$jmlhalaman; $i++) {

if ($i == $halaman_aktif) {

$link_halaman .= "<b>$i</b> | "; }

else {

$link_halaman .= "<a

href=$file?$page&amp;halaman=$i>$i</a> | "; }

$link_halaman .= " "; }

// Link Next dan Last

if ($halaman_aktif < $jmlhalaman) {

$next=$halaman_aktif+1; $link_halaman .= " <a


(83)

if (($halaman_aktif != $jmlhalaman) && ($jmlhalaman != 0))

{

$link_halaman .= " | <a

href=$file?$page&amp;halaman=$jmlhalaman>Last >></a> "; }

return $link_halaman; }

} ?>

4. Koneksi.php <?php

$hostname="localhost"; $dbuser="root";

$dbpasswd="";

$dbname="showroom";

$koneksi= mysql_connect

("$hostname","$dbuser","$dbpasswd") or die (mysql_error());

mysql_select_db($dbname,$koneksi) or die (mysql_error());

?>

5. Login.php <?php


(84)

$username=$_REQUEST['user']; $pass=$_REQUEST['password'];

if ($username!='' && $pass!='') {

$sql="SELECT * FROM user WHERE

username='$username' AND password='$pass'";

$result= mysql_query($sql) or die (mysql_error()); $hasil=mysql_fetch_array($result);

if($hasil['username']==$username && $hasil['password']==$pass)

{

session_start();

$_SESSION['admin']=$hasil['username']; header

("location:../admin/index.php"); }

else { ?>

<script language="javascript">

alert('maaf, data form login kurang lengkap')

window.location = "../index.php"; </script>


(85)

} ?>

6. Logout.php <?php

include("../library/koneksi.php");

$username=$_REQUEST['user']; $pass=$_REQUEST['password'];

if ($username!='' && $pass!='') {

$sql="SELECT * FROM user WHERE

username='$username' AND password='$pass'";

$result= mysql_query($sql) or die (mysql_error()); $hasil=mysql_fetch_array($result);

if($hasil['username']==$username && $hasil['password']==$pass)

{

session_start();

$_SESSION['admin']=$hasil['username']; header

("location:../admin/index.php"); }

else {


(86)

alert('maaf, data form login kurang lengkap')

window.location = "../index.php"; </script>

<?php }

} ?>

7. Style.css

/* Credit: http://www.templatemo.com */

body {

margin: 0; padding: 0; color: #ddd4c5;

font-family: Verdana, Geneva, sans-serif; font-size: 13px;

line-height: 1.3em;

background-color: #2d261a; }

a, a:link, a:visited { color: #fff; font-weight: normal; text-decoration: underline }

a:hover { text-decoration: none; }

p { margin: 0 0 10px 0; padding: 0; } img { border: none; }


(87)

cite a, cite a:link, cite a:visited { font-size: 12px; text-decoration: none; font-style: normal }

cite span { font-weight: 400; color: #fff; } em { color: #fff; }

h1, h2, h3, h4, h5, h6 { color: #fff; font-weight: normal; font-family: Georgia, "Times New Roman", Times, serif }

h1 { font-size: 48px; margin: 0 0 30px; padding: 5px 0 }

h2 { font-size: 38px; margin: 0 0 25px; padding: 5px 0; }

h3 { font-size: 30px; margin: 0 0 20px; padding: 0; } h4 { font-size: 24px; margin: 0 0 15px; padding: 0; } h5 { font-size: 20px; margin: 0 0 10px; padding: 0; } h6 { font-size: 14px; margin: 0 0 5px; padding: 0; }

.cleaner { clear: both } .h10 { height: 10px } .h20 { height: 20px } .h30 { height: 30px } .h40 { height: 40px } .h50 { height: 50px } .h60 { height: 60px }

.dv_hr { margin-bottom: 40px; padding-bottom: 40px; border-bottom: 1px dashed #726144 }

.float_l { float: left } .float_r { float: right }


(88)

margin-bottom: 20px; border: solid 5px #726144 }

.image_frame_detail { width: 600px; border: solid 5px #726144; display:block; margin:20px auto; }

.image_frame_big { width: 670px; height: 300px;

background: url(images/templatemo_image_frame_big.png) no-repeat; padding: 10px; margin-bottom: 20px }

.image_fl { float: left; margin: 3px 30px 0 0 } .image_fr { float: right; margin: 3px 0 0 30px }

.tmo_list { list-style: decimal-leading-zero; padding: 0 0 0 15px; margin: 0 0 0 15px; }

.tmo_list li { color:#595858; margin-bottom: 8px } .tmo_list li a { color: #595858; font-weight: normal; font-size: 12px; text-decoration: none }

.tmo_list li a:hover { text-decoration: underline }

#templatemo_menu_wrapper { height: 59px; width: 100%; background: url(images/templatemo_menu.png) repeat-x bottom }

#templatemo_menu { width: 960px; padding: 0 10px; margin: 0 auto }

#templatemo_header_wrapper { width: 100%;

background: url(images/templatemo_middle.png) bottom repeat-x

}


(89)

repeat }

.header_home { height: 402px } .header_sub { height: 110px }

#templatemo_sitetitle_bar { padding: 20px 0;

}

#site_title { float: left; padding-bottom: 20px; background: url(images/templatemo_sitetitle.png) no-repeat center bottom }

#site_title h1 { margin: 0; padding: 0 }

#site_title h1 a { display: block; width: 153px; height: 36px; color: #fff; text-indent: -10000px; background: url(images/templatemo_logo.png) no-repeat top left }

#templatemo_search { float: right } #templatemo_search form {

margin: 0; padding: 3px; height: 27px; width: 236px;

background: url(images/templatemo_search.png) no-repeat


(90)

float: left; display: block; height: 27px;

line-height: 27px; width: 196px;

color: #000; font-size: 11px; padding: 0 5px;

font-variant: normal; border: none;

background: none; }

#templatemo_search .sub_btn { float: right;

display: block;

height: 27px;

width: 30px; cursor: pointer; border: none; background: none; }

#templatemo_mid { clear: both; height: 284px; padding: 0; }


(91)

font-family: "Times New Roman", Times, serif; font-size: 30px;

font-style: italic; line-height: 34px; color: #774422;

margin-bottom: 40px; }

#mid_left { float:left; width: 460px; padding-top: 30px; }

#mid_text {

color: #90e2ff;

font-family: Tahoma, Geneva, sans-serif; font-style: italic;

margin-bottom: 30px; font-size: 16px; line-height: 26px; }

#learn_more a { float: left; bottom: 30px; display: block; width: 160px; height: 50px;

text-indent: -10000px; line-height: 50px; font-size: 24px;


(92)

background: url(images/templatemo_learn_more.png) no-repeat;

}

#learn_more a:hover { color: #fff; text-decoration: none }

#slider-wrapper { float: right; width: 398px; height: 264px;

padding: 19px 0 0 31px; background:

url(images/templatemo_slider_frame.png) no-repeat }

#slider {

position:relative; width:390px;

height:190px;

background:url(images/loading.gif) no-repeat 50% 50%;

}

#slider img {

position:absolute; top:0px;

left:0px; display:none; }


(93)

display:block; } .nivo-controlNav { position:absolute; right: 10px; bottom: -28px; }

.nivo-controlNav a { display:block; width: 10px; height: 10px; background: url(images/templatemo_sliderbtn.png) no-repeat; text-indent: -9999px; border:0; margin-right:3px; float:left; }

.nivo-controlNav a.active { background:

url(images/templatemo_sliderbtn_hover.png) no-repeat }

.nivo-directionNav a { display:block; width:30px; height:30px;


(94)

}

a.nivo-nextNav {

background-position:-30px 0; right:15px;

}

a.nivo-prevNav { left:15px; }

.nivo-caption {

text-shadow:none;

font-family: Helvetica, Arial, sans-serif; }

.nivo-caption p { font-size: 12px } .nivo-caption a {

color: #069;

text-decoration:underline; }

#templatemo_main { width: 960px;

padding: 40px 10px; margin: 0 auto;

}

.title_with_icon img { float: left; margin-right: 10px }

.title_with_icon h3 { display: inline; font-size: 16px; line-height: 24px }


(95)

float: left; width: 690px; }

#sidebar {

float: right; width: 240px; }

#sidebar h3 { font-size: 20px; font-weight: bold }

.sidebar_menu { margin: 0; padding: 0; list-style: none }

.sidebar_menu li { margin: 0 0 10px; padding: 0 0 5px; border-bottom: 1px dashed #726144 }

.sidebar_menu li a { display: block; padding: 2px 0 2px 0; color: #ddd4c5; text-decoration: none }

.sidebar_rc { margin: 0; padding: 0; list-style: none } .sidebar_rc li { margin: 0 0 10px; padding: 0 0 5px; border-bottom: 1px dotted #919191 }

.sidebar_rc li a { padding: 2px 0; color: #3a3a3a }

.col_2 { width: 470px }

.col_3 { float: left; width: 300px; margin-right: 20px }

.col_4 { float: left; width: 225px; margin-right: 20px }


(96)

10px; margin-bottom: 20px; background:

url(images/templatemo_image_frame_01.png) no-repeat }*/ .fp_rp h2 { font-size: 20px; border-bottom: 1px dashed #726144; margin-bottom: 10px; padding-bottom: 5px } .fp_rp h2 a { text-decoration: none }

.info h2 { font-size: 26px; font-weight: 400; margin-bottom: 15px ; color:#EA9C3C}

.info h3 { font-size: 20px; font-weight: 400; margin-bottom: 15px; color:#E9C18D }

#contact_form { padding: 0; width: 400px}

#contact_form form { margin: 0px; padding: 0px; }

#contact_form form .input_field { width: 270px;

padding: 5px; color: #FFFFFF;

background: #726144;

border: 1px solid #918063;

font-family: Tahoma, Geneva, sans-serif; font-size: 12px;

}

#contact_form form label { display: block; width: 100px; margin-right: 12px; font-size: 11px }

#contact_form form textarea { width: 388px;


(97)

background: #726144;

border: 1px solid #918063;

font-family: Tahoma, Geneva, sans-serif; font-size: 12px;

}

#contact_form form .submit_btn { display: block;

padding: 10px 20px; text-align: center; text-decoration: none; font-weight: bold; background: #f3bc4b; color: #000;

border: 1px solid #000;

font-family: Tahoma, Geneva, sans-serif; font-size: 12px;

cursor: pointer; }

.about_box { clear: both; margin-bottom: 40px } .about_box img { float: left; margin-right: 40px } .about_box h4 { font-size: 18px; font-weight: bold; font-style: italic; margin-bottom: 10px }

p.position { color: #f3a706; weight: bold; font-size: 14px; font-style: italic; margin-bottom: 10px }

.gallery_box { clear: both; margin-bottom: 40px } .gallery_box img { float: right }


(98)

.post_box { clear: both; margin-bottom: 60px } .post_box h2 { font-size: 26px; font-weight: 400; margin-bottom: 15px ; color:#EA9C3C}

.post_box h3 { font-size: 20px; font-weight: 400; margin-bottom: 15px; color:#E9C18D }

#item_detail h2 { font-size: 26px; font-weight: 400; margin-bottom: 15px ; color:#EA9C3C}

#item_detail h3 { font-size: 20px; font-weight: 400; margin-bottom: 15px; color:#E9C18D }

.post_meta { color: #907244; padding: 2px 0; border: 1px dashed #726144; border-left: none; border-right: none; margin-bottom: 20px }

.post_meta i { color: #907244; font-style: italic } .post_meta a { color: #907244; text-decoration: none; }

.post_meta span { float: right; color: #fff } .post_box img { float: left; margin-right: 30px }

.post_box .info{ width:350px; float:left; height:260px;}

.more{ }

#comment_section { clear: both;


(1)

<td>$no</td>

<td>".$a['nama_merk']."</td> <td>".$a['ket_merk']."</td> <td>

<a

href='index.php?p=merk/merk_edit.php&id_merk=".$a['id_m erk']."'>edit </a>||

<a

href='include/merk/merk_hapus.php?id_merk=".$a['id_merk ']."' >hapus</a>

</td>" ;

$no++; }

?>

</table>

<a href="../../index.php">kembali</a>

13.Motor.php

<a href="index.php?p=motor/motor_tambah.php">tambah</a>

<?php

include "../library/koneksi.php";

$p=$_REQUEST['p'];

$file = "index.php?p=$p"; $page = "p=$p";


(2)

include "../library/class_paging.php"; $p = new Paging;

// Tentukan limit atau batas $batas = 10;

// Cek halaman dan posisi data $posisi = $p->cariPosisi($batas);

?>

<table class="tabel_data"> <tr>

<th>No</th> <th>Nama</th> <th>Merk</th> <th>Kategori</th> <th>Stok</th> <th>Harga</th> <th>Foto</th>

<th>Keterangan</th> <th>Option</th> </tr>

<?php

$no=$posisi+1;

$query="SELECT * FROM motor NATURAL JOIN category NATURAL JOIN merk";

$sql = mysql_query($query." ORDER BY id_motor DESC LIMIT $posisi,$batas", $koneksi) or die

(mysql_error());


(3)

while($row=mysql_fetch_array($sql)) {

if($no%2==0)

$warna="genap"; else

$warna="ganjil";

$id= $row['id_motor']; ?>

<tr class="<?php echo $warna?>"> <td><?php echo $no?></td>

<td><?php echo $row['nama_motor']?></td> <td><?php echo $row['nama_merk']?></td> <td><?php echo $row['nama_category']?></td> <td><?php echo $row['stok_motor']?></td> <td><?php echo $row['harga_motor']?></td> <td><?php echo $row['foto_motor']?></td> <td><?php echo

substr($row['ket_motor'],0,50)?></td> <td>

<a

href='index.php?p=motor/motor_edit.php&id_motor=<?php echo $id?>' onClick="return confirm('Anda ingin

mengubah data?')"><acronym title='Edit Data'><img src='images/edit.png' width='20' height='20'

alt='edit'></a>&nbsp;&nbsp; <a

href='include/motor/motor_edit.php?id_motor=<?php echo $id?>' onClick="return confirm('Anda ingin menghapus data?')"><acronym title='Hapus Data'><img


(4)

src='images/delete.png' width='20' height='20' alt='delete'></acronym></a>&nbsp;&nbsp;

</td> </tr> <?php

$no++; }

?>

</table> <?php

// Dapatkan jumlah data keseluruhan $jmldata = mysql_num_rows($sql2);

// Dapatkan jumlah halaman

$jmlhalaman = $p->jumlahHalaman($jmldata, $batas);

// Cetak link navigasi halaman

$linkHalaman = $p->navHalaman($_GET[halaman], $jmlhalaman, $page);

echo $linkHalaman; ?>

14.News.php(Admin)

<!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/1999/xhtml"> <head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />


(5)

<title>Untitled Document</title> </head>

<body>

<a href="index.php?p=news/news_tambah.php">tambah</a> <table border="0" class="tabel_data">

<tr>

<th>No</th>

<th>Judul</th> <th>Isi</th> <th>Action</th> </tr>

<?php

include"../library/koneksi.php";

$sql=mysql_query("select*from berita");

$no=+1;

while($a=mysql_fetch_array($sql)) {

if($no%2==0)

$warna="genap"; else

$warna="ganjil"; echo"

<tr class='$warna'> <td>$no</td>

<td>".$a['judul_berita']."</td>

<td>".substr($a['isi_berita'],0,200)."</td> <td>


(6)

<a

href='index.php?p=news/news_edit.php&id_news=".$a['id_b erita']."'>edit </a>||

<a

href='include/news/news_hapus.php?id_news=".$a['id_beri ta']."' >hapus</a>

</td>" ;

$no++; }

?>

</table>

<a href="../../index.php">kembali</a> </body>