Sistem Penjualan Online Store Berbasis Web
SISTEM PENJUALAN ONLINE STORE
BERBASIS WEB
TUGAS AKHIR
INDAH PERMATA SARI
092406017
PROGRAM STUDI D-III TEKNIK INFORMATIKA
DEPARTEMEN MATEMATIKA
FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM
UNIVERSITAS SUMATERA UTARA
MEDAN
2012
(2)
SISTEM PENJUALAN ONLINE STORE
BERBASIS WEB
TUGAS AKHIR
Diajukan untuk melengkapi tugas dan memenuhi syarat memperoleh Ahli Madya
INDAH PERMATA SARI
092406017
PROGRAM STUDI D-III TEKNIK INFORMATIKA
DEPARTEMEN MATEMATIKA
FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM
UNIVERSITAS SUMATERA UTARA
MEDAN
2012
(3)
PERSETUJUAN
Judul : SISTEM PENJUALAN ONLINE STORE
BERBASIS WEB
Kategori : TUGAS AKHIR
Nama : INDAH PERMATA SARI
Nomor Induk Mahasiswa
: 092406017
Program Studi
: DIPLOMA (D-III) TEKNIK INFORMATIKA
Departemen
: MATEMATIKA
Fakultas
: MATEMATIKA DAN ILMU PENGETAHUAN
ALAM (FMIPA) UNIVERSITAS SUMATERA
UTARA
Diluluskan di
Medan, juli 2012
Komisi Pembimbing
:
Diketahui/Disetujui oleh
Pembimbing,
Departemen Matematika FMIPA USU
Ketua,
Prof. Drs. Tulus Vordipl. Math., M.Si., Ph.D
Syahril Efendi, S.Si, M.IT
Nip. 19620901 198803 1 002
Nip. 197711101996021001
(4)
PERNYATAAN
SISTEM PENJUALAN ONLINE STORE
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 2012
INDAH PERMATA SARI
092406017
(5)
PENGHARGAAN
Puji syukur penulis panjatkan kepada Allah SWT atas limpahan rahmat dan
hidayah-Nya sehingga kajian tugas akhir ini dapat diselesaikan dengan baik dan dalam waktu
yang telah ditetapkan.
Penyusunan tugas akhir ini masih banyak memiliki kekurangan karena keterbatasan
kemampuan dan pengetahuan penulis, sehingga diharapkan kritik dan saran yang
membangun serta dapat memberikan inspirasi yang baik untuk kemajuan tugas akhir
ini. Penulis berharap semoga Tugas Akhir ini bermanfaat bagi siapapun yang
membacanya.
Selama mempersiapkan tugas akhir ini penulis banyak mendapat bantuan,
dorongan, dan motivasi baik secara langsung maupun tidak langsug, maka pada
kesempatan ini penulis juga menyampaikan terima kasih kepada :
1.
Bapak Syahril Efendi, S.Si, M.IT, selaku Dosen pembimbing pada penyelesaian
tugas akhir ini yang telah memberikan panduan dan penuh kepercayaan kepada
penulis untuk menyelesaikan kajian tugas akhir ini.
2.
Bapak Syahril Efendi, S.Si, MIT dan Syahriol Sitorus S.Si, MIT selaku ketua dan
sekretaris program studi D-III Teknik Informatika di Universitas Sumatera Utara.
3.
Prof.Drs. Tulus Vordipl. Math., M.Si., Ph.D, selaku ketua Departemen
Matematika di Universitas Sumatera Utara.
4.
Bapak Dr. Sutarman, M.Sc, selaku Dekan Fakultas Matematika dan Ilmu
Pengetahuan Alam di Universitas Sumatera Utara.
5.
Para Staf/Pengajar Jurusan D-3 Teknik Informatika FMIPA USU.
6.
Kedua orang tua saya Bpk.Edy Hariandy SH, Ibu Farida Nasution terimakasih
atas do’a serta dukungan moril maupun materil. Dan seluruh keluarga besar saya.
7.
Adik-Adik saya Cindy Anugrah Dan Fara Sheila terimakasih atas dukungannya.
8.
Yang terkasih Putra Al-gofarie terimakasih atas dukungan dan dorongan
semangatnya selama ini.
9.
Om saya Novrizal lubis yang memberi materi pengajaran selama pembuatan tugas
akhir ini.
10.
Seluruh rekan-rekan dari D-III Teknik Informatika FMIPA USU, khususnya
teman-teman Kom B 2009, terimakasih atas saran dan kritik dalam penyusunan
tugas akhir ini.
(6)
ABSTRAK
Pada penulisan tugas akhir ini, penulis membuat Sistem Penjualan Online Store
Berbasis Web. Sistem ini merupakan penjualan cake’s secara Online dengan
mengguna CMS Wordpress yang merupakan gabungan dari Web Server, PHP dan
MySQL. Pembuatan sistem penjualan online store ini bertujuan untuk mempermudah
masyarakat dalam memperoleh informasi perbelanjaan (Online) sehingga menghemat
waktu. Fasilitas-fasilitas yang terdapat dalam pembuatan website ini berupa data dan
informasi terbaru, profil dan bermacam-macam variasi cake yang tersedia .Layout dan
header yang bagus dan menarik sehingga dapat menambah daya tarik tersendiri.
(7)
DAFTAR ISI
Halaman
Persetujuan
ii
Pernyataan
iii
Penghargaan
iv
Abstrak
v
Daftar Isi
viii
Daftar Tabel
ix
Daftar Gambar
x
BAB 1 PENDAHULUAN
1
1.1 Latar Belakang Masalah
1
1.2 Identifikasi Masalah
3
1.3 Batasan Masalah
3
1.4 Rumusan Masalah
3
1.5 Tujuan
4
1.6 Manfaat
4
1.7 Sistematika Penulisan
5
BAB 2 LANDASAN TEORI
6
2.1 Sekilas Tentang e-commerce
6
2.2 Sekilas Tentang komputer
6
2.3 Sekilas Tentang internet
7
2.4 Sekilas Tentang perancangan
7
2.5 Sekilas Tentang sistem
8
2.6 Sekilas Tentang informasi
8
2.7 Sekilas Tentang PHP dan MYSQL
9
2.8 Sekilas Tentang HTML
11
2.8.1 Struktur HTML
11
2.9 Sekilas Tentang CSS
12
2.10 JavaScript
12
2.11 Sekilas Tentang Domain
13
2.12 Sekilas Tentang Hosting dan Software Website
15
2.13 Data Flow Diagram (DFD)
16
2.13 Flow-Chart
17
BAB 3 PERANCANGAN SISTEM
20
3.1 Perancangan Dan Perancangan
20
3.2 Perancangan Halaman Website
22
3.2.1 Halaman Home
22
3.2.2 Cara Pembelian
23
3.2.3 Pengiriman
23
(8)
3.4 Perancangan Alir (flowchart) website
26
3.4.1 Flowchart Home
26
3.4.2 Flowchart Cara Pembelian
28
3.4.3 Flowchart Produk
29
3.4.4 Flowchart Admin
30
3.5 Merancang Database Server
31
3.6 Desain Website
35
3.6.1 Desain Home
35
3.6.2 Desain Cara Pembelian
36
3.6.3 Desain Pengiriman
36
3.6.4 Desain Halaman Product
37
3.6.5 Desain Halaman Birthday cake
37
3.6.6 Desain Halaman Cake
38
3.6.7 Desain Halaman Wedding Cake
38
3.6.8 Desain Halaman Cookies
39
3.6.9 Desain Halaman Cupcake
39
3.6.10 Desain Halaman Puding
40
3.6.11 Desain Halaman Tentang Kami
40
3.6.12 Desain Halaman Login Admin
41
3.6.13 Desain Halaman Admin
41
BAB 4 IMPLEMENTASI SISTEM
42
4.1 Pengertian Implementasi Sistem
42
4.2 Tujuan Implementasi Sistem
42
4.3 Komponen Dalam Implementasi Sistem
43
BAB 5 KESIMPULAN DAN SARAN
45
5.1 Kesimpulan
45
5.2 Saran
46
Daftar Pustaka
47
Lampiran:
Listing Program
(9)
DAFTAR TABEL
Halaman
Tabel 2.1 Simbol-Simbol DFD
16
Tabel 2.2 Flow Chart
18
Tabel 3.1 Tabel Commentmeta
31
Tabel 3.2 Tabel Comment
31
Tabel 3.3 Tabel Links
32
Tabel 3.4 Tabel Option
32
Tabel 3.5 Tabel Postmeta
32
Tabel 3.6 Tabel Post
33
Tabel 3.7 Tabel Terms
34
Tabel 3.8 Tabel User meta
34
(10)
DAFTAR GAMBAR
Halaman
Gambar 2.1 Tampilan Awal Lembar Kerja Microsoft Visual Basic 6.0
9
Gambar 2.2 Tampilan Menu Bar
9
Gambar 2.3 Tampilan Toolbar
9
Gambar 2.4 Tampilan ToolBox Standard
12
Gambar 2.5 Tampilan Form Window
15
Gambar 2.6 Tampilan Jendela Project
15
Gambar 2.7 Tampilan Jendela Properties
16
Gambar 2.8 Tampilan Jendela Form Layout
16
Gambar 2.9 Tampilan Window Code
17
Gambar 3.1 Tampilan Form Menu Utama
24
Gambar 3.2 Tampilan Form Menu English – Indonesian
25
Gambar 3.3 Tampilan Form Menu Indonesian – English
26
Gambar 3.4 Tampilan Form Data Processing Dictionary
27
Gambar 3.5 Tampilan Form About Me
28
Gambar 3.6 Flow Chart Halaman Menu Utama
29
Gambar 3.7 Flow Chart Halaman English – Indonesian
30
Gambar 3.8 Flow Chart Halaman Indonesian – English
31
Gambar 3.9 Flow Chart Halaman Data Processing
32
Gambar 4.1 Tampilan Menu Utama
33
Gambar 4.2 Tampilan Menu English – Indonesian
34
Gambar 4.3 Tampilan Menu Indonesian – English
35
Gambar 4.4 Tampilan Data Processing
36
(11)
ABSTRAK
Pada penulisan tugas akhir ini, penulis membuat Sistem Penjualan Online Store
Berbasis Web. Sistem ini merupakan penjualan cake’s secara Online dengan
mengguna CMS Wordpress yang merupakan gabungan dari Web Server, PHP dan
MySQL. Pembuatan sistem penjualan online store ini bertujuan untuk mempermudah
masyarakat dalam memperoleh informasi perbelanjaan (Online) sehingga menghemat
waktu. Fasilitas-fasilitas yang terdapat dalam pembuatan website ini berupa data dan
informasi terbaru, profil dan bermacam-macam variasi cake yang tersedia .Layout dan
header yang bagus dan menarik sehingga dapat menambah daya tarik tersendiri.
(12)
BAB 1
PENDAHULUAN
1.1
Latar Belakang Masalah
Teknologi informasi pada saat ini telah berkembang sangat pesat sehingga mempunyai
dampak dalam meningkatkan efektifitas dan keefisienan dalam melakukan setiap
pekerjaan. Mungkin suatu kenaifan kalau berbicara tentang teknologi informasi dan
komunikasi, tanpa membicarakan suatu benda yang bernama komputer. Komputer
merupakan suatu media elektronik yang memegang peranan yang sangat penting
dalam perkembangan yang terjadi saat ini.
Pada saat ini teknologi informasi mengalami perkembangan yang sangat cepat,
seiring dengan kebutuhan manusia yang juga terus bertambah. Teknologi memegang
peranan yang sangat penting bagi kehidupan manusia. Saat ini, siapa saja yang tidak
bisa mengikuti perkembangan teknologi, maka dapat dipastikan akan menjadi orang
terbelakang.
Jaman memang telah berubah begitu pula kita harus dapat mengikuti
perkembangannya. Teknologi internet merupakan salah satu bidang yang mengalami
perkembangan sangat cepat. Telah banyak sektor yang menerapkan teknologi ini,
(13)
salah satunya dalam bidang perdagangan. Lalu muncul perdagangan dengan internet
sebagai sarana utama, yaitu e-commerce.
Implementasi e-commerce dalam dunia bisnis salah satunya adalah dengan
banyak bermunculan situs-situs penjualan secara online atau berbasis web. Hal ini
membawa kita dalam budaya baru dalam melakukan transaksi yang tidak lagi
konvensional, melainkan membawa kita kepada transaksi dunia maya. Disadari atau
tidak penerapan e-commerce ini telah berdampak pada efisiensi dan efektifitas
transaksi, serta dapat mengangkat produk atau citra dari perusahaan yang menerapkan
konsep tersebut.
Sejak munculnya teknologi komputer, proses pengiriman, penyampaian, serta
penerimaan informasi itu sendiri menjadi lebih cepat dan efektif. Seiring
berkembangnya teknologi komputer, maka penggunaan komputer dilihat akan lebih
baik dari segi penggunaan, kemudahan, dan keakuratan data yang digunakan.
PHP (Hypertext Preprocessor) merupakan bahasa pemrograman yang bersifat
server side script, yaitu bahasa yang berbentuk script yang terletak dan dieksekusi di
server untuk kemudian hasilnya (berupa kode HTML) dikembalikan ke browser
pengguna/user/client. PHP dirancang untuk membentuk suatu web yang bersifat
dinamis, yang artinya halaman yang ditampilkan dibuat saat halaman itu diminta oleh
pengguna/user/client. PHP juga dapat berinteraksi dengan hampir semua teknologi
web yang telah ada dan sifatnya open source (bebas pakai) sehingga memberikan
(14)
Selain itu demi mendukung berkembangnya aplikasi web yang semakin besar,
rumit, dan kompleks maka di kembangkanlah kemampuan objek orientid
programming dari PHP. Keuntungan yang dapat diperoleh dari kemampuan object
oriented programming dari PHP, yaitu kemudahan untuk mengolah kompleksitas yang
dibuat serta kemudahan untuk melakukan perubahan dan pengembangan dari aplikasi
tersebut.
1.2
Identifikasi Masalah
Adanya toko kue online ini agar mempermudah konsumen untuk memesan kue secara
bervariasi dan sesuai dengan mereka inginkan, membeli cemilan sehat yang tidak
berdampak buruk bagi kesehatan keluarga. Kendalanya kadang keterlambatan kiriman
dan ini sebagai toko kue online yg tidak mau merugikan konsumen harus mengecek
ulang pengiriman. Aplikasi ini dapat juga mempermudah dalam mencari pelanggan
dengan menggunakan tampilan yg menarik .
1.3 Batasan Masalah
Dalam hal ini penulis membatasi permasalahan kurang tepatnya tanggal sampai
pemesanan barang kepada konsumen, sehingga merupakan kendala yang selalu di
hadapi. Untuk itu perlunya pengecekan pengiriman barang kepada konsumen agar
konsumen benar-benar merasa puas dengan sistem pembelian secara online.
(15)
1.4 Rumusan Masalah
Dalam dunia bisnis memang memiliki tingkat persaingan yang kompetitif, persaingan
bisnis antar pelaku pasar dalam menarik perhatian masyarakat untuk menjadi
pelanggannya dilakukan dengan berbagai cara. Untuk memperjelas permasalahan
yang akan dibahas dalam tugas akhir ini, maka penulis memberikan rumusan masalah.
Adapun rumusan masalah dalam penulisan Tugas Akhir ini adalah:
1.
Pembeli dapat melakukan transaksi dari mana pun dan kapan pun hanya
dengan menggunakan sebuah komputer yang telah memiliki akses internet.
Permasalahannya sekarang adalah bagaimana pelanggan dapat melakukan
transaksi secara online.
2.
menggunakan teknologi internet, pembeli atau pelanggan dapat menikmati
layanan ini dan akan mendapatkan informasi dengan cepat dan akurat
karena data yang diakses melalui jaringan internet.
1.5 Tujuan
Tujuan pembuatan program ini adalah untuk menerapkan program aplikasi yang
berbasiskan
web dalam bidang bisnis sebagai sarana untuk efisiensi dan penerapan
teknologi informasi dalam dunia perdagangan.
1.6
Manfaat
(16)
nantinya, beberapa manfaat yang saya dapatkan adalah antara lain:
1.
memberi kemudahan terhadap teransaksi penjulan.
2.
Memberikan alternatif lain cara berbisnis secara tepat.
3.
Dapat meningkatkan kemampuan managerial yang baik dan benar .
1.7
Sistematika Penulisan
Maksud dan tujuan dari pembuatan sistematika penulisan tugas akhir ini adalah untuk
mempermudah penulis dalam membuat dan menyelesaikan permasalahan yang
dianalisis oleh penulis sehingga lebih terarah dan lebih terfokus serta diuraikan bab
per-bab. Sistematika penulisan laporan ini adalah :
BAB 1 : Mengenai latar belakang pembuatan tugas akhir ini, identifikasi, batasan
dan rumusan masalah, tujuan, serta manfaat dari tugas akhir ini.
BAB 2 : Pada bab ini menjelskan landasan teori yang meliputi pengertian
sistem, e-commerce, uraian singkat tentang domain, hosting dan
software website.
BAB 3 : Pada bab ini penulis menjelaskan tentang perancangan sistem penjualan
toko kue online store meliputi flow diagram , strucktur database,sertifikasi
input, sertifikasi output dan flowchart.
BAB 4 : Menyajikan tentang pengertian implementasi sistem, Tujuan implementasi
Sistem yang di rancang.
(17)
BAB 2
LANDASAN TEORI
2.1
Sekilas E-commerce
Electronic commerce (e-commerce) di definisikan sebagai proses pembelian dan
penjualan produk, jasa dan informasi yang di lakukan secara elektronik dengan
memanfaatkan jaringan komputer.
2.2
Pengertian Komputer
Istilah komputer (computer) diambil dari bahasa Latin computare yang berarti
menghitung
(to compute atau to reckon). Menurut Blissmer (1985), komputer
adalah suatu alat elektronik yang mampu melakukan beberapa tugas, yaitu
menerima input, memproses input sesuai dengan instruksi yang diberikan,
menyimpan perintah-perintah dan hasil pengolahannya, serta menyediakan output
dalam bentuk informasi.
(18)
menghasilkan
output berdasarkan instruksi-instruksi yang telah tersimpan di
dalam memori. Dan masih banyak lagi ahli yang mencoba mendefinisikan secara
berbeda tentang komputer. Namun, pada intinya dapat disimpulkan bahwa
komputer adalah suatu peralatan elektronik yang dapat menerima input, mengolah
input, memberikan informasi, menggunakan suatu program yang tersimpan di
memori komputer, dapat menyimpan program dan hasil pengolahan, serta bekerja
secara otomatis.
2.3
Pengertian Internet
Internet adalah kependekan dari interconnection-networking dan dapat diartikan
sebagai suatu jaringan komputer yang satu dengan yang lain saling terhubung untuk
keperluan komunikasi dan informasi.
Untuk fungsi atau kegunaan internet pada dewasa ini sangat banyak sekali di
berbagai bidang. Secara umum dapat dikatakan bahwa internet berfungsi untuk
mengakses berbagai macam informasi serta peristiwa di berbagai belahan dunia
dengan waktu yang relatif singkat tanpa batasan waktu dan tempat.
2.4
Sekilas Tentang Perancangan
Perancangan dapat diartikan sebagai suatu tahap setelah analisa dari pengembangan
sistem untuk mengembangkan bagaimana suatu sistem itu akan dibentuk. Perancangan
juga dapat berupa penggambaran,
perencanaan, dan pembuatan sketsa atau
(19)
pengaturan dari beberapa elemen yang terpisah ke dalam satu kesatuan yang utuh
dan berfungsi. Termasuk juga menyangkut perangkat lunak dan komputer.
2.5
Sekilas Tentang Sistem
Kata sistem berasal dari bahasa Yunani yaitu “systema” yang berarti kesatuan suatu
kesatuan yang saling tergantung dan saling bekerja sama untuk mencapai tujuan
tertentu. Suatu sistem dapat terdiri dari sitem-sistem bagian lainnya atau sering disebut
subsistem. Subsistem saling berinteraksi dan saling berhubungan membentuk suatu
kesatuan untuk tercapainya suatu sasaran dan sistem tidak terlepas dari
komponen-komponen pendukung sistem yang mempunyai sifat dan fungsi tertentu dan mampu
mempengaruhi proses sistem secara keseluruhan.
pengertian sistem yaitu “sekumpulan elemen-elemen atau komponen-komponen
yang saling berhubungan dimana setiap elemen tersebut saling mendukung satu
dengan yang lainnya untuk mencapai suatu tujuan.”
2.6
Sekilas Tentang Informasi
Informasi adalah hasil dari suatu pengolahan data, maksudnya adalah sesuatu
yang diperoleh setelah adanya pemrosesan data dan penyusunan data-data
kedalam bentuk yang sedemikian rupa sehingga memiliki makna untuk dapat
digunakan dalam pengambilan keputusan .
(20)
2.7
Sekilas Tentang PHP (
Hypertext Preprocessor
) dan MYSQL
PHP adalah salah satu bahasa pemrograman di Internet. Bisa juga di artikan
sebagai bahasa
scripting yang menyatu dengan HTML dan dijalankan pada server
side. PHP bersifat cepat, gratis dan murah ( gratis ), selain itu PHP mendukung
penggunaan database seperti MySQL, PostgreSQL, mSQL, Oracle etc.
Untuk dapat menjalankan PHP melalui browser, maka anda diharuskan
terlebih dahulu menginstall web server (misalnya Apache, PWS, IIS) lalu
menginstall PHP, sedangkan untuk menjalankan MySQL anda tidak perlu
menginstall web server, hanya saja jika ingin dijalankan melalui browser, maka
anda harus menginstall web server. Prosedur penginstallan web server, PHP dan
MySQL dapat anda baca pada manual masing – masing.
Jika anda tidak ingin direpotkan dengan prosedur penginstallan PHP, anda
dapat menjalankan PHP di direktori public_html anda di s.ee.itb.ac.id. Hal itu dapat
dilakukan karena PHP bersifat server side artinya script PHP di jalankan di server,
bukan di computer client. Jadi semakin banyak client yang menjalankan script PHP di
suatu situs, maka beban yang ditanggung oleh server semakin bertambah.
Sintaks – sintaks dalam PHP banyak yang sama dengan C++, dalam hal ini
penulis tidak memberikan penjelasan penggunaan sintaks–sintaks tersebut mengingat
para cakru telah memperoleh pengajaran tersebut di dalam kuliah maupun praktikum
EL – 207 Komputer dan Pemrograman.
(21)
PHP dijalankan dalam file berekstensi .php, .php3 atau .phtml, itu tergantung
dengan settingan PHP anda, tetapi secara umum ekstensi file PHP adalah .php. Kode
PHP menyatu dengan tag – tag HTML dalam satu file. Kode PHP diawali dengan tag
<? atau <?php dan ditutup dengan ?>.
Contoh :
<?
phpinfo();
?>
Struktur penulisan dalam PHP, sama seperti dalam C++, yaitu setiap pernyataan
diakhiri oleh semicolon ( ; ) dan bersifat case sensitive untuk penulisan nama variabel.
Cara penulisan komentar dalam PHP juga sama dengan C++.
Contoh :
<?
$nama = “divisi komputer hme itb”; // Huruf kecil semua
$NAMA = “DIVISI KOMPUTER HME ITB”; // Huruf besar semua
print “$nama
variable menggunakan huruf
kecil.<br>”;
print “$NAMA
variable menggunakan huruf besar.”
;
?
MySQL adalah sebuah perangkat lunak Pembuat database yang bersifat
terbuka atau open source dan berjalan disemua platform baik
Linux maupun Si
Windows, MySQL merupakan program pengakses database
yang bersifat network
(22)
2.8
Sekilas Tentang HTML (
HyperText Markup Language
)
Hypertext Markup Language biasa digunakan untukmembangun suatu halaman Web
yang akan dirancang tetapi bukan suatu bahasa pemograman melainkan sebuah
penandaan terhadap sebuah dokumen teks.
Apakah HTML itu?
HTML merupakan singkatan dari Hypertext Markup Language. HTML digunakan
untuk membangun suatu halaman Web. Sekalipun banyak orang menyebutnya sebagai
suatu bahasa pemrograman, HTML sebenarnya sama sekali bukan bahasa
pemrograman, karena seperti tercermin dari namanya HTML adalah suatu bahasa
mark up. HTML digunakan untuk melakukan mark up (penandaan) terhadap sebuah
dokumen teks. Tanda tersebut digunakan untuk menentukan format atau style dari teks
yang ditandai.
2.8.1 Struktur Dasar HTML
Untuk menandai sebuah file teks merupakan file HTML, maka ciri yang paling
nampak jelas adalah file-nya, yaitu .html. Namun lebih jauh daripada itu, di dalam file
tersebut harus terkandung struktur sebagai berikut:
<html>
<head>
...
</head>
<body>
(23)
...
</body>
</html>
Tag <html> tersebut harus diletakkan pada bagian paling awal dan tag </html>
harus diletakkan pada bagian paling akhir. Bagian head umumnya berisi informasi
mengenai dokumen tersebut, misalnya judul dokumen, versi HTML yang digunakan.
Sedangkan body berisi layout atau desain halaman web.
2.9
Sekilas Tentang CSS (Cascading Style Sheet )
Cascading Style Sheet (CSS) adalah salah satu bahasa pemrograman web yang
digunakan untuk mengendalikan beberapa komponen dalam sebuah web sehingga
akan lebih terstruktur dan seragam. CSS dapat kita gunakan dalam mengendalikan
ukuran gambar, warna teks, warna tabel, ukuran border, warna border, warna
hyperlink, warna mouse over, spasi antar paragraf, spasi antar teks, margin kiri,
kanan, atas, bawah, dan parameter lainnya. CSS bisa juga diartikan sebagai
bahasa
style sheet yang digunakan untuk mengatur tampilan dokumen. Dengan
adanya CSS memungkinkan kita untuk menampilkan halaman yang sama dengan
format yang berbeda.
(24)
suku kata, yaitu Java dan Script. Java adalah Bahasa pemrograman berorientasi obyek,
sedangkan Script adalah serangkaian instruksi program. Dalam aplikasi client untuk
Navigator, pernyataan Java Script yang tertulis dalam sebuah halaman web dapat
mengetahui dan merespon perintah pemakai seperti gerakan mouse, input form, dan
navigasi halaman HTML.
2.11 Sekilas Tentang Domain
Domain adalah nama atau alamat dari sebuah website. Di Internet, setiap orang harus
mengetikkan sebuah nama domain untuk bisa membuka dan membaca isi dari sebuah
website. Dalam hal ini, peranan pemilihan nama domain cukup penting untuk
membedakan website Anda dengan website orang lain.
Domain ini terdiri dari nama domain dan extension. Contoh
blogbisnisinternet.com, blogbisnisinternet adalah nama domain dan .com adalah
extensionnya. Extension biasanya mewakili untuk kategori tertentu seperti .com
untuk keperlukan komersial, .net untuk keperluan jaringan, .org untuk keperluan
website nonkomersial, dan lain-lainnya.
Extension bermacam-macam, bisa berupa TLD (Top Level Domain) seperti
.com, .net, .org atau ada juga yang berupa cTLD (country Top Level Domain)
seperti .co.id, .co.cc dimana id mewakili domain negera Indonesia.
Untuk memilih nama domain Anda bisa menggunakan website yang
menyediakan jasa registrasi nama domain atau dengan menggunakan
software
domain co.cc untuk membantu memilih nama domain untuk website Anda.
(25)
Nama domain sendiri mempunyai identifikasi ekstensi/akhiran sesuai dengan
kepentingan dan lokasi keberadaan website tersebut. Contoh nama domain
ber-ekstensi internasional adalah com, net, org, info, biz, name, ws. Contoh nama domain
ber-ekstensi lokasi Negara Indonesia adalah :
•
.co.id : Untuk Badan Usaha yang mempunyai badan hukum sah
•.ac.id : Untuk Lembaga Pendidikan
•
.go.id : Khusus untuk Lembaga Pemerintahan Republik Indonesia
•
.mil.id : Khusus untuk Lembaga Militer Republik Indonesia
•
.or.id : Untuk segala macam organisasi yang tidak termasuk dalam kategori
“ac.id”,”co.id”,”go.id”,”mil.id” dan lain lain
1.
.war.net.id : untuk industri warung internet di Indonesia
•
.sch.id : khusus untuk Lembaga Pendidikan yang menyelenggarakan
pendidikan seperti SD, SMP dan atau SMU
(26)
2.12 Sekilas Tentang Hosting dan Software Website
Hosting adalah tempat Anda meletakkan file-file website Anda di sebuah server yang
terhubung dengan jaringan internet. Jadi agar website Anda bisa ditampilkan, maka
file-file website perlu Anda simpan di sebuah server hosting.
Software Website adalah software website open source seperti blog wordpress, joomla,
phpbb, dan lain-lainnya, tentunya Anda bisa membuat website yang sama.Dalam web
ini menggunakan software wordpress.
(27)
2.13 Data Flow Diagram (DFD)
Data flow diagram (DFD) adalah alat bantu yang digunakan untuk
menggambarkan aliran data informasi dan transformasi (proses) dari data dimulai
dari pemasukan data sampai menghasilkan keluaran (output) data. Adapun
simbol-simbol dari flow diagram, yaitu:
Tabel 2.1 simbol-simbol DFD
NO
Gambar
Nama
fungsi
1
Kesatuan luar
(External Entity)
Merupakan
kesatuan luar di
lingkungan luar
sistem yang akan
memberikan input
atau menerima
output dari sistem.
(28)
2
Proses (process)
Kegiatan dari hasil
suatu arus data
yang masuk dalam
proses untuk
dihasilkan arus
data yang akan
keluar atau untuk
mengubah input
menjadi output
3
Aliran data
Data mengalir
melalui sistem,
dimulai dengan
sebagian input
data dan diubah
atau diproses
menjadi input
4
Penyimpanan data
( Data Stronge)
Data disimpan
untuk keperluan
berikutnya
2.13 Flow-Chart
Flow chart adalah penggambaran secara grafik dari langkah – langkah dan urutan –
urutan prosedur dari suatu program. Flow chart menolong analis dan programmer
untuk memecahkan masalah ke dalam segmen – segmen yang lebih kecil dan
menolong dalam menganalisis alternatif – alternatif lain dalam pengoperasian Flow
chart biasanya mempermudah penyelesaian suatu masalah khususnya masalah yang
perlu dipelajari dan dievaluasi lebih lanjut. Petunjuk untuk membuat flow chart Bila
seorang analisis dan programmer akan membuat flow chart, ada eberapa petunjuk
(29)
yang harus diperhatikan, seperti :
1. Flow chart digambarkan dari halaman atas ke bawah dan kiri ke kanan.
2. Aktifitas yang digambarkan harus didefinisikan secara hati – hati dan defenisi ini
harus dapat dimengerti oleh pembacanya.
3. Kapan aktifitas dimulai dan berakhir harus ditentukan secara jelas.
4. Setiap langkah dari aktifitas harus diuraikan dengan menggunakan deksripsi kata
kerja.
5. Setiap langkah dari aktifitas harus berada pada urutan yang benar.
6. Lingkup, range dan aktifitas yang sedang digambarkan harus ditelusuri dengan
hati - hati. Percabangan - percabangan yang memotong aktifitas yang
sedang digambarkan tidak perlu digunakan dan percabangannya diletakkan pada
halaman yang terpisah atau hilangkan seluruhnya bila percabangan tidak berkaitan
dengan sistem.
7. Gunakan symbol – symbol flowchart yang standard.
Berikut ini adalah gambar simbol – simbol standar dalam flow chart beserta
dengan arti dari masing – masing simbol :
Tabel 2.2
Flow-Chart
Simbol
Keterangan
Terminal/Interupt
(Mulai/Berhenti)
Simbol ini dipergunakan untuk menunjukkan awal
kegiatan atau akhir kegiatan atau berhentinya
suatu program.
(30)
Input/Output (data/hasil)
Untuk mewakili data input dan menuliskan
output-nya
Process (Pengolahan)
Suatu simbol yang melambangkan diprosesnya
suatu data.
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.
(31)
BAB 3
PERANCANGAN SISTEM
3.1
Perancangan dan Perancangan
Tahapan perancangan dan perancangan merupakan tahapan awal yang dilakukan
penulis dalam membangun website ini. Pada tahapan ini penulis akan
menjabarkan awal perancangan sistem, diagram alur, tujuan dan isi dari website
yang akan dibangun. Website ini dirancang dengan menggunakan domain, hosting
dan software website.
Sebelum membangun software website, ada beberapa tahapan pertanyaan
sebagai identifikasi awal yang perlu dilakukan, antara lain :
a.
Website apa yang akan dibuat ?
b.
Siapa saja yang di harapkan melihat website tersebut ?
c.
Apa saja aktifikasi yang di lakukan dalam website tersebut ?
d.
Apa saja yang ingin dicapai dari pembuatan website tersebut ?
Dengan menjawab beberapa pertanyaan di atas, maka jawaban dari penulis
untuk beberapa pertanyaan di atas sebagai berikut :
(32)
b.
Yang di harapkan untuk melihat website
ini adalah pembeli yang ingin
membeli kue yang tersedia.
c.
Aktifikasi yang dapat dilakukan dalam website tersebut adalah
pengunjung dapat melihat semua jenis kue yang berfariasi sesuai dengan
yang di butuhkan oleh konsumen di setiap moment.
d.
Target yang ingin dicapai dalam pembuatan website ini adalah dapat
memberikan kemudahan terhadap teransaksi penjulan, juga pembeli dapat
melakukan transaksi dari mana pun dan kapan pun hanya dengan
menggunakan sebuah komputer yang telah memiliki akses internet.
Tahapan selanjutnya adalah tahapan pembuatan bagan atau struktur dari
website tersebut. Struktur website tersebut menampilkan struktur hirarki dan isi
halaman perhalaman. Dengan adanya struktur, akan sangat mudah untuk
memvisualisasikan isi dari setiap halaman website dan navigasi antar halaman.
Adapun struktur dari website yang penulis buat di tunjukkan pada gambar
berikut
(33)
Gambar 3.1 Struktur Website
3.2
Perancangan Halaman Website
3.2.1 Halaman Home
Halaman ini merupakan halaman utama dari website. Halaman ini berisikan tentang
perkenalan product dan
update terbaru
product yang di jual dan link-link utama
menuju ke halaman-halaman lainnya.
Home
home
Perkenalan
product
comment
Cara pembelian
pengiriman
product
Tentang kami
Data toko
Form
pembelian
Jasa
pengiriman
Birthday
Cake
Cake
Cake
Wedding
Cookies
Cupcake
Pudding
Admin
Login Admin
entries rss (antrian
ringkasan pesanan
atau webblog)
Ringkasan
komentar
(34)
3.2.2 Cara Pembelian
Halaman ini berisikan link-link yang menghubungkan data toko dan form pembelian.
Dimana pembeli dapat melihat data toko dan dapat memesan product di form yang di
sediakan di halaman ini .
3.2.3 Pengiriman
Halaman ini berisikan ke jasa pegiriman yang telah di sediakan , pembeli akan
memilih satu tempat pengiriman baik itu TIKI ataupun JNE.
3.2.4 Product
Halaman ini berisikan aneka macam jenis kue yang di link kan ke jenis-jenis kue
beraneka ragam yang tersedia untuk segala momen dan harganya masing-masing.
3.2.5 Tentang Kami
Halaman ini berisikan tentang info toko kue online store .
3.2.6 Halaman Admin
Halaman ini berisikan login yang akan menghubungkan ke halaman adminisrator.
Halaman ini khusus hanya dapat di akses oleh adminstrator website untuk melakukan
pengaturan website seperti menambah, menghapus dan mengubah data.
(35)
3.3
Diagram Level Konteks
Dalam perancangan sistem ini, penulis mencoba untuk memberikan gambaran
mengenai alur pemesanan produk. Adapun rancangan DFD pada sistem ini adalah
sebagai berikut:
Info pemesanan kue info data katagori kue
Info kue
Kategori kue data pemesan kue
Produk kue
Laporan pemesanan kue
Gambar 3.2 DFD Level Konteks
Admin
Sistem
E-commerce
pemesan
(36)
Tampilan Utama
Product kue
Cara Pembelian
Pengiriman
Data pemesan kue
Kode kue
Gambar 3.3 DFD Level 0
Pemesan
Admin
F1
F2
1.0
Input Data
F3
F4
2.0
Pembuatan
Laporan
(37)
3.4
Perancangan Diagram Alir (
flowchart
)
Website
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 bentuk-bentuk flowchart
dari toko kue online store.
3.4.1
flowchart Home
seorang pengunjung website dapat mengakses menggunakan jaringan internet dan
dapat berpindah dari halaman yang satu ke halaman lainnya. Masing- masing
halaman utama memiiki link-link yang dapat dipilih .Menu utama menampilkan
update-update product terbaru. Flowchart menu utama dapat dilihat pada gambar
3.4
(38)
Yes
Yes
Yes Yes
Yes
Yes Yes
Yes
Yes
Yes
Yes Yes
Yes
Yes
Yes
Yes Yes
Gambar 3.4 Flowchart
Halaman Menu Utama
Home
START
Menampilkan
Menu Utama
Pilih link
yang ada
Cara
pembelian
Pengiriman
product
Tentang
kami
Prosedur
log in
Pilih link
yang ada
B
Profil
product
Prosedur
log in
C
Admin
Prosedur
log in
D
(39)
3.4.2
Flowchart Cara Pembelian
Halaman ini di tujukan untuk pengunjung yang ingin memesan atau membeli kue.
Dimana pembeli dapat melihat data toko dan dapat memesan product di form yang di
sediakan di halaman ini. flowchart cara pembelian dapat di lihat pada gambar 3.5
Yes
Yes
Yes
Yes
Y Yes Yes
Yes
No Yes
Pemesanan Pebelian
Informasi data
penjual
Masukkan data
pembeli
Masukkan kode
pesanan dan jumlah
pesanan
B
Pilih pengiriman
yang di sediakan
- TIKI
- JNE
(40)
3.4.3 flowchart Produk
Halaman ini ini di jutukan untuk pengunjung yang hendah meliht jenis-jenis kue,
harganya yang mau di pesan . Pada halaman ini terdapat jenis kue seperti: Birthday
Cake, Cake, Cake Wedding, Cookies, Cupcake, Pudding dan melinkan ke
macam-macam jenis kue. Flowchart cara produk penjualan dapat di lihat pada gambar 3.6
Yes
Yes
Yes
Yes
Yes Yes
Yes
Yes
Yes
Yes
Yes
c
Pilih jenis kue
Home
product
-Birthday Cake
- Cake
- Wedding Cake
- Cookies
- Cupcake
-Pudding
Cara pembelian
Jumlah pesanan
Pilih kode
Nama kue dan
kodenya
masing-masing
Update product terbaru
(41)
3.4.3
Flowchart Admin
Halaman admin ini hanya dapat di akses oleh administrator
.Username dan
password
dari
administrator harus sesuai dengan tabel admin. Jika username
dan
password maka admin akan masuk ke halaman administrator dan jika username atau
password salah maka akan timbul pesan error dan untuk login kembali.
Flowchart
admin dapat dilihat pada gambar 3.7 di bawah ini.
Yes
Yes
Yes
Yes
Yes
Yes
Yes
Yes
Yes
D
Buka Halaman Admin
Login
Input Username
& password
Cek Username
& password
Username & password salah
Tampilan halaman admin
- Post (menampilkan)
- Media (tempat gambar)
- Link(hubungan)
- Pages (lembar halaman)
- Comments(komentar orang)
- Appearance(penampilan)
(42)
3.5
Merancang Database Server
Database merupakan tempat penyimpanan data yang terstruktur sehingga dapat
diakses dengan cepat dan mudah. Tahap mempersiapkan database
ini merupakan
tahap dimana penulis mempersiapkan tempat untuk menampung data di server.
Data
tersebut akan diproses oleh program yang kita buat pada tahap pemrograman baik
menambah, mengubah, penghapusan, dan menampilkan database itu sendiri.
Database terdiri dari tabel-tabel yang dibuat menggunakan program MYSQL.
Database yang dirancang penulis adalah database
toko kue online store yang terdiri
dari 9(sembilan) tabel sebagai berikut :
1.
Tabel Commentmeta
Tabel 3.1 Tabel Commentmeta
Field Name
Type
Width
Meta id
Bigint
20
Comment_id
Bigint
20
2.
Tabel Comment
Tabel 3.2 Tabel Comment
Field Name
Type
width
Comment id
bigint
20
Comment_post_id
bigint
20
(43)
Comment_author_email
varchar
100
Comment_author_url
varchar
200
Comment_date
datetime
_
Comment_approved
varchar
20
Comment_type
varchar
20
User_-id
bigint
20
3.
Tabel Links
Tabel 3.3 Tabel Links
Fiel Name
Type
Width
Link_id
bigin
20
Link_url
Varchar
225
Link_image
varchar
225
Link_update
datetime
_
4.
Tabel Option
Tabel 4.4 Tabel Option
Fiel Name
Type
Width
Option id
bigint
20
Blog_id
int
11
Option_name
varchar
64
5.
Tabel Postmeta
Tabel 3.5 Tabel Postmeta
Fiel Name
Type
width
Meta id
bigint
20
(44)
6.
Tabel Post
Tabel 3.6 Tabel Post
Fiel Name
Type
Widt
h
ID
bigint
20
Post_author
bigint
20
Post_date
datetime
_
Post_content
longtext
_
Post_title
text
_
Post_status
varchar
20
Comment-status
varchar
20
Ping_status
varchar
20
Post_password
varchar
20
Post_name
varchar
200
Post_modified
datetime
_
Post_content_filtered
text
_
Post_parent
bigin
20
Menu_order
int
11
Post_type
varchar
20
Comment_count
bigint
20
7.
Tabel Terms
Tabel 3.7 Tabel Terms
Fiel Name
Type
Width
Term_id
Bigint
20
(45)
Slug
varchar
200
Term_group
bigint
10
8.
Tabel User_meta
Tabel 3.10 Tabel User_meta
Field Name
Type
Width
Umeta id
bigint
20
User_id
bigint
20
Meta_key
varchar
225
Mata_value
longtext
_
9.
Tabel Users
Tabel 3.11 Tabel Users
Field Name
Type
Width
Id
bigint
20
User_login
varchar
60
User_pass
varchar
64
User_nicenime
varchar
50
User_email
varchar
100
User_url
varchar
100
User_registered
datetime
_
User_activation_key
varchar
60
User_status
int
11
(46)
3.6
Desain Website
3.6.1
Desain Home
Halaman home adalah halaman pembuka yang merupakan halaman yang akan
tampil setelah masuk ke webite penjualan online store.Halaman ini juga termasuk
halaman perberitahuan product-product terbaru. Adapun tampilannya adalah sebagai
berikut:
(47)
3.6.2
Desain Cara Pembeli
Halaman ini berisikan link-link yang menghubungkan data toko dan form
pembelian .
Gambar 3.9 Tampilan Halaman Pembelian
3.6.3
Desain Pengiriman
Halaman ini menghubungkan ke jasa pegiriman yang telah di sediakan ,
pembeli akan memilih satu tempat pengiriman baik itu TIKI ataupun JNE.
(48)
3.6.4
Desai Halaman Product
Halaman ini berisikan aneka macam jenis kue yang di link kan ke jenis-jenis kue
beraneka ragam yang tersedia untuk segala momen dan harganya masing-masing.
Gambar 3.11 Tampilan Halaman Product
3.6.5
Desai Halaman Birthday Cake
Halaman ini menampilkan jenis-jenis Birthday Cake ,kode, dan harganya
masing-masing.
(49)
3.6.6
Desain Halaman Cake
Halaman ini menampilkan jenis-jenis Cake ,kode, dan harganya masing-masing.
Gambar 3.13 Tampilan Halaman Cake
3.6.7
Desain Halaman Wedding Cake
Halaman ini menampilkan jenis-jenis Wedding Cake ,kode, dan harganya
masing-masing.
(50)
3.6.8
Desain Halaman Cookies
Halaman ini menampilkan jenis-jenis Cookies, kode, dan harganya masing-masing.
Gambar 3.15 Tampilan Halaman Cookies
3.6.9
Desain Halaman Cupcake
Halaman ini menampilkan jenis-jenis Cupcake, kode, dan harganya masing-masing.
(51)
3.6.10
Desain Halaman Puding
Halaman ini menampilkan jenis-jenis puding, kode, dan harganya masing-masing.
Gambar 3.17 Tampilan Halaman Cupcake
3.6.11
Desain Halaman Tentang Kami
(52)
3.6.12
Desain Halaman Login Admin
Halaman ini berisikan login yang akan menghubungkan ke halaman adminisrator.
3.6.13
Desain Halaman Admin
Halaman ini khusus hanya dapat di akses oleh adminstrator website
untuk
melakukan pengaturan website seperti menambah, menghapus dan mengubah data.
(53)
BAB 4
IMPLEMENTASI SISTEM
4.1
Pengertian Implementasi Sistem
Implementasi sistem adalah langkah-langkah atau prosedur yang dilakukan dalam
menyelesaikan desain
sistem yang telah disetujui untuk menguji, menginstal dan
melalui sistem baru atau sistem yang diperbaiki untuk menggantikan sistem yang
lama.
4.2
Tujuan Implementasi Sistem
Tujuan Implementasi Sistem adalah sebagai berikut :
1.
Menyelesaikan desain website yang baru akan di buat.
2.
Menguji program-program dan prosedur baru.
3.
Memastikan bahwa sistem yang dibuka dengan sempurna oleh pembeli.
4.
Menguji apakah sistem baru tersebut sesuai dengan apa yang diinginkan.
5.
Memastikan bahwa pemakai (user) dapat mengoperasikan sistem baru dengan
Baik.
(54)
4.3
Komponen Dalam Implementasi Sistem
Untuk mengetahui perancangan website yang telah kita kerjakan dapat berjalan
dengan baik atau tidak, maka perlu dilakukan pengujian terhadap sistem yang telah
kita buat. Untuk itu dibutuhkan beberapa komponen utama mencakup perangkat keras
(hardware), perangkat lunak (software), dan otak (brainware).
Pada website toko online store ini di butuhkan beberapa komponen seperti
yang di sebut diatas, yaitu :
1.
Perangkat keras (hardware)
a.
Monitor
b.
Harddisk
c.
Memory minimal 256 MB
d.
Modem
e.
Keybord dan mouse
2.
Perangkat lunak
a.
Sistem Operasi windows7
b.
.co.cc sebagai Domain
c.
000webhost sebagai Database
d.
MYSQL sebagai pengelola data.
e.
PHP sebagai bahasa pemrograman serverside
f.
CSS untuk mengatur tampilan dokumen dalam mengendalikan ukuran gambar,
warna teks, warna tabel, ukuran border, warna border, warna hyperlink, warna
mouse over, spasi antar paragraf, spasi antar teks, margin kiri, kanan, atas,
bawah.
(55)
3.
Perangkat Operator
a.
Administrator
(56)
BAB 5
KESIMPULAN DAN SARAN
5.1 Kesimpulan
Dari keterangan dan bab-bab sebelumnya penulis dapat mengambil beberapa
kesimpulan sebagai berikut :
1.
Dalam pembuatan website ini ada beberapa tahapan yang dilakukan penulis
yaitu tahapan perencanaan, tahapan perancanagn diagram(flowchart),
mempersiapkan database server, dan tahapan implementasi sistem.
2.
Website ini dibuat menggunakan .co.cc sebagai domain, 000webhost sebagai
database dan file manager, PHP sebagai bahasa pemrograman, MYSQL
sebagai pengelola server, CSS sebagai pengatur tampilan dokumen.
3.
Pembuatan website
ini dilakukan pada jaringan internet .koneksi internet
sangat di butuhkan dalam mengaksesan situs.
4.
Layout dan header yang bagus dan menarik dapat menambah daya tarik
website sehingga banyak dikunjungi para pengunjung.
5.
Selalu meng-Update informasi seputar product terbaru
6.
Merupakan sarana online yang dapat diakses oleh siapapun .
(57)
5.2 Saran
Adapun beberapa saran penulis pada pembuatan website ini adalah :
1. Perlu dilakukan pembaruan atau update berkala oleh administrator pada website
Ini guna memberikan informasi dan product terbaru.
2.
Untuk menarik minat pengunjung dan pembeli, perlu dibuat rancangan loyout atau
temple dengan animasi yang menarik.
3.
Dalam pembuatan website ini, perlu dirancang dengan teliti agar dalam melakukan
pembaharuan data tidak ada kesalahan.
4.
Perlu adanya jaringan internet yang baik untuk mengedit data, agar data yang di
buat tidak hilang.
5.
Perlu dilakukan penggandaan (backup) secara teratur kedalam penyimpanan
lainnya untuk mencegah hal-hal yang tidak di inginkan seperti data hilang atau
rusak.
6.
Dengan adanya website ini dapat memotivasi pembisnis dalam membuka peluang
usaha dan terus meningkatkan ilmu pengetahuan khususnya dalam bidang
teknologi dan bisnis.
(58)
DAFTAR PUSTAKA
Fathansyah., Sistem Basis Data, Informatika, Bandung, 1999.
Hartono, Jogianto Pengenalan Komputer, Andi, Yogyakarta, 2004.
Kurniadi, Adi. Belajar mahir website, PT. Elex Media Komputindo Gramedia,
Surabaya, 2001.
Muhaimin, Yahya A. Kamus Besar Bahasa Indonesia, Menteri Pendidikan, Jakarta,
2000.
Mahyuzir Tavri., Pengelolahan Data, PT. Elex Media Komputindo, Jakarta.
2012.
(59)
LAMPIRAN 1 : LISTING PROGRAM
Listing header.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" <?php
language_attributes(); ?>>
<head profile="http://gmpg.org/xfn/11">
<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" /> <title><?php if (is_home () ) { bloginfo('name'); } elseif (
is_category() ) { single_cat_title(); echo ' - ' ; bloginfo('name'); }
elseif (is_single() ) { single_post_title(); } elseif (is_page() ) { bloginfo('name'); echo ': '; single_post_title(); }
else { wp_title('',true); } ?></title>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/script.js"></script>
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />
<!--[if IE 6]><link rel="stylesheet" href="<?php
bloginfo('template_url'); ?>/style.ie6.css" type="text/css" media="screen" /><![endif]-->
<link rel="alternate" type="application/rss+xml" title="<?php printf(__('%s RSS Feed', 'kubrick'), get_bloginfo('name')); ?>" href="<?php bloginfo('rss2_url'); ?>" />
<link rel="alternate" type="application/atom+xml" title="<?php printf(__('%s Atom Feed', 'kubrick'), get_bloginfo('name')); ?>" href="<?php bloginfo('atom_url'); ?>" />
<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" /> <?php wp_head(); ?>
</head> <body> <div class="PageBackgroundSimpleGradient"> </div> <div class="PageBackgroundGlare"> <div class="PageBackgroundGlareImage"></div> </div> <div class="Main"> <div class="Sheet"> <div class="Sheet-tl"></div> <div class="Sheet-tr"><div></div></div> <div class="Sheet-bl"><div></div></div> <div class="Sheet-br"><div></div></div> <div class="Sheet-tc"><div></div></div> <div class="Sheet-bc"><div></div></div> <div class="Sheet-cl"><div></div></div> <div class="Sheet-cr"><div></div></div> <div class="Sheet-cc"></div> <div class="Sheet-body"> <div class="Header">
(60)
<a href="<?php echo get_option('home'); ?>/"><?php bloginfo('name'); ?></a></h1>
<div id="slogan-text" class="logo-text"> <?php bloginfo('description'); ?></div> </div>
</div>
<div class="nav">
<?php wp30_menu(); ?> <div class="l"> </div> <div class="r"> <div> </div> </div> </div>
Listing Templet.php
<?php get_header(); ?> <?php$lcmp_page_head = <<<TXT <div class="contentLayout"> <div class="content">
TXT;
$lcmp_is_left = strpos($lcmp_page_head,"sidebar"); if($lcmp_is_left===FALSE){
$lcmp_rightdefault = 'default'; $lcmp_leftdefault = 'notdefault'; }else{
$lcmp_leftdefault = 'default'; $lcmp_rightdefault = 'notdefault'; }
?>
<div class="contentLayout"> <?php
global $lcmp_sidebarloc;
if($lcmp_sidebarloc == $lcmp_leftdefault || $lcmp_sidebarloc == 'left'){ ?>
<div class="sidebar1">
<?php include (TEMPLATEPATH . '/sidebar1.php'); ?> </div>
<?php } ?>
<div class="content"> <div class="Block"> <div class="Block-tl"></div> <div class="Block-tr"><div></div></div> <div class="Block-bl"><div></div></div> <div class="Block-br"><div></div></div> <div class="Block-tc"><div></div></div> <div class="Block-bc"><div></div></div> <div class="Block-cl"><div></div></div> <div class="Block-cr"><div></div></div> <div class="Block-cc"></div> <div class="Block-body">
(61)
<div class="BlockHeader">
<div class="header-tag-icon"> <div class="BlockHeader-text"> <?php _e('Not Found', 'kubrick'); ?> </div>
</div>
<div class="l"></div>
<div class="r"><div></div></div> </div>
<div class="BlockContent">
<div class="BlockContent-body">
<h2 class="center"><?php _e('Error 404 - Not Found', 'kubrick'); ?></h2>
</div> </div>
</div> </div>
</div> <?php
global $lcmp_sidebarloc;
if($lcmp_sidebarloc == $lcmp_rightdefault || $lcmp_sidebarloc == 'right'){ ?>
<div class="sidebar1">
<?php include (TEMPLATEPATH . '/sidebar1.php'); ?> </div>
<?php } ?>
<?php if(file_exists(TEMPLATEPATH . '/sidebar2.php')){ ?> <div class="sidebar2">
<?php include (TEMPLATEPATH . '/sidebar2.php'); ?> </div>
<?php } ?> </div>
<div class="cleared"></div> <?php get_footer(); ?>
Listing Archives.PHP
<?php get_header(); ?> <?php$lcmp_page_head = <<<TXT <div class="contentLayout"> <div class="content">
TXT;
$lcmp_is_left = strpos($lcmp_page_head,"sidebar"); if($lcmp_is_left===FALSE){
$lcmp_rightdefault = 'default'; $lcmp_leftdefault = 'notdefault'; }else{
(62)
?>
<div class="contentLayout"> <?php
global $lcmp_sidebarloc;
if($lcmp_sidebarloc == $lcmp_leftdefault || $lcmp_sidebarloc == 'left'){ ?>
<div class="sidebar1">
<?php include (TEMPLATEPATH . '/sidebar1.php'); ?> </div>
<?php } ?>
<div class="content">
<?php is_tag(); ?> <?php is_tag(); ?>
<?php if (have_posts()) : ?>
<div class="Post"> <div class="Post-tl"></div> <div class="Post-tr"><div></div></div> <div class="Post-bl"><div></div></div> <div class="Post-br"><div></div></div> <div class="Post-tc"><div></div></div> <div class="Post-bc"><div></div></div> <div class="Post-cl"><div></div></div> <div class="Post-cr"><div></div></div> <div class="Post-cc"></div> <div class="Post-body"> <div class="Post-inner article">
<div class="PostContent">
<?php $post = $posts[0]; // Hack. Set $post so that the_date() works. ?>
<?php /* If this is a category archive */ if (is_category()) { ?> <h2 class="pagetitle"><?php printf(__('Archive for the
‘%s’ Category', 'kubrick'), single_cat_title('', false)); ?></h2>
?></h2>
<?php /* If this is a tag archive */ } elseif( is_tag() ) { ?> <h2 class="pagetitle"><?php printf(__('Posts Tagged
‘%s’', 'kubrick'), single_tag_title('', false) ); ?></h2> <?php /* If this is a daily archive */ } elseif (is_day()) { ?>
<h2 class="pagetitle"><?php printf(_c('Archive for %s|Daily archive page', 'kubrick'), get_the_time(__('F jS, Y', 'kubrick'))); ?></h2> <?php /* If this is a monthly archive */ } elseif (is_month()) { ?> <h2 class="pagetitle"><?php printf(_c('Archive for %s|Monthly archive page', 'kubrick'), get_the_time(__('F, Y', 'kubrick'))); ?></h2> <?php /* If this is a yearly archive */ } elseif (is_year()) { ?> <h2 class="pagetitle"><?php printf(_c('Archive for %s|Yearly archive page', 'kubrick'), get_the_time(__('Y', 'kubrick'))); ?></h2>
<?php /* If this is an author archive */ } elseif (is_author()) { ?> <h2 class="pagetitle"><?php _e('Author Archive', 'kubrick'); ?></h2> <?php /* If this is a paged archive */ } elseif
(isset($_GET['paged']) && !empty($_GET['paged'])) { ?>
<h2 class="pagetitle"><?php _e('Blog Archives', 'kubrick'); ?></h2> <?php } ?>
<?php
(63)
'kubrick'));
$next_link = get_next_posts_link(__('« Older Entries', 'kubrick'));
?>
<?php if ($prev_link || $next_link): ?> <div class="navigation">
<div class="alignleft"><?php echo $next_link; ?></div>
<div class="alignright"><?php echo $prev_link; ?></div>
</div>
<?php endif; ?>
</div>
<div class="cleared"></div>
</div>
</div> </div>
<?php while (have_posts()) : the_post(); ?> <div class="Post">
<div class="Post-tl"></div>
<div class="Post-tr"><div></div></div> <div class="Post-bl"><div></div></div> <div class="Post-br"><div></div></div> <div class="Post-tc"><div></div></div> <div class="Post-bc"><div></div></div> <div class="Post-cl"><div></div></div> <div class="Post-cr"><div></div></div> <div class="Post-cc"></div>
<div class="Post-body"> <div class="Post-inner article"> <h2 class="PostHeaderIcon-wrapper">
<img src="<?php bloginfo('template_url');
?>/images/PostHeaderIcon.png" width="27" height="25" alt="PostHeaderIcon" />
<span class="PostHeader"><a href="<?php the_permalink() ?>" rel="bookmark" title="<?php printf(__('Permanent Link to %s', 'kubrick'), the_title_attribute('echo=0')); ?>">
<?php the_title(); ?> </a></span>
</h2>
<?php $icons = array(); ?> <?php if (!is_page()) : ?> <?php ob_start(); ?>
<img src="<?php bloginfo('template_url'); ?>/images/PostDateIcon.png" width="17" height="18" alt="PostDateIcon" />
<?php the_time(__('F jS, Y', 'kubrick')) ?> <?php $icons[] = ob_get_clean(); ?>
(64)
_e('Author', 'kubrick'); ?>"><?php the_author() ?></a> <?php $icons[] = ob_get_clean(); ?>
<?php endif; ?>
<?php if (current_user_can( 'edit_post', $post->ID )) : ?><?php ob_start(); ?>
<img src="<?php bloginfo('template_url'); ?>/images/PostEditIcon.png" width="13" height="13" alt="PostEditIcon" />
<?php edit_post_link(__('Edit', 'kubrick'), ''); ?> <?php $icons[] = ob_get_clean(); ?><?php endif; ?> <?php if (0 != count($icons)): ?>
<div class="PostHeaderIcons metadata-icons"> <?php echo implode(' | ', $icons); ?>
</div>
<?php endif; ?>
<div class="PostContent">
<?php if (is_search()) the_excerpt(); else the_content(__('Read the rest of this entry »', 'kubrick')); ?>
</div>
<div class="cleared"></div> <?php $icons = array(); ?> <?php if (!is_page()) : ?> <?php ob_start(); ?>
<img src="<?php bloginfo('template_url');
?>/images/PostCategoryIcon.png" width="18" height="18" alt="PostCategoryIcon" />
<?php printf(__('Posted in %s', 'kubrick'), get_the_category_list(', ')); ?>
<?php $icons[] = ob_get_clean(); ?> <?php endif; ?>
<?php if (!is_page() && get_the_tags()) : ?><?php ob_start(); ?> <?php the_tags(__('Tags:', 'kubrick') . ' ', ', ', ' '); ?> <?php $icons[] = ob_get_clean(); ?><?php endif; ?>
<?php if (!is_page() && !is_single()) : ?><?php ob_start(); ?> <img src="<?php bloginfo('template_url');
?>/images/PostCommentsIcon.png" width="18" height="18" alt="PostCommentsIcon" />
<?php comments_popup_link(__('No Comments »', 'kubrick'), __('1 Comment »', 'kubrick'), __('% Comments »', 'kubrick'), '', __('Comments Closed', 'kubrick') ); ?>
<?php $icons[] = ob_get_clean(); ?><?php endif; ?> <?php if (0 != count($icons)): ?>
<div class="PostFooterIcons metadata-icons"> <?php echo implode(' | ', $icons); ?>
</div>
<?php endif; ?>
</div>
</div> </div>
<?php endwhile; ?>
<?php if ($prev_link || $next_link): ?> <div class="Post">
<div class="Post-tl"></div>
(65)
<div class="Post-bl"><div></div></div> <div class="Post-br"><div></div></div> <div class="Post-tc"><div></div></div> <div class="Post-bc"><div></div></div> <div class="Post-cl"><div></div></div> <div class="Post-cr"><div></div></div> <div class="Post-cc"></div>
<div class="Post-body"> <div class="Post-inner article">
<div class="PostContent">
<div class="navigation">
<div class="alignleft"><?php echo $next_link; ?></div>
<div class="alignright"><?php echo $prev_link; ?></div>
</div>
</div>
<div class="cleared"></div>
</div>
</div> </div>
<?php endif; ?>
<?php else : ?> <div class="Post">
<div class="Post-tl"></div>
<div class="Post-tr"><div></div></div> <div class="Post-bl"><div></div></div> <div class="Post-br"><div></div></div> <div class="Post-tc"><div></div></div> <div class="Post-bc"><div></div></div> <div class="Post-cl"><div></div></div> <div class="Post-cr"><div></div></div> <div class="Post-cc"></div>
<div class="Post-body"> <div class="Post-inner article">
<div class="PostContent">
<?php
if ( is_category() ) { // If this is a category archive
printf("<h2 class='center'>".__("Sorry, but there aren't any posts in the %s category yet.", "kubrick").'</h2>',
single_cat_title('',false));
} else if ( is_date() ) { // If this is a date archive
echo('<h2>'.__("Sorry, but there aren't any posts with this date.", "kubrick").'</h2>');
} else if ( is_author() ) { // If this is a category archive $userdata =
(1)
?>
left: <?php echo $lcmp_hdrleftpos; ?>; <?php } ?>
<?php
if($lcmp_hdrtoppos!='default'){
if(is_numeric($lcmp_hdrtoppos)) $lcmp_hdrtoppos.="px"; ?>
top:<?php echo $lcmp_hdrtoppos; ?>; <?php } ?>
<?php
if($lcmp_hdrwidth!='default'){
if(is_numeric($lcmp_hdrwidth)) $lcmp_hdrwidth.="px"; ?>
width: <?php echo $lcmp_hdrwidth; ?>; <?php } ?>}
<?php
if($lcmp_hdrvmargin!='default'){
if(is_numeric($lcmp_hdrvmargin)) $lcmp_hdrvmargin.="px"; ?>
.Sheet
{margin-top: <?php echo $lcmp_hdrvmargin; ?> !important;} <?php } ?>
<?php
if($lcmp_cstftrwidgewidth!='' || $lcmp_cstftrwidgemargin!=''){ ?>
.widget-area{ <?php
if($lcmp_cstftrwidgewidth!=''){
if(is_numeric($lcmp_cstftrwidgewidth)) $lcmp_cstftrwidgewidth.="px";
?>
width: <?php echo $lcmp_cstftrwidgewidth; ?>; <?php } ?>
<?php
if($lcmp_cstftrwidgemargin!=''){
if(is_numeric($lcmp_cstftrwidgemargin)) $lcmp_cstftrwidgemargin.="px";
?>
margin-right: <?php echo $lcmp_cstftrwidgemargin; ?>; <?php } ?>
} <?php } ?> <?php
if($lcmp_cstftrwidgewidth1!=''){
if(is_numeric($lcmp_cstftrwidgewidth1)) $lcmp_cstftrwidgewidth1.="px";
?>
.foot-widget-1
{width: <?php echo $lcmp_cstftrwidgewidth1; ?>;} <?php } ?>
<?php
if($lcmp_cstftrwidgewidth2!=''){
if(is_numeric($lcmp_cstftrwidgewidth2)) $lcmp_cstftrwidgewidth2.="px";
?>
(2)
{width: <?php echo $lcmp_cstftrwidgewidth2; ?>;} <?php } ?>
<?php
if($lcmp_cstftrwidgewidth3!=''){
if(is_numeric($lcmp_cstftrwidgewidth3)) $lcmp_cstftrwidgewidth3.="px";
?>
.foot-widget-3
{width: <?php echo $lcmp_cstftrwidgewidth3; ?>;} <?php } ?>
<?php
if($lcmp_cstftrwidgewidth4!=''){
if(is_numeric($lcmp_cstftrwidgewidth4)) $lcmp_cstftrwidgewidth4.="px";
?>
.foot-widget-4
{width: <?php echo $lcmp_cstftrwidgewidth4; ?>;} <?php } ?>
</style> <?php }
global $adsenseBlock1; TXT;
add_action('admin_menu', 'lcmp_add_theme_page'); add_action('wp_footer','lcmp_theme_options');
Listing links
<?php get_header(); ?> <?php
$lcmp_page_head = <<<TXT <div class="contentLayout"> <div class="content">
TXT;
$lcmp_is_left = strpos($lcmp_page_head,"sidebar"); if($lcmp_is_left===FALSE){
$lcmp_rightdefault = 'default'; $lcmp_leftdefault = 'notdefault'; }else{
$lcmp_leftdefault = 'default'; $lcmp_rightdefault = 'notdefault'; }
?>
<div class="contentLayout"> <?php
global $lcmp_sidebarloc;
if($lcmp_sidebarloc == $lcmp_leftdefault || $lcmp_sidebarloc == 'left'){ ?>
<div class="sidebar1">
<?php include (TEMPLATEPATH . '/sidebar1.php'); ?> </div>
(3)
<?php } ?>
<div class="content"> <div class="Block">
<div class="Block-tl"></div>
<div class="Block-tr"><div></div></div> <div class="Block-bl"><div></div></div> <div class="Block-br"><div></div></div> <div class="Block-tc"><div></div></div> <div class="Block-bc"><div></div></div> <div class="Block-cl"><div></div></div> <div class="Block-cr"><div></div></div> <div class="Block-cc"></div>
<div class="Block-body"> <div class="BlockHeader">
<div class="header-tag-icon"> <div class="BlockHeader-text"> <?php _e('Links:', 'kubrick'); ?> </div>
</div>
<div class="l"></div>
<div class="r"><div></div></div> </div>
<div class="BlockContent">
<div class="BlockContent-body"> <ul>
<?php get_links_list(); ?> </ul>
</div> </div>
</div> </div> </div> <?php
global $lcmp_sidebarloc;
if($lcmp_sidebarloc == $lcmp_rightdefault || $lcmp_sidebarloc == 'right'){ ?>
<div class="sidebar1">
<?php include (TEMPLATEPATH . '/sidebar1.php'); ?> </div>
<?php } ?>
<?php if(file_exists(TEMPLATEPATH . '/sidebar2.php')){ ?> <div class="sidebar2">
<?php include (TEMPLATEPATH . '/sidebar2.php'); ?> </div>
<?php } ?> </div>
<div class="cleared"></div> <?php get_footer(); ?>
(4)
Listing Menu CAKE.php
<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" xmlns="http://www.w3.org/TR/REC-html40"> <head>
<title>Pudding</title> <style type="text/css"> body{margin
margin-top:100px; margin-bottom:100px; margin-right:150px; margin-left:100px; }
p.padding {
padding-top:25px; padding-bottom:25px; padding-right:50px; padding-left:50px; }
h1 {color:#00ff00;} </style>
<body bgcolor="#FFCC66">
<img src="http://indah-permata.co.cc/wp-content/HTML/Header.jpg" width="752" height="170" /><table border="0">
<div id =”nav”>
<tr><td><a href= "http://indah-permata.co.cc/">HOME</a> </td> <td >| <a href= "http://indah-permata.co.cc/cara-pembelian/">Cara Pembelian</a></td>
<td>| <a href= "http://indah-permata.co.cc/pengiriman/"> Pengiraman</a></td>
<td>| <a href= "http://indah-permata.co.cc/Product">Product</a></td> <td>| <a href= "LOGIN.html ">CONTACT US</a></td> </tr></table>
</br>
<div id="container" style="width:750px">
<div id="header" style="background-color:#FFA500;">
<Marquee behavior=""scroll"direction="left" scrollamount="5" scrolldelay="10" bgcolor="#FFDD00"> Selamat Datang di Site Kami, Silakan Melihat-Lihat dan berbelanja disini ....</Marquee></h3> </h1></div>
<div id="MENU"
style="background-color:#FFDD00;height:750px;width:230px;float:left;"> <p><b> Daftar Menu kue</b><br /> </p>
<p>
<a href= "CAKE.html ">CAKE</a><br /></br>
(5)
<a href= "BIRTHDAYCAKE.html ">BIRTHDAY CAKE<br /></br> </a>
<a href= "WEDDINGCAKE.html">WEDDING CAKE</a><br/></br>
<a href= "COOKIES.html ">COOKIES</a><br/></br>
<a href= "PUDDING.html ">PUDDING</a><br/></br> </br>
<b> Supported by : </b></br></br> <img src = "jne.jpg"> </br></br> <img src = "tiki.jpg"> </br></br> </div>
<div id="content"
style="background-color:#FFFF99;height:750px;width:520px;float:left;"> <style type="text/css">
div.img {
margin: 20px;
border: 2px solid #0000ff; height: auto;
width: auto; float: right;
text-align: center; }
div.img img {
display: inline; margin: 3px;
border: 1px solid #ffffff; }
div.img a:hover img {border: 1px solid #0000ff;} div.desc
{
text-align: center; font-weight: normal; width: 120px;
margin: 2px; }</style> </head> <br> <center>
<img src="http://indah-permata.co.cc/wp-content/HTML/Pcake.jpg" width="500" height="200" />
</center> </br> <body>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Handling Form</title> </head><body>
<center> <?php
//mebuat variabel
$nama=$_REQUEST['nama']; $email=$_REQUEST['email']; $gender=$_REQUEST['gender'];
(6)
$umur=$_REQUEST['umur'];
$komentar=$_REQUEST['komentar']; //menampilkan datayang diterima
echo "TERIMA KASIH TELAH MEMESAN<BR>"; echo "Nama : $nama<br>";
echo "Email : $email<br>";
echo "Jenis Kelamin : $gender<br>"; echo "Umur : $umur<br>";
echo "Komentar : <br>"; echo $komentar;
?>
</center> <br> <center> <img
src="http://kaveeshmanchanda.files.wordpress.com/2011/05/approved_red _stamp.png" width="470" height="200" />
</div> </center> </br>
<div id="footer" style="background-color:#FFA500;clear:both;text-align:center;">
TOKO KUE ONLINE</div> </div>
</body> <footer> </footer> </head> </html>