• Tidak ada hasil yang ditemukan

Perancangan Website E-Commerce Pada Toko Pakaian Cantik Modis Menggunakan Dreamweaver 8

N/A
N/A
Protected

Academic year: 2017

Membagikan "Perancangan Website E-Commerce Pada Toko Pakaian Cantik Modis Menggunakan Dreamweaver 8"

Copied!
98
0
0

Teks penuh

(1)

KEMENTERIAN PENDIDIKAN NASIONAL

UNIVERSITAS SUMATERA UTARA

FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM Jl. Bioteknologi No. 1 Kampus USU

Telp. (061) 8214290, 8211212, 8211414 Fax. (061) 8214290 Medan 20155

Kartu Bimbingan Tugas Akhir Mahasiswa

Nama : Dimas Andika Nasution

Nomor Induk Mahasiswa : 102406146

Judul Tugas Akhir : Perancangan Website E-Commerce Pada Toko

Pakaian Cantik Modis Menggunakan Dreamweaver 8

Dosen Pembimbing : Syahriol Sitorus, S.Si, M.IT

Tanggal Mulai Bimbingan : ...

Tanggal Selesai Bimbingan : ...

No Tanggal Asistensi Bimbingan

Pembahasan Pada Asistensi Mengenai, Pada Bab :

Paraf Dosen

Pembimbing Keterangan

*Kartu ini harap dikembalikan ke Departemen Matematika bila bimbingan mahasiswa telah selesai

Diketahui, Disetujui,

Departemen Matematika FMIPA USU Pembimbing Utama/

Ketua Penanggung Jawab

(2)

SURAT KETERANGAN

Hasil Uji Program Tugas Akhir

Yang bertanda tangan di bawah ini, menerangkan bahwa Mahasiswa Tugas Akhir

Program Diploma 3 Teknik Informatika :

Nama : DIMAS ANDIKA NASUTION

NIM : 102406146

Program Studi : DIPLOMA (D3) TEKNIK INFORMATIKA

Judul Tugas Akhir : PERANCANGAN WEBSITE E-COMMERCE PADA TOKO

PAKAIAN CANTIK MODIS MENGGUNAKAN

DREAMWEAVER 8

Telah melaksanakan test program Tugas Akhir Mahasiswa tersebut di atas pada

tanggal Juni 2013

Dengan Hasil : SUKSES / GAGAL

Demikian diterangkan untuk digunakan melengkapi syarat pendaftaran Ujian Meja

Hijau Tugas Akhir Mahasiswa bersangkutan di Departemen Matematika FMIPA USU

Medan.

Medan, Juni 2013

Dosen Pembimbing

Program Studi D3 Teknik Informatika

(3)

LISTING PROGRAM

1. Index.php <html>

<head><title>CANTIK MODIS</title>

<link href="css/style.css" rel="stylesheet" type="text/css" /> <!-- include CSS always before including js -->

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

<!-- include jQuery library --> <script type="text/javascript"

src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" ></script>

<!-- include tn3 plugin --> <script type="text/javascript"

src="js/jquery.tn3lite.min.js"></script>

<!-- initialize the TN3 when the DOM is ready --> <script type="text/javascript">

$(document).ready(function() {

//Thumbnailer.config.shaderOpacity = 1; var tn1 = $('.mygallery').tn3({

skinDir:"skins",

(4)

<div id="logo"><img src="images/logo.png"></div> src="images/info.png" />&nbsp;CARA ORDER</a></li>

<li><a href="?p=gallery.php"><img

include $_REQUEST['p']; }

else {

include "content.php"; }

?>

</div>

<?php include"menu.php"; ?>

<div id="footer">Copyright © 2013 Cantik Modis</div> </div>

</body> </html>

2. Content.php

<h2>SELAMAT DATANG DI WEBSITE KAMI</h2> <hr noshade />

<div id="slider">

<div class="mygallery">

<div class="tn3 album"> <h4>Fixed Dimensions</h4>

<div class="tn3 description">Images with fixed dimensions</div>

<div class="tn3 thumb">images/35x35/1.jpg</div> <ol>

<li>

<h4>Produk-produk Cantik Modis</h4> <div class="tn3 description"></div>

<a href="images/960x377/cantik modis.jpg"> <img src="images/35x35/1.jpg" /></a></li> <li>

<h4>Produk-produk Cantik Modis</h4> <div class="tn3 description"></div>

(5)

<li>

<h4>Produk-produk Cantik Modis</h4> <div class="tn3 description"></div>

<a href="images/960x377/cantik modis2.jpg"> <img src="images/35x35/3.jpg" /></a></li> <li>

<h4>Produk-produk Cantik Modis</h4> <div class="tn3 description"></div>

<a href="images/960x377/cantik modis3.jpg"> <img src="images/35x35/4.jpg" /></a></li> </ol>

<img src="images/about.png"/>&nbsp;&nbsp;ABOUT US</a></li> <li><a href="?p=contact.php">

<img src="images/contact.png" />&nbsp;&nbsp;CONTACT</a></li> <li><a href="?p=login.php">

<img src="images/login.png" />&nbsp;&nbsp;LOGIN</a></li> </ul>

</div>

4. Cara_order.php <div id="syarat">

<h3>Sebelum memesan, mohon dibaca terlebih dahulu prosedur dan Terms of Service dari kami.</h3>

<hr noshade /> <br />

<h5>PEMESANAN</h5>

<p>Sebelum melakukan pemesanan barang, pilih barang yang ingin di pesan di menu <font color="#0000FF"

style="font-weight:bold">"Gallery"</font> lalu pilih jenis barang yang ingin Anda Pesan, lalu klik tombol <font color="#0000FF"

style="font-weight:bold">"Beli"</font> pada barang yang ingin Anda beli. Setelah itu isi form secara lengkap kecuali <font color="#0000FF"

style="font-weight:bold">Nama Barang</font> karena sudah terisi otomatis dari barang yang Anda pilih sebelumnya. Setelah Form Order terisi lengkap klik tombol ORDER agar data Anda tersimpan.</p>

<h5>PEMBAYARAN</h5>

(6)

diselesaikan sebelum H-7. Order kami anggap confirmed statusnya setelah pembayaran selesai.</p>

<h5>PENGIRIMAN</h5>

<p>1. Setelah transaksi diselesaikan, order akan kami masukan dalam schedule. Kami akan mengerjakan dan mengirimkan pesanan Anda pada tanggal, waktu dan alamat yang sudah ditentukan. </p>

<p>2. Harga yang tercantum pada katalog belum termasuk ongkos kirim. Ongkos kirim bervariasi tergantung jauh dekatnya lokasi tujuan (between Rp. 15.000 - 50.000). Wilayah kota Medan - gratis.</p>

<p>3. Nomor kontak penerima sangat penting, agar dapat kami/kurir hubungi apabila kami menemui kesulitan dalam mencari alamat tujuan.</p>

<h5>LAPORAN</h5>

<p>Apabila barang yang dipesan telah sampai, kami berharap Anda memberi laporan berupa sms atau email ke kami agar tidak terjadi kesalah pahaman. Terimakasih.</p>

<h5>INFORMASI TENTANG TOKO PAKAIAN CANTIK MODIS:</h5> <table border="0">

<tr><td width="100px">Telefon/Hp</td><td>: 085763522177</td></tr>

<tr><td>Email</td><td>: Cantikmodis@yahoo.co.id</td></tr>

<tr><td>Alamat</td><td>: Jl. Abdullah Lubis 85/119 Medan Baru</td></tr>

</table>

<hr noshade="noshade" />

<h3>TOKO PAKAIAN CANTIK MODIS</h3> </div>

5. Aboutus.php <div id="c_1">

<div id="c_2">

<h4>TENTANG CANTIK MODIS</h4>

<p>Toko Pakaian Cantik Modis ini dibuka pada tanggal 1 Agustus 2012 yang berlokasi di Jalan Abdullah Lubis 85/119 Medan Baru, Medan. Dan beroperasi dari pukul 09.OO WIB - 23.00 WIB</p>

<p>Toko Pakaian Cantik Modis ini menjual pakaian-pakaian wanita dari berbagai merk.</p>

</div>

<div id="c_3"><img src="images/images/b.jpg" /></div> </div>

<hr noshade /> <div id="c_4">

<div id="c_5">

<h5>Artikel Tentang Produk Yang Ditawarkan:</h5> <table cellpadding="5px" cellspacing="5px">

<tr>

<td width="360px"><b>Blus</b> adalah pakaian tubuh bagian atas bermodel longgar yang sebelumnya dikenakan oleh pekerja, petani, seniman, perempuan dan anak-anak.

Blus biasanya dikenakan denga cara dikumpulkan di bagian pinggang (dengan ikat pinggang atau sabuk) sehingga menggantung longgar diatas tubuh pemakainya. (sumber: wikipedia bahasa indonesia)</td>

(7)

celana pendek (dengan ukuran dari pinggang sampai lutut atau kurang). celana panjang (dengan ukuran dari pinggang sampai tumit). (sumber: wikipedia bahasa indonesia) </td></tr>

<tr>

<td><b>Gamis</b> adalah jenis pakaian muslim wanita dengan model lurus, panjang dan longgar menutupi seluruh badan mulai dari dada sampai kaki mata kaki, sehingga pemakainya tidak harus mencari atasan atau bawahan karena sudah dalam satu kesatuan.</td>

<td><b>Rok</b> adalah sejenis pakaian dengan bentuk pipa atau kerucut yang cara pemakaiannya dimulai dari pinggul dan menutupi sebagian atau seluruh bagian kaki. berbeda dengan celana, bagian dari rok tidak dibagi menjadi bagian kaki kiri dan bagian kaki kanan tetapi langsung menjadi satu bagian yang menutupi sebagian atau seluruh bagian kaki. (sumber: wikipedia bahasa indonesia) </td></tr>

<tr>

<td><b>Jilbab</b> adalah busanan muslim terusan panjang menutupi seluruh badan kecuali tangan, kaki, dan wajah yang biasa dikenakan oleh para wanita muslim. (sumber: wikipedia bahasa indonesia)</td></tr>

</table> </div>

<div id="c_6">

<div class="logo1">Jasa Pembayaran<hr noshade="noshade" /><img src="images/bca.jpg" /></div>

<div class="logo2">Jasa Pengiriman<hr noshade="noshade" /><img src="images/jne.jpg" /></div>

</div>

<p>Kami selalu siap menjawab pertanyaan Anda! Silahkan Hubungi kami di:</p>

<tr><td>Alamat</td><td>: Jl. Abdullah Lubis 85/119 Medan Baru</td></tr>

</table> </div>

<div id="c_3"><img src="images/images/a.jpg" /></div> </div>

<hr noshade /> <div id="c_4">

<div id="c_5">

<h5>Artikel Tentang Produk Yang Ditawarkan:</h5> <table cellpadding="5px" cellspacing="5px">

(8)

<td width="360px"><b>Blus</b> adalah pakaian tubuh bagian atas bermodel longgar yang sebelumnya dikenakan oleh pekerja, petani, seniman, perempuan dan anak-anak.

Blus biasanya dikenakan denga cara dikumpulkan di bagian pinggang (dengan ikat pinggang atau sabuk) sehingga menggantung longgar diatas tubuh pemakainya. (sumber: wikipedia bahasa indonesia)</td>

<td width="370px"><b>Celana</b> adalah pakaian bawahan yang dipakai untuk menutupi dari pinggang sampai kaki. ada dua kategori umum dari celana:

celana pendek (dengan ukuran dari pinggang sampai lutut atau kurang). celana panjang (dengan ukuran dari pinggang sampai tumit). (sumber: wikipedia bahasa indonesia) </td></tr>

<tr>

<td><b>Gamis</b> adalah jenis pakaian muslim wanita dengan model lurus, panjang dan longgar menutupi seluruh badan mulai dari dada sampai kaki mata kaki, sehingga pemakainya tidak harus mencari atasan atau bawahan karena sudah dalam satu kesatuan.</td>

<td><b>Rok</b> adalah sejenis pakaian dengan bentuk pipa atau kerucut yang cara pemakaiannya dimulai dari pinggul dan menutupi sebagian atau seluruh bagian kaki.

berbeda dengan celana, bagian dari rok tidak dibagi menjadi bagian kaki kiri dan bagian kaki kanan tetapi langsung menjadi satu bagian yang menutupi sebagian atau seluruh bagian kaki. (sumber: wikipedia bahasa indonesia) </td></tr>

<tr>

<td><b>Jilbab</b> adalah busanan muslim terusan panjang menutupi seluruh badan kecuali tangan, kaki, dan wajah yang biasa dikenakan oleh para wanita muslim. (sumber: wikipedia bahasa indonesia)</td>

</tr> </table> </div>

<div id="c_6">

<div class="logo1">Jasa Pembayaran<hr noshade="noshade" /><img src="images/bca.jpg" /></div>

<div class="logo2">Jasa Pengiriman<hr noshade="noshade" /><img src="images/jne.jpg" /></div>

</div>

<img src="images/blus.jpg" /></a></li> <li><a href="?p=Celana.php">

<img src="images/celana.jpg" /></a></li> <li><a href="?p=Gamis.php">

<img src="images/gamis.jpg" /></a></li> <li><a href="?p=Jilbab.php">

(9)

<img src="images/rok.jpg" /></a></li> <li><a href="?p=Stelan.php">

<img src="images/stelan.jpg" /></a></li> </ul>

$sql=mysql_query("select * from barang Where nama_kategori='Blus'"); ?>

<script type="text/JavaScript"> <!--

function MM_popupMsg(msg) { //v1.0 alert(msg);

}

function MM_goToURL() { //v3.0

var i, args=MM_goToURL.arguments; document.MM_returnValue = false; for (i=0; i<(args.length-1); i+=2)

eval(args[i]+".location='"+args[i+1]+"'"); }

//--> </script> <?php

//menentukan batas, cek dan posisi data $batas=10;

$halaman = $_REQUEST['halaman'];

if(empty($halaman)){

//sesuaikan perintah SQL dengan posisi dan batas

$sql= "SELECT * FROM barang where nama_kategori='Blus' ORDER BY id_barang DESC LIMIT $posisi,$batas";

$result = mysql_query($sql); $test=mysql_num_rows($result); if ($test!=0)

{ while($data=mysql_fetch_array($result)){ ?>

<div id="tampilan">

<table border="0" align="center">

<tr><?php $id= $data['id_barang']; ?><td align="center" ><img src="admin/images/images/<?php echo $data['gambar']; ?>" /></td></tr>

<tr><td align="center"><?php echo

$data['nama_kategori']; ?>&nbsp;<?php echo $data['nama_barang']; ?></td></tr>

(10)

<tr><td align="center"><acronym title="Edit Data"><img src="images/beli.png" align="middle"

onClick="MM_goToURL('parent', 'index.php?p=order.php&amp;id=<?php echo $data['id_barang']; ?>');return document.MM_returnValue" /></acronym></td>

echo"<table width='500' align='center' id='tabel_show' cellpadding='1' cellspacing='1'><tr><td></td><td>";

$sql2 = mysql_query("select * from barang where nama_kategori='Blus'");

$result=mysql_num_rows($sql2); $jmlhalaman=ceil($result/$batas);

/* bangun Previous link */ if($halaman > 1){

$prev = ($halaman - 1); ?>

<a href="index.php?p=gamis.php&amp;halaman=1"> &lt;&lt; First</a> |

<a href="index.php?p=gamis.php&amp;<? echo "halaman=$prev"; ?>"> &lt;&lt;Previous &nbsp;</a>

<?php } else {

echo "<p>First| < Previous "; } //tampilkan link halaman 1,2,3...

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

echo "$i "; }

else { ?>

<a href="index.php?p=gamis.php&amp;<? echo "halaman=$i"; ?>"><? echo $i; ?></a>

<?php } }

/* bangun Next link */ if($halaman < $jmlhalaman){

$next = $halaman + 1; ?>

<a href="index.php?p=gamis.php&amp;<? echo "halaman=$next"; ?>">Next&gt; |</a>

<a href="index.php?p=gamis.php&amp;<? echo "halaman=$jmlhalaman"; ?>">Last </a>

<?php }

echo "</td></tr></table></div>";

}//akhir dari kondisi bahwa data tidak kosong

else { echo "<p>MAAF, BARANG TIDAK TERSEDIA</p>"; }

(11)

9. Order.php <div id="form"> <?php

include ("koneksi.php"); $id=$_REQUEST['id'];

$view= mysql_query ("select nama_kategori, nama_barang from barang where id_barang='$id'",$koneksi)

or die (mysql_error());

if ($data=mysql_fetch_array ($view)) {

?>

<form action="proses_order.php" method="post"> <table border="0">

echo "<option value='$i'>$i</option>"; }

echo "<option value='$w'>$bulan[$i]</option>"; }

echo "<option value='$i'>$i</option>"; }

?>

</select> </td> </tr>

<tr><td>Nama Lengkap</td><td>: <input type="text" name="nama" placeholder="Nama Lengkap" /></td></tr>

<tr><td>Alamat Lengkap</td><td>: <textarea name="alamat"></textarea></td></tr>

<tr><td>Kota</td><td>: <input type="text" name="kota" /></td></tr>

(12)

<tr><td>Nomor Telp/Hp</td><td>: <input type="text" name="nomor_telp" /></td></tr>

<tr><td>Nama Barang</td><td>: <input type="text"

name="nama_barang" value="<?php echo $data['nama_kategori']; ?>&nbsp;<?php echo $data['nama_barang'];?>" /></td></tr>

<tr><td>Jumlah Barang Yang Di Order</td><td>: <input type="text" name="jumlah" /></td></tr>

<tr><td>&nbsp;</td></tr>

<tr><td align="right"><input type="submit" name="submit" value="ORDER"/></td>

<td>&nbsp;&nbsp;<input type="button" value="CANCEL" onclick=self.history.back()></td>

if($nama!="" && $alamat!='') {

$qry=mysql_query("insert into pesanan

(tanggal,nama,alamat,kota,kode_pos,nomor_telp,nama_barang,jumlah) values('$tanggalorder','$nama','$alamat','$kota','$kodepos','$nomorte lp','$namabarang','$jumlah')",$koneksi) or die (mysql_error()); ?>

<script language="javascript"> <!--

alert("Terimakasih Data Anda Telah Kami Terima") window.location="index.php?p=gallery.php";

--></script> <?php } else{

?>

<script language ="javascript"> <!--

alert("Maaf.. Data Anda gagal")

window.location="index.php?p=order.php"; --></script>

<?php }

(13)

11.Koneksi.php

$koneksi=mysql_connect($hostname,$dbuser,$dbpass) or die (mysql_error());

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

?>

12.Login.php <div class="login">

<form action="cek.php" method="post"> <table border="0">

<td width="120 px">Username</td>

<td>: <input type="text" name="username"></td> </tr>

<tr>

<td>Password</td>

<td>: <input type="password" name="password"></td> </tr>

<tr>

<td></td><td>&nbsp;&nbsp;<input type="submit" name="submit" value="Login"></td>

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

(14)

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

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

window.location = "index.php";

alert("Your name or password is wrong..") //-->

window.location = "../index.php"; alert("Silahkan Login.")

body{ margin:0px; background: url(../images/a.jpg) repeat-x;}

#wrapper{ width:960px; background: url(../images/a.jpg) repeat-x; margin: 0 auto;}

#header{ height:80px; }

#logo{ width:840px; float:left;}

#icon{ width:120px; float:left; margin-top:20px;}

#content{ border-left: 1px solid #CCCCCC;

border-right:1px solid #CCCCCC; height: auto;padding:10px; clear:both;}

(15)

#tampilan1{ width:940px; height:auto; margin-left:20px; margin-right:20px;}

#tampilan table{ float:left; border: 1px solid #999999;

background: #FFFFFF; width:160px; height:auto; margin:10px; margin-top:30px;}

#tampilan tr td{font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px; color:#0000FF;}

#tampilan2{clear:both;}

#tampilan2 tr td{text-align:center;

font-family:Verdana, Arial, Helvetica, sans-serif; color:#0000FF; font-size:12px; font-weight:bold;}

#tampilan2 p{text-align:center;}

#tampilan2 a{text-decoration:none;}

.clear{ clear:both; }

h2{text-align:center;font-family:Verdana, Arial, Helvetica, sans-serif; font-style: inherit; color:#000066; }

p{ text-align: center; font-family: Verdana, Arial, Helvetica, sans-serif; font-size:14px; font-weight:bold; }

#syarat{ margin:auto; height:auto; background:#FFFFFF; padding:10px; border:1px solid #CCCCCC; }

#syarat h3{ text-align:center; color: #000000; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:14px; }

#syarat h5{ font-family:Verdana, Arial, Helvetica, sans-serif; font-size:13px; font-weight:bold; color:#FF0000; }

#syarat p{ text-align: justify; font-family:Verdana, Arial,

Helvetica, sans-serif; font-size:13px; font-weight: 900; }

#syarat tr td{ text-align: justify; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:13px;

font-weight: 900; }

#c_1{ height:280px; margin-bottom:20px; display:block;}

#c_2{ width:480px; height:260px; margin-right:10px; float:left; padding:10px; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:14px;}

#c_2 h4{ font-size:18px; margin:0px; }

#c_2 p{ text-align:left; font-weight:normal; }

#c_2 tr td{ font-size:14px; }

#c_3{ width:395px; height:280px; padding-left:23px; float:left; }

(16)

#c_5 { width:780px; height:370px; float:left; margin-right:10px; border-right: 1px solid #CCCCCC; }

#c_5 h5{ margin-top: 0px; font-family:Verdana, Arial, Helvetica, sans-serif;}

#c_5 tr td{ text-align: justify; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px; }

#c_6{ float:left; width:136px; height:370px;

font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 12px; font-weight:bolder; color:#333333;}

.logo1{ width:136px; height:100px; float:left;}

.logo2{ width:136px; height:100px; float:left; }

#gallery{ height:auto; }

#gallery1{ height:480px;}

#gallery1 li{ list-style:none;}

#gallery1 ul li{ float:left; margin-left:40px; margin-right:40px; margin-bottom: 40px;}

#gallery1 li:hover{ background: #999999; }

.login{ border: 1px solid #999999; margin:auto; margin-top:20px; margin-bottom:20px; width: 350px; height:300px;

background: #C0C0C0; padding: 10px;

-webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; }

.login tr th{ text-align:center; color:#FFFFFF;

font-family:Verdana, Arial, Helvetica, sans-serif; font-size:large;}

.login tr td{ font-family:Verdana, Arial, Helvetica, sans-serif; font-size:13px;}

#form{ margin:auto; border: 1px solid #999999; margin-top:40px; margin-bottom:20px; height:340px; width:440px;

background: #C0C0C0; padding:10px;

-webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;}

#form tr th{ text-align: center;

font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 14px; color:#FFFFFF;}

#form tr td{ font-family:Verdana, Arial, Helvetica, sans-serif; font-size:13px;}

#menu1{ clear:both; height:40px; padding-left:258px;}

#menu{ clear:both; height:40px; padding-left:258px; background:url(../images/menu.jpg) repeat-x;}

(17)

.top_menu li{ float:left; list-style:none; }

.top_menu li a{ padding-top:8px; padding-bottom:8px; padding-right:20px; padding-left:5px; text-decoration:none; color: #222324; font:icon; font-size:16px;

font-weight:bold; display:block; }

.top_menu li a:hover{ background: url(../images/menu.png); color:#0000FF;}

.top_menu li:hover{ position:relative; }

#footer{ clear:both; height:14px;

background:url(../images/footer.jpg) repeat-x; -webkit-border-bottom-right-radius: 20px; -webkit-border-bottom-left-radius: 20px; -moz-border-radius-bottomright: 20px; -moz-border-radius-bottomleft: 20px; border-bottom-right-radius: 20px;

border-bottom-left-radius: 20px; text-align:center; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px; font-style:italic; padding:3px;}

LISTING PROGRAM PADA FILE ADMIN

1. Koneksi.php

$koneksi=mysql_connect($hostname,$dbuser,$dbpass) or die (mysql_error());

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

2. Index.php

<?php session_start();

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

?>

<script language="JavaScript">

alert ("Silahkan Login terlebih dahulu..") location.href="../index.php";

</script> <?php

} else {

(18)

<div id="content">

<?php include"menu.php"; ?>

<div id="footer">Copyright © 2013 Cantik Modis</div> </div>

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

<body>

<div id="wrapper"> <div id="header">

<div id="logo"><img src="images/logo.png"></div> <div id="icon">

<a

href="https://www.facebook.com/ButikCantikMod is"><img src="images/fb.png" /></a>

<a href="#">

<img src="images/twitter.png" /></a> </div>

</div>

4. Content.php

<div id="home"><H1>SELAMAT DATANG ADMIN..</H1></div>

5. Menu.php <div id="menu">

<ul id="top_menu">

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

<img src="images/a.png" />&nbsp;HOME</a></li> <li><a href="?p=form_barang.php">

<img src="images/b.png" >&nbsp;TAMBAH BARANG</a></li> <li><a href="?p=lihat_barang.php">

<img src="images/c.png" >&nbsp;LIHAT BARANG</a></li> <li><a href="?p=daftar_order.php">

(19)

<li><a href="?p=logout.php">

<img src="images/e.png" />&nbsp;LOGOUT</a></li> </ul>

</div>

6. Form_barang.php <div class="form">

<form method="post" action="proses_simpan_barang.php" enctype="multipart/form-data">

<tr><td>Nama Barang</td><td>: <input type="text" name="nama_barang" /></td></tr>

<tr><td width="150px">Jenis Barang</td><td>:<?php include ("koneksi.php");

$sql=mysql_query("select * from kategori"); ?>

<select name="kategori">

<?php while($data=mysql_fetch_array($sql)) { ?>

<option value="<?php echo

$data['nama_kategori'];?>"><?php echo $data['nama_kategori'];?> </option>

<?php } ?> </select></td> </tr>

<tr><td>Gambar</td><td> : <input type="file" name="gambar"></td></tr>

<tr><td>Jumlah Barang</td><td>: <input type="text" name="jumlah" /></td></tr>

<tr><td>Harga</td><td>: <input type="text" name="harga" /></td></tr>

<tr><td></td><td>&nbsp;&nbsp;<input type="submit" value="Simpan">

<input type="button" value=Batal onclick=self.history.back()></td>

(20)

7. Proses_simpan_barang.php

mysql_query("insert into barang

(nama_barang,nama_kategori,gambar,jumlah,harga) values

alert("Data Telah Disimpan")

window.location="index.php?p=lihat_barang.php"; --></script>

<?php } else { ?>

<script language ="javascript"> <!--

alert("Maaf.. Data Gagal di Simpan")

window.location="index.php?p=form_barang.php";

$sql=mysql_query("select * from barang"); ?>

<script type="text/JavaScript"> <!--

function MM_popupMsg(msg) { //v1.0 alert(msg);

}

function MM_goToURL() { //v3.0

var i, args=MM_goToURL.arguments; document.MM_returnValue = false; for (i=0; i<(args.length-1); i+=2)

eval(args[i]+".location='"+args[i+1]+"'"); }

//--> </script> <?php

//menentukan batas, cek dan posisi data $batas=10;

$halaman = $_REQUEST['halaman']; if(empty($halaman)){

(21)

$halaman = 1; } else {

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

//sesuaikan perintah SQL dengan posisi dan batas

$sql= "SELECT * FROM barang ORDER BY id_barang DESC LIMIT $posisi,$batas";

$result = mysql_query($sql); $test=mysql_num_rows($result); if ($test!=0)

{ while($data=mysql_fetch_array($result)){ ?>

<div id="tampilan1"> <div id="tampilan">

<table border="0" align="center">

<tr><?php $id= $data['id_barang']; ?><td

align="center" ><img src="images/images/<?php echo $data['gambar']; ?>" /></td></tr>

<tr><td align="center"><?php echo

$data['nama_kategori']; ?>&nbsp;<?php echo $data['nama_barang']; ?></td></tr>

<tr><td align="center">Sisa Barang: <?php echo $data['jumlah']; ?></td></tr>

<tr><td align="center">Rp.<?php echo $data['harga']; ?></td></tr>

<tr><td align="center"><acronym title="Edit Data"><img src="images/edit.png" align="middle"

onClick="MM_goToURL('parent',

'index.php?p=edit_barang.php&amp;id=<?php echo $data['id_barang']; ?>');return document.MM_returnValue" /></acronym>&nbsp;

<a href='hapus_barang.php?id=<?php echo $data['id_barang']; ?>'

onClick=\"return confirm('Apakah Anda benar-benar akan menghapus data ini?')\">

<img src="images/hapus.png" align="middle" /></a> </td>

echo"<table width='500' align='center' id='tabel_show' cellpadding='1' cellspacing='1'><tr><td></td><td>";

$sql2 = mysql_query("select * from barang"); $result=mysql_num_rows($sql2);

$jmlhalaman=ceil($result/$batas);

/* bangun Previous link */ if($halaman > 1){

$prev = ($halaman - 1); ?>

<a href="index.php?p=lihat_barang.php&amp;halaman=1"> &lt;&lt; First</a> |

(22)

<?php } else {

echo "<p>First| < Previous "; } //tampilkan link halaman 1,2,3...

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

echo "$i "; } else { ?>

<a href="index.php?p=lihat_barang.php&amp;<? echo "halaman=$i"; ?>"><? echo $i; ?></a>

<?php } }

/* bangun Next link */ if($halaman < $jmlhalaman){

$next = $halaman + 1; ?>

<a href="index.php?p=lihat_barang.php&amp;<? echo "halaman=$next"; ?>">Next&gt; |</a>

<a href="index.php?p=lihat_barang.php&amp;<? echo "halaman=$jmlhalaman"; ?>">Last </a>

<?php }

echo "</td></tr></table></div>";

}//akhir dari kondisi bahwa data tidak kosong else { echo "<p>TIDAK ADA DATA DALAM DATABASE "; }

?>

9. Edit_barang.php <?php

include ("koneksi.php"); $id=$_REQUEST['id'];

$view= mysql_query ("select * from barang where id_barang='$id'",$koneksi)or die (mysql_error());

if ($data=mysql_fetch_array ($view)){ ?>

<div class="form">

<form action="proses_edit_barang.php?id=<?php echo $id ?>" method="post">

<table>

<tr><th colspan="2">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp; &nbsp;EDIT BARANG</th></tr>

<tr><td>&nbsp;</td><td>&nbsp;</td></tr> <tr><td>&nbsp;</td><td>&nbsp;</td></tr>

<tr><td>Nama Barang</td><td>: <input type="text"

name="nama_barang" size="32" maxlength="32" value="<?php echo $data['nama_barang'];?>"/></td></tr>

<tr><td width="150px">Jenis Barang</td><td>:<?php $sql=mysql_query("select * from kategori");?>

<select name="kategori"><?php while($data=mysql_fetch_array($sql)){ ?>

<option value="<?php echo $data['nama_kategori'];?>"><?php echo

$data['nama_kategori'];?></option><?php } ?> </select></td>

(23)

<tr><td>Gambar</td><td> : <input type="file" name="gambar" value="<?php echo $data['gambar'];?>"></td></tr>

<tr><td>Jumlah Barang</td><td>: <input type="text"

name="jumlah" value="<?php echo $data['jumlah'];?>"/></td></tr> <tr><td>Harga</td><td>: <input type="text" name="harga" value="<?php echo $data['harga'];?>" /></td></tr>

<tr><td></td><td>&nbsp;&nbsp;<input type="submit" value="Simpan">

<input type="button" value=Batal onclick=self.history.back()></td>

</tr>

<tr><td>&nbsp;</td></tr>

<tr><td colspan="2" align="center"><a

href="index.php?p=lihat_barang.php">Kembali</a></td></tr>

$qry=mysql_query("update barang set nama_barang='$nama_barang', nama_kategori='$nama_kategori', gambar='$gambar',

jumlah='$jumlah',harga='$harga' where id_barang='$id'",$koneksi) or die (mysql_error());

?>

<script language="javascript"> <!--

alert('Data Telah Di Ganti')

window.location = "index.php?p=lihat_barang.php"; --></script>

11.Hapus_barang.php

<?php include("koneksi.php");

$id1=$_REQUEST['id'];

$qry= mysql_query ("delete from barang where

id_barang='$id1'",$koneksi) or die (mysql_error());

if ($qry)

header ("location:index.php?p=lihat_barang.php");

(24)

12.Daftar_order.php <div class="lihat"> <?php

include "koneksi.php";

$sql = mysql_query("select * from pesanan"); ?>

<script type="text/JavaScript"> <!--

function MM_popupMsg(msg) { //v1.0 alert(msg);

}

function MM_goToURL() { //v3.0

var i, args=MM_goToURL.arguments; document.MM_returnValue = false; for (i=0; i<(args.length-1); i+=2)

eval(args[i]+".location='"+args[i+1]+"'"); }

//--> </script> <?php

//menentukan batas, cek dan posisi data $batas=10;

$halaman = $_REQUEST['halaman'];

if(empty($halaman)){

//sesuaikan perintah SQL dengan posisi dan batas

$sql= "SELECT * FROM pesanan ORDER BY id_pesanan DESC LIMIT $posisi,$batas";

$result = mysql_query($sql); $test=mysql_num_rows($result); if ($test!=0)

{ $no=$posisi+1;

echo"<table border='0' style='text-align:center' cellpadding='5px' bordercolordark='#000000'>";

while ($data = mysql_fetch_array($result)) {

//pemberian warna berbeda pada tiap baris tampilan

(25)

$id= $data['id_pesanan'];

echo "<tr bgcolor=$warna align='center' ><td>"; echo $no;

echo "</td><td width='150px'>"; echo $data['tanggal'];

echo "</td><td width='150px'>"; echo $data['nama'];

echo "</td><td width='170px'>"; echo $data['alamat'];

echo "</td><td width='60px'>"; echo $data['kota'];

echo "</td><td width='80px'>"; echo $data['kode_pos'];

echo "</td><td width=''>"; echo $data['nomor_telp'];

echo "</td><td width='170px'>"; echo $data['nama_barang']; echo "</td><td width=''>"; echo $data['jumlah'];

echo "</td><td width='110px'>";

echo "<a href='hapus_order.php?idc=$id' onClick=\"return confirm('Apakah Anda benar-benar akan menghapus data

ini?')\"><button>Hapus</button></a>";

echo "</table><table width='500' align='left' id='tabel_show' cellpadding='1' cellspacing='1'><tr><td></td><td>";

$sql2 = mysql_query("select * from pesanan"); $result=mysql_num_rows($sql2);

$jmlhalaman=ceil($result/$batas);

/* bangun Previous link */ if($halaman > 1){

$prev = ($halaman - 1); ?>

<a href="index.php?p=daftar_order.php&amp;halaman=1"> &lt;&lt; First </a> |

<a href="index.php?p=daftar_order.php&amp;<? echo "halaman=$prev"; ?>"> &lt;&lt;Previous &nbsp;</a>

<?php } else {

echo "<p>First| < Previous "; } //tampilkan link halaman 1,2,3...

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

echo "$i "; } else { ?>

<a href="index.php?p=daftar_order.php&amp;<? echo "halaman=$i"; ?>"><? echo $i; ?></a>

<?php } }

(26)

$next = $halaman + 1; ?>

<a href="index.php?p=daftar_order.php&amp;<? echo "halaman=$next"; ?>">Next&gt; |</a>

<a href="index.php?p=daftar_order.php&amp;<? echo "halaman=$jmlhalaman"; ?>">Last >></a>

<?php }

echo "</td></tr></table>";

}//akhir dari kondisi bahwa data tidak kosong else { echo "<p>TIDAK ADA DATA DALAM DATABASE "; } ?>

</div>

13.Hapus_order.php

<?php include("koneksi.php");

$id1=$_REQUEST['idc'];

$qry= mysql_query ("delete from pesanan where

id_pesanan='$id1'",$koneksi) or die (mysql_error());

if ($qry)

header ("location:index.php?p=daftar_order.php");

?>

14.Logout.php <?php

session_start();

unset($_SESSION['pengguna']); session_destroy();

print ("<meta http-equiv=\"refresh\" content=\"0; url=../index.php\">");

(27)

58

DAFTAR PUSTAKA

Kadir, A. 1999. Konsep dan Tuntunan Praktis Basis Data. Yogyakarta: Andi

Yogyakarta.

Ramadhani, Graifhan. 2003. “Modul Pengenalan Internet”.

Elmasri, R. dan Navathe, S.B. 2004. “Fundamentals of Database Systems, Fourth

Edition”. Addison Wesley.

Kristanto, H. 1994. Konsep Dan Perancangan Database. Yogyakarta: Andi Offset.

Martin, James. 1975. “Computer Data-Base Organization”.Prentice-Hall, Inc.

Englewood Cliffs, nj, Part II Physical Organization.

Barakatullah, A. Halim. 2005. “Konsep Belajar E-commerce”.

http://www.scribd.com/doc/53139341/php .”Bab V Web Dinamis PHP”. Diakses pada tanggal 18 Maret 2013.

http://ikc.depsos.go.id/umum/anon-phpmysql.php. “Dasar Pemrograman PHP dan

MySQL”. Diakses pada tanggal 18 Maret 2013.

http://blogesupri.blogspot.com/2011/06/pengertian-komputer.html. “Artikel Komputer dan Info Teknologi” Diakses pada tanggal 18 Maret 2013.

http://www.baliorange.web.id/pengertian-ecommerce/. “Pengertian E-commerce”.

Diakses pada tanggal 18 Maret 2013.

http://blog.duniascript.com/sekilas-tentang-macromedia-dreamweaver.html “Tentang

(28)

59

http://safrilblog.wordpress.com/2012/10/15/simbol-simbol-pada-flowchart-dan-penjelasannya-softskill / . “Simbol-simbol flowchart beserta fungsinya”.

Diakses pada 8 Juni 2013.

(29)

BAB 3

ANALISIS DAN PERANCANGAN SISTEM

3.1 Analisis Sistem

Toko pakaian Cantik Modis merupakan usaha yang bergerak dibidang penjualanan

pakaian khusus wanita. Dalam melaksanakan aktivitasnya toko pakaian Cantik Modis

masih menggunakan sistem informasi yang manual, sehingga masih sering terjadi

kesalahan. Berdasarkan wawancara yang dilakukan, permintaan barang dari costumer

makin meningkat sehingga mengakibatkan pendataan barang yang masuk dan keluar

sering terjadi kesalahan khususnya seperti penggadaan barang. Dan dalam pembuatan

laporan-laporan juga masih sering terjadi kesalahan-kesalahan. Maka dari itu toko

pakaian Cantik Modis memerlukan sistem yang lebih terstruktur.

3.2 Analisa Permasalahan

Berbagai permasalah yang timbul dari sistem yang sedang berjalan adalah sebagai

(30)

28

1. Proses pengumpulan data yang dilakukan rentan terjadi kesalahan karena

belum adanya sistem yang lebih terstruktur.

2. Kesulitan dalam melakukan pengecekan barang.

3. Belum tersedianya laporan yang lebih terstruktur karena sistem yang sedang

berjalan sekarang menggunakan laporan yan manual.

3.3 Usulan dan Solusi

Dari permasalahan yang ada maka diusulkan solusi sebagai berikut:

1. Membuat fitur login admin agar semua proses pengumpulan data hanya dapat dilakukan admin agar lebih terstruktur.

2. Membuat pendataan barang seacara terstruktur.

3. Pembuatan laporan dengan format dan jenis sesuai kebutuhan.

3.4 Perancangan Sistem

Tahap perancangan sistem merupakan tahap awal dari membangun sebuah situs,

seperti membuat perencanaan, perancangan, diagram alur, tujuan, dan isi dari sebuah

situs. Setelah tahap perancangan, tahap selanjutnya yaitu membuat outline atau garis besar dari situs tersebut.

Salah satu cara yang dapat digunakan adalah dengan membuat aliran informasi

(31)

29

berisi seluruh tahapan/rangkaian kegiatan dalam suatu pekerjaan. Flowchart dapat dipergunakan untuk memperinci tahap-tahap rangkaian dan suatu proses pekerjaan.

Flowchart juga dapat dipergunakan untuk menjabarkan suatu proses pekerjaan ke dalam tahap-tahap rangkaian yang lebih spesifik untuk pemeriksaan selanjutnya.

3.4.1 Data Flow Diagram (DFD)

Data flow diagram merupakan suatu diagram yang menggunakan notasi-notasi untuk menggambarkan arus dari data sistem, dengan menggunakan pendekatan metoda

analisis sistem terstruktur (Structured System Analysis Method).

Di dalam tahap analisa, penggunaan notasi simbol lingkaran dan anak panah

untuk mewakili atau menggambarkan arus data dalam perancangan sistem sangat

membantu sekali di dalam komunikasi dengan pemakai sistem untuk memahami

sistem secara logika.

Keuntungan dari penggunaan DFD yaitu membantu para analis sistem

meringkas informasi tentang sistem, mengetahui hubungan antar sub sistem,

membantu perkembangan aplikasi secara efektif. DFD juga berfungsi sebagai alat

komunikasi yang baik antara user dan analis sistem.

Berbagai komponen dari Data Flow Diagram (DFD) yaitu entitas luar, proses, penyimpanan data, dan arus data. DFD memiliki simbol-simbol yang digunakan untuk

(32)

30

Tabel 3.1 Simbol Data Flow Diagram

De Marco and Yourdan Symbol Keterangan Gane and Sarson Symbols

Source (Kesatuan Luar)

Proses

Data Flow (Arus Data)

Data Store

(Penyimpanan Data)

3.4.1.1 Diagram Konteks

Diagram konteks adalah diagram yang terdiri dari suatu proses dan menggambarkan

ruang lingkup suatu sistem. Diagram konteks merupakan level tertinggi dari DFD

yang menggambarkan seluruh input ke sistem atau output dari sistem. DFD akan memberi gambaran tentang keseluruhan sistem. Sistem dibatasi oleh boundary (dapat

digambarkan dengan garis putus). Dalam diagram konteks hanya ada satu proses.

Tidak boleh ada store dalam diagram konteks (Ladjamudin, 2005).

Pada perancangan website e-commerce pada toko pakaian cantik modis ini

(33)

31

Gambar 3.1 Diagram Konteks

3.4.1.2 Diagram Nol/Zero (Overview Diagram)

Diagram nol adalah diagram yang menggambarkan proses dari data flow diagram. Diagram nol memberikan pandangan secara menyeluruh mengenai sistem yang

ditangani, menunjukkan tentang fungsi-fungsi utama atau proses yang ada, aliran data,

dan eksternal entity. Pada level ini sudah dimungkinkan adanya data store yang digunakan. Berikut ini adalah gambar DFD level nol yang merupakan penjabaran dari

gambar diagram konteks.

COSTUMER 1

(34)

32

3.4.1.3 Diagram Rinci (Level Diagram)

Diagram rinci adalah diagram yang menguraikan proses apa yang ada dalam diagram

nol atau diagram level diatasnya. Berikut ini adalah Gambar dari DFD level 1.

3.1 PILIHAN

ACTION

3.2 EDIT/ HAPUS

BARANG

KIRIM

D1 BARANG

PILIH

EDIT / HAPUS

HASIL

UPDATE

Gambar 3.3 Diagram Level 1

3.4.2 Entity Relationship Diagram (ERD)

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

terlibat di dalam sebuah sistem. Atribut berperan sebagai penjelas entitas dan

kerelasian menunjukkan hubungan yang terjadi antara dua entitas.

Adapun ERD dari Website E-Commerce Pada Toko Pakaian Cantik Modis

(35)

33

Gambar 3.4 ERD Pada Toko Pakaian Cantik Modis

3.4.3 Normalisasi Database

Normalisasi adalah suatu proses mendesain struktur Database sehingga sebagian besar

ambiguity bisa dihilangkan sehingga bisa menghasilkan sebuah table yang normal.

Adapun Tujuan Dari Normalisasi Adalah :

1. Untuk menghilangkan kerangkapan data/ redudansi.

2. Untuk mengurangi kompleksitas

3. Untuk mempermudah pemodifikasian data

(36)

34

Adapun normalisasi yang dibuat pada sistem ini adalah sebagai berikut:

1. Bentuk Normal Pertama (1NF)

Gambar 3.5 Bentuk Normal Pertama (1NF)

2. Bentuk Normal Kedua (2NF)

Gambar 3.6 Bentuk Normal Kedua (2NF)

Dalam sistem ini, sebenarnya pada bentuk 2NF sudah memenuhi kriteria sebagai tabel

relasional yang dapat diimplementasikan pada RDBMS, sehingga tidak harus dalam

(37)

35

3.4.4 Perancangan Struktur Database

Database dapat diartikan sebagai sebuah tempat menyimpan data yang terstruktur agar

dapat diakses dengan cepat dan mudah. Membangun sebuah database merupakan

langkah awal pembuatan aplikasi, termasuk dalam penambahan produk dan lain-lain

dalam mengolah penjualan pada Toko Pakaian Cantik Modis.

Berikut ini adalah tabel-tabel yang terdapat pada database perancangan

website e-commerce pada Toko Pakaian Cantik Modis:

Tabel 3.2 Tabel User

NAMA FIELD

TIPE DATA

DESKRIPSI

Id_user Integer(2) Auto increment, primary key

username Varchar(50) Nama pengguna

password Varchar(50) Kata sandi

status Varchar(10) Status pengguna

Tabel 3.3 Tabel Barang

NAMA FIELD

TIPE DATA

DESKRIPSI

Id_barang Integer(4) Auto increment, primary key

Nama_barang Varchar(50) Nama barang

Kategori_barang Varchar(20) Kategori barang

Gambar Varchar(50) Gambar barang

Jumlah Integer(3) Jumlah barang

(38)

36

Tabel 3.4 Tabel Kategori

NAMA FIELD

TIPE DATA

DESKRIPSI

Nama_kategori Varchar(20) Nama kategori

Tabel 3.5 Tabel Pesanan

NAMA FIELD

TIPE DATA

DESKRIPSI

Id_pesanan Integer(3) Auto increment, primary key

Tanggal date Tanggal pemesanan

Nama Varchar(30) Nama pemesan

Alamat text Alamat pemesan

Kota Varchar(30) Kota pemesan

Kode_pos Integer(5) Kode pos pemesan

Nomor_telp Varchar(13) Nomor telepon/hp pemesan

Nama_barang Varchar(50) Nama barang yang di pesan

(39)

37

3.4.5 Flowchart Website

Berikut adalah flowchart pada perancangan website e-commerce toko pakaian Cantik

Modis:

(40)

38

(41)

39

(42)

40

3.4.6 Perancangan Tampilan Halaman Website

a. Rancangan Tampilan Halaman Home

Gambar 3.10 Rancangan Tampilan Home

b. Rancangan Tampilan Menu Cara Order

(43)

41

c. Rancangan Tampilan Menu Gallery

Gambar 3.12 Rancangan Tampilan Menu Gallery

d. Rancangan Tampilan Menu About Us

(44)

42

e. Rancangan Tampilan Menu Contact

Gambar 3.14 Rancangan Tampilan Menu Contact

f. Rancangan Tampilan Menu Login Admin

(45)

43

g. Rancangan Tampilan Menu Kategori Barang

(46)

BAB 4

IMPLEMENTASI SISTEM

4.1 Pengertian Implementasi Sistem

Implementasi sistem adalah rangkaian prosedur yang dilakukan dalam menyelesaikan

desain sistem yang telah disetujui, menguji, dan memulai sistem baru atau sistem yang

telah diperbaiki.

Adapun langkah-langkah yang dibutuhkan dalam implementasi sistem adalah:

a. Mendapatkan software dan hardware yang tepat serta sesuai untuk

merancang suatu sistem informasi.

b. Menyelesaikan rancangan sistem.

c. Menulis, menguji, mengontrol, dan mendokumentasikan website.

(47)

45

4.2 Tujuan Implementasi Sistem

Adapun tujuan dari implementasi sistem adalah:

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

disetujui sebelumnya.

2. Memastikan bahwa pengunjung dapat mengoperasikan sistem baru dengan mudah.

3. Memperhitungkan bahwa sistem telah memenuhi permintaan pemakai yaitu dengan

menguji sistem secara menyeluruh.

4. Memastikan bahwa sistem telah berjalan baik dan benar.

4.3 Komponen Utama Dalam Implementasi Sistem

Untuk mewujudkan sistem yang telah dirancang memerlukan sarana pendukung, yaitu

berupa komponen-komponen yang sangat berperan dalam mendukung penerapan

sistem yang dirancang terhadap pengolahan data. Di antaranya yaitu: hardware

(perangkat keras), software (perangkat lunak), dan brainware (sumber daya manusia)

4.3.1 Perangkat keras (Hardware)

(48)

46

4.3.2 Perangkat lunak (Software)

Software merupakan kumpulan dari beberapa perintah yang diekseskusi oleh mesin komputer dalam menjalankan pekerjaannya. Perangkat lunak ini merupakan catatan

bagi mesin komputer untuk menyimpan perintah, maupun dokumen serta arsip

lainnya.

Ada beberapa software yang perlu diinstal dalam membuat website, antara lain:

1. Sistem Operasi Windows 7

2. Photoshop CS5 sebagai media perancanaan desain.

3. MySQL sebagai bahasa pemrograman untuk database dalam bahasa SQL.

4. Macromedia Dreamweaver 8 sebagai salah satu editor script dalam mendesain web.

5. PHP sebagai bahasa pemrograman server side.

6. Web Server sebagai server lokal dalam pengetesan halaman web.

7. Browser sebagai tempat media tampilan halaman website, seperti : Mozilla

Firefox

4.3.3 Sumber daya manusia (Brainware)

Sistem komputerisasi yang berfungsi sebagai alat bantu manusia di bidang pengolahan

data membutuhkan manusia sebagai aspek yang menangani proyek pada komputer.

Inilah yang disebut dengan aspek brainware. Brainware terdiri atas:

1. Sistem analis, yaitu orang yang membentuk dan membangun fasilitas rancangan

(49)

47

2. Programmer, yaitu orang yang bertugas untuk membuat dan membangun program dengan menggunakan salah satu fasilitas software yang telah ditentukan.

3. Operator, yaitu orang yang menangani langsung dalam pengolahan data, mulai

dari mempersiapkan data sampai pemasukan data dalam komputer.

4.4 Tampilan Website

4.4.1 Tampilan Halaman Awal

Gambar 4.1 Tampilan Halaman Awal

Pada halaman awal ini terdiri dari header, menu atas, content, menu bawah, dan footer. Di bagia menu atas terdapat pilihan menu seperti: Home, Cara Order, dan

(50)

foto-48

foto produk dari Canti Modis yang ditawarkan. Sedangkan di bagian menu bawah

terdapat pilihan menu seperti: About Us, Contact, dan Login.

4.4.2 Tampilan Menu Cara Order

Gambar 4.2 Tampilan Menu Cara Order

Pada tampilan menu cara order ini dijelaskan bagaimana tata cara untuk pemesana barang di toko pakaian Canti Modis ini agar tidak terjadi kesalahan dalam

(51)

49

4.4.3 Tampilan Menu About Us

Gambar 4.3 Tampilan Menu About Us

Di tampilan menu abous us ini berisi tentang Cantik Modis, dan terdapat foto

beserta artikel-artikel tentang produk yang ditawarkan oleh toko pakaian Cantik

Modis, dan juga terdapat logo dari jasa pembayaran dan pengiriman yang bekerja

(52)

50

4.4.4 Tampilan Menu Contact

Gambar 4.4 Tampilan Menu Contact

Pada tampilan di menu contact ini sama seperti pada menu about us kecuali

pada menu contact ini berisi tentang info kontak atau informasi tentang toko pakaian Cantik Modis.

4.4.5 Tampilan Menu Gallery

(53)

51

Pada menu gallery ini terdapat pilihan menu lagi di dalamnya. Menu yang ditawarkan adalah nama-nama produk yang ditawarkan oleh toko pakaian Cantik

Modis seperti Blus, Celana, Gamis, Jilbab, Rok, dan Stelan.

4.4.6 Tampilan Produk (Blus, Celana, Gamis, Jilbab, Rok, Stelan)

Gambar 4.6 Tampilan Produk

Di tampilan produk ini berisi foto-foto, nama barang, harga, dan tombol “Beli”

dari produk yang dipilih dari menu gallery sebelumnya. Di tampilan produk ini juga terdapat pilihan halaman. Jika tombol “Beli” di tekan maka akan muncul form order

(54)

52

4.4.7 Tampilan Form Order

Gambar 4.7 Tampilan Form Order

Di tampilan form order ini terdapat form-form yang harus di isi secara lengkap kecuali nama barang yang telah terisi secara otomatis. Setelah form terisi secara lengkap pilih tombol “Order” jika ingin memesan barang, dan jika tidak ingin

memesan pilih tombol “Cancel” .

4.4.8 Tampilan Login Admin

(55)

53

Di tampilan login admin ini terdapat form yang berisi username dan password

untuk masuk sebagai admin.

4.4.9 Tampilan Tambah Barang

Gambar 4.9 Tampilan Tambah Barang

Pada tampilan ini terdapat menu baru seperti: menu Home admin, Tambah Barang, Lihat Barang, Daftar Order, serta Logout. Di tampilan tambah barang ini

(56)

54

4.4.10 Tampilan Lihat Barang

Gambar 4.10 Tampilan Lihat Barang

Pada menu lihat barang ini berisi barang yang telah di masukkan sebelumnya.

Dan pada item barang tesebut terdapat foto, harga, sisa barang, harga serta tombol edit

untuk mengedit barang dan tombol hapus untuk menghapus barang tersebut.

4.4.11 Tampilan Daftar Order

(57)

55

Di tampilan menu daftar order ini menampilkan biodata lengkap dan barang

(58)

BAB 5

KESIMPULAN DAN SARAN

5.1 Kesimpulan

Adapun kesimpulan yang dapat diambil oleh penulis dalam pembuatan website

e-commerce ini adalah:

1. Dengan adanya Sistem Informasi Penjualan berbasis web ini, penjual dapat

memperluas pemasaran produk secara cepat yang dapat meningkatkan

jumlah keuntungan bagi usahanya tersebut.

2. Sistem Informasi penjualan ini menyediakan layanan pemesanan produk

melalui sistem online, hanya dengan mengisi form pemesanan, dan

melakukan pembayaran ke nomor rekening yang telah diberitahu, maka

produk akan langsung dikirim ke alamat konsumen. Hal ini tentu akan

mempermudah pelanggan yang berada jauh dari tempat penjualan, ataupun

(59)

57

5.2 Saran

Dengan selesainya websitee-commerce Pada Toko Pakaian Cantik Modis ini, penulis

memberikan beberapa saran yang dapat mendukung pengembangan sistem lebih

lanjut:

1. Dapat melakukan perbaikan dan penyempurnaan terhadap sistem ini agar

menjadi lebih sempurna bila akan diterapkan pada sistem yang lama,

sehingga saling terintegrasi.

2. Sistem yang telah dibuat ini masih memerlukan perbaikan karena masih

memiliki kelemahan-kelemahan dalam memenuhi kebutuhan yang

(60)

BAB 2

LANDASAN TEORI

2.1 Pengertian Komputer

Dalam merancang suatu aplikasi ataupun sistem diperlukan sebuah alat bantu, seperti

komputer. Komputer adalah sekumpulan alat elektronik yang saling bekerja sama,

dapat menerima data (input), mengolah data (proses) dan menghasilkan informasi (output) serta terkoordinasi di bawah kontrol program yang tersimpan di dalam

memorinya. (http://blogesupri.blogspot.com/2011/06/pengertian-komputer.html)

Kata komputer berasal dari bahasa Latin yaitu Computare yang artinya menghitung. Dalam bahasa Inggris disebut to compute. Menurut buku “Computer Today” (Donald H.Sanders), komputer adalah sistem elektronik untuk memanipulasi

data yang cepat dan tepat serta dirancang dan diorganisasikan supaya secara otomatis

menerima dan menyimpan data input, memprosesnya dan menghasilkan output di

bawah pengawasan suatu langkah-langkah instruksi-instruksi program yang tersimpan

(61)

8

2.2 Pengenalan Internet

Internet (Interconnection-Network) adalah sebutan untuk sekumpulan jaringan komputer yang menghubungkan situs akademik, pemerintahan, komersil, organisasi,

maupun perorangan. Internet menyediakan akses untuk layanan telekomunikasi dan

sumber daya informas untuk jutaan bahkan milyaran pemakainya yang tersebar di

seluruh dunia. Layanan internet meliputi komunikasi langsung (email-chat), diskusi (Usenet News, e-mail, milis), sumber daya informasi yang terdistribusi (World Wide

Web, Gopher), remote login dan lalu lintas file (Telnet, FTP), dan aneka layanan yang lainnya. (Ramadhani, 2003).

Internet dapat juga diartikan sebagai suatu jaringan komputer luas yang berada di seluruh dunia dan berfungsi untuk menghubungkan jaringan komputer lain, di mana

pengguna akhir layanan internet memungkinkan untuk melakukan pertukaran data dan informasi melalui arsip situs World Wide Web.

World Wide Web adalah sekelompok dokumen multimedia yang saling terkoneksi menggunakan hypertext link. Dan dengan mengklik pada suatu link, anda

dapat berpindah dari suatu dokumen ke dokumen lainnya. Ada dua hal penting yang

harus diketahui bila belajar dengan WWW yaitu software web browser dan software

web server. Di mana software web browser ini bertindak sebagai client yang memungkinkan anda untuk melihat dan mendapatkan informasi dari server web, sedangkan software web server bertindak sebagai server yang

(62)

9

2.3 Pengertian E-commerce

E-commerce atau bisa disebut Perdagangan elektronik atau e-dagang adalah penyebaran, pembelian, penjualan, pemasaran barang dan jasa melalui sistem

elektronik seperti internet atau televisi, www, atau jaringan komputer lainnya.

Ecommerce dapat melibatkan transfer dana elektronik, pertukaran data elektronik, sistem manajemen inventori otomatis, dan sistem pengumpulan data otomatis.

Industri teknologi informasi melihat kegiatan e-dagang ini sebagai aplikasi dan

penerapan dari e-bisnis (e-business) yang berkaitan dengan transaksi komersial, seperti: transfer dana secara elektronik, SCM (supply chain management), e

-pemasaran (e-marketing), atau pemasaran online (online marketing), pemrosesan transaksi online (online transaction processing), pertukaran data elektronik (electronic

data interchange/EDI), dll.

E-dagang atau e-commerce merupakan bagian dari e-business, di mana cakupan e-business lebih luas, tidak hanya sekedar perniagaan tetapi mencakup juga

penggabungan mitra bisnis, pelayanan nasabah, lowongan pekerjaan, dan yang

lainnya. Selain teknologi jaringan www, e-dagang juga memerlukan teknologi basis data atau pangkalan data (database), e-surat atau surat elektronik (e-mail), dan bentuk

teknologi non-komputer yang lain seperti halnya sistem pengiriman barang, dan alat pembayaran untuk e-dagang ini.

E-commerce pertama kali diperkenalkan pada tahun 1994 pada saat pertama kali banner-elektronik dipakai untuk tujuan promosi dan periklanan di suatu halaman

(63)

10

penjualan seharga AS$12,2 milyar pada 2003. Menurut laporan yang lain pada bulan

oktober 2006 yang lalu, pendapatan ritel online yang bersifat non-travel di Amerika Serikat diramalkan akan mencapai seperempat trilyun dolar US pada tahun 2011.

(http://www.baliorange.web.id/pengertian-ecommerce)

Keuntungan e-commerce bagi bisnis perusahaan-perusahaan dapat menjangkau pelanggan di seluruh dunia. Oleh karena itu dengan memperluas bisnis mereka, sama

saja dengan meningkatkan keuntungan. E-commerce menawarkan pengurangan

sejumlah biaya tambahan.

Sebuah perusahaan yang melakukan bisnis di internet akan mengurangi biaya tambahan karena biaya tersebut tidak digunakan untuk gedung dan pelayanan

pelanggan (customer service), jika dibandingkan dengan jenis bisnis tradisional.

Secara ringkas keuntungan e-commerce tersebut adalah sebagai berikut:

1. Bagi Konsumen : harga jauh lebih murah, belanja cukup pada satu tempat.

2. Bagi Pengelola Bisnis : efisiensi, tanpa kesalahan, tepat waktu.

3. Bagi Manajemen : peningkatan pendapatan, loyalitas pelanggan.

Adapun beberapa aspek penting dalam membuka toko online adalah:

1. Menyiapkan fasilitas toko online memang tidak semudah membuat homepage.

(64)

11

menyiapkan content, desain web hosting-nya. Selain tampilan visual dan

content-nya harus bagus, struktur homepage yang dibuat pun harus jelas.

2. Langkah berikutnya, menyiapkan interaktivitas toko online tersebut. Paling

sederhana, bisa menggunakan fasilitas e-mail di website-nya. Agar interaktivitas antara merchant dan pengakses berjalan lancar, maka para

penjual online ini menyiapkan homepage-nya dengan formulir-formulir standar dan terstruktur, yang bisa dijawab dengan software tertentu. Sejauh ini

homepage-homepage di Indonesia belum menyediakan interaktivitas untuk kebutuhan verifikasi dan pembayaran.

3. Menurut Julizvar, konsulan dari Hewlett Packard (HP) Indonesia, untuk

terciptnya sistem pembayaran via internet memang dibutuhkan kesepakatan berbagai pihak, terutama dari pihak lembaga keuangan, merchant dan

konsumen. Pihak-pihak lainnya yang biasanya terlibat untuk mendukung

sistem pembayaran internet adalah penyedia sertifikat digital, baik untuk Visa

(misalnya VeriSign) maupun MasterCard (misalnya GTE); dan perusahaan

pemroses tansaksi kartu kredit.

4. Adapun soal pengiriman barang, merchant biasanya bekerjasama dengan

perusahaan jasa kurir seperti UPS, FedEx, JNE, Tiki, dan PT. Pos. Bahkan

untuk kebutuhan ekspor sekalipun. Hanya saja, kalau memiliki layanan yang

diberikan mall online di Indonesia, sejauh ini pengelola tidak ikut campur

Gambar

Tabel 3.1 Simbol Data Flow Diagram
gambar diagram konteks.
Gambar 3.3 Diagram Level 1
Gambar 3.4  ERD Pada Toko Pakaian Cantik Modis
+7

Referensi

Dokumen terkait

Keuntungan (kerugian) yang belum direalisasi akibat kenaikan (penurunan) harga pasar efek hutang dan saham yang tersedia untuk dijual tidak diakui dalam laporan laba rugi tahun

Hal ini mengidentifikasikan bahwa penelitian ini membuktikan dampak positif dari kepuasan konsumen terhadap WOM secara positif dan signifikan dimoderasi oleh keterlibatan

[r]

bahwa berdasarkan pertimbangan sebagaimana dimaksud huruf a, perlu menetapkan Keputusan Bupati Bantul tentang Pembentukan Tim Pengarah dan Tim Teknis Pelaksanaan Rehabilitasi

[r]

Keputusan Bupati Bantul Nomor 43A Tahun 2008 tentang Perubahan Keputusan Bupati Bantul Nomor 14 Tahun 2008 tentang Pembentukan Panitia Seleksi Calon Kepala Bagian di Desa

[r]

Berdasarkan hasil pengamatan, wawancara dan angket yang diberikan kepada mahasiswa banyak faktor yang mempengaruhi kesulitan belajar mahasiswa pada mata kuliah konsep