PEMBUATAN CMS E-COMMERCE UNTUK PENGELOLAAN BISNIS … · PEMBUATAN CMS E-COMMERCE UNTUK PENGELOLAAN...

perpustakaan.uns.ac.id digilib.uns.ac.id

commit to user

PEMBUATAN CMS E-COMMERCE UNTUK PENGELOLAAN BISNIS

TUGAS AKHIR

Diajukan Untuk Memenuhi Salah Satu Syarat Mencapai Gelar Ahli Madya

Program Diploma III Ilmu Komputer

Disusun oleh :

TRI WICAKSONO

NIM. M3108065

PROGRAM DIPLOMA III ILMU KOMPUTER

FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM

UNIVERSITAS SEBELAS MARET

2011


commit to user ii

HALAMAN PERSETUJUAN

PEMBUATAN CMS E-COMMERCE UNTUK PENGELOLAAN BISNIS

Disusun Oleh :

TRI WICAKSONO

NIM. M3108065

Tugas Akhir ini telah disetujui untuk dipertahankan

Di hadapan dewan penguji

pada tanggal ........................

Pembimbing

Muhammad Asri Safi'ie, S.Si

NIDN. 0603118103


commit to user

105


commit to user iv

ABSTRACT

Tri Wicaksono. 2011. CMS E-COMMERCE DEVELOPMENT FOR

BUSINESS MANAGEMENT. Diploma III Computer Program. InformaticsEngineering. Faculty of Mathematic and Natural Sciences. Sebelas MaretUniversity.

Business is an organization that sells goods or services to consumers orother businesses for profit. See opportunities to grow the business management isto be made with the system based webserver. Since the world growth of internetusers is increasing from year to year, especially the Indonesian state. To cope withthe demands that it needs to be made of a complex system to manage the business.

The purpose of this research is to create a business management system

that manages the Sell-Buy with E-Commerce technology. In accordance with thepurpose of research, the study uses data collection methods. The method used in

conducting the manufacture of E-Commerce CMS that is with interviews,documentation and literature. The program is created using a combination of web

programming languages XHTML, PHP, CSS3, JavaScript and jQuery, andMySQL to manage the database.

From interviews, documentation and literature, it can be concluded thate-commerce applications are made. Making CMS E-Commerce can simplify the

management of business on buying and selling of products.

Keywords: CMS, E-Commerce


commit to user v

ABSTRAK

Tri Wicaksono. 2011. PEMBUATAN CMS E-COMMERCE UNTUK

PENGELOLAAN BISNIS. Program Diploma III Ilmu Komputer, TeknikInformatika, Fakultas Matematika dan Ilmu Pengetahuan Alam, UniversitasSebelas Maret Surakarta.

Bisnis adalah suatu organisasi yang menjual barang atau jasa kepadakonsumen atau bisnis lainnya, untuk mendapatkan laba. Melihat peluang yang adauntuk menumbuhkan pengelolaan bisnis adalah dengan dibuat dengan sistemberbasis webserver. Karena didunia pertumbuhan pengguna internet makinmeningkat dari tahun ke tahun terutama negara Indonesia. Untuk mengatasi

tuntutan itu maka perlu dibuat sebuah sistem yang kompleks untuk mengelolabisnis.

Tujuan penelitian ini adalah membuat sistem pengelolaan bisnis yangbergerak di bidang Jual-Beli dengan pemanfaatan teknologi E-Commerce. Sesuai

dengan tujuan penelitian, maka penelitian ini menggunakan metode pengumpulandata. Metode yang digunakan dalam melakukan pembuatan CMS E-Commerce

yaitu dengan wawancara, dokumentasi dan studi pustaka. Program ini dibuatmenggunakan kombinasi bahasa pemrograman web XHTML, PHP, CSS3,

JavaScript dan jQuery serta MySQL untuk mengatur databasenya.Dari hasil wawancara, dokumentasi dan studi pustaka, dapat disimpulkan

bahwa aplikasi e-commerce yang dibuat. Pembuatan CMS E-Commerce dapatmempermudah pengelolaan bisnis di bidang jual beli produk.

Kata kunci : CMS, E-Commerce


commit to user vi

MOTTO

Tidak ada yang tidak mungkin, awali dengan imajinasi.

Mimpilah dulu sebelum berangan – angan, sempurnakan mimpi itu, jika sudah

maka realisasikan dalam tindakan yang nyata.


commit to user vii

PERSEMBAHAN

Karya ini dipersembahkan kepada :

1. Kedua orang tua serta segenap keluarga yang saya cintai dalam memberikandoa dan dukungannya.

2. Bapak Drs. Y. S. Palgunadi, M. Sc. selaku Ketua Program Diploma III TeknikInformatika Fakultas MIPA Universitas Sebelas Maret Surakarta.

3. Bapak Muhammad Asri Safi'ie, S.Si selaku dosen pembimbing yang telahmemberikan masukan, pengarahan dan petunjuk kepada saya.

4. Teman-teman jurusan Teknik Informatika angkatan 2008.

5. Orang-orang yang sudah menghisasi dan mewarnai dalam perjalanan hidupdan karirku.


commit to user viii

KATA PENGANTAR

Assalamualaikum Wr. Wb

Puji syukur serta ucapan terimakasih penulis panjatkan kehadirat Allah

SWT atas limpahan karunia, taufiq serta hidayah-Nya sehingga penulis dapat

menyelesaikan penulisan laporan Tugas Akhir dengan judul ”PEMBUATAN

CMS E-COMMERCE UNTUK PENGELOLAAN BISNIS”. Laporan ini disusun

sebagai salah satu syarat kelulusan Program Studi Diploma III Teknik Informatika

Fakultas MIPA Universitas Sebelas Maret Surakarta.

Penulis mengucapkan terima kasih kepada semua yang telah membantu

proses penyusunan laporan Tugas Akhir ini, sehingga proses penyusunan laporan

Tugas Akhir secara keseluruhan dapat dikerjakan dengan baik. Ucapan tulus

terima kasih penulis diberikan kepada :

1. Kedua orang tua penulis serta segenap keluarga yang penulis cintai yang

telah memberikan doa dan dukungannya.

2. Bapak Y.S. Palgunadi, M.Sc selaku Ketua Program Studi DIII Ilmu

Komputer Fakultas Matematika dan Ilmu Pengetahuan Alam Universitas

Sebelas Maret Surakarta.

3. Bapak Muhammad Asri Safi'ie, S.Si selaku dosen pembimbing yang telah

memberikan masukan, pengarahan dan petunjuk kepada penulis dalam

menyelesaikan laporan ini.

4. Sahabat-sahabatku serta semua rekan Mahasiswa Teknik Informatika

2008 yang telah banyak memeberikan semangat dalam penyusunan

laporan ini.

5. Semua pihak yang telah banyak membantu penulis dalam menyelesaikan

laporan ini yang tidak bisa disebutkan satu persatu.


commit to user ix

Semoga segala bentuk bantuan yang telah diberikan kepada penulis dalam

menyelesaikan laporan ini dapat menjadi amal baik dan mendapatkan balasan dari

Allah SWT serta laporan yang telah dibuat dapat bermanfaat bagi penulis

khususnya dan bagi pembaca umumnya.

Wassalamulaikum Wr. Wb

Surakarta, Juni 2011

Penulis


commit to user x

DAFTAR ISI

HALAMAN JUDUL ............................................................................................... i

HALAMAN PERSETUJUAN................................................................................ ii

HALAMAN PENGESAHAN ............................................................................... iii

HALAMAN ABSTRACT ..................................................................................... iv

HALAMAN INTISARI ........................................................................................ v

MOTTO ................................................................................................................. vi

HALAMAN PERSEMBAHAN .......................................................................... vii

KATA PENGANTAR ........................................................................................viii

DAFTAR ISI ......................................................................................................... x

DAFTAR TABEL ............................................................................................... xv

DAFTAR GAMBAR .......................................................................................... xvi

BAB I. PENDAHULUAN

1.1. Latar Belakang ..................................................................................... 1

1.2. Perumusan Masalah ............................................................................. 2

1.3. Batasan Masalah................................................................................... 2

1.4. Tujuan Manfaat Penelitian ................................................................... 2

1.5. Manfaat Penelitian .............................................................................. 2

1.6. Sistematika Penulisan ......................................................................... 3

BAB II. LANDASAN TEORI

2.1. CMS (Content Management System) ................................................... 4

2.2. E-Commerce ........................................................................................ 5

2.2.1. Sejarah Perkembangan ............................................................. 6

2.2.2. Faktor kunci sukses dalam E-Commerce ................................. 8

2.3. Basis Data ..........................................................................................4

2.3.1. MySQL .................................................................................9

2.4. Bahasa Pemrograman ......................................................................... 9

2.4.1. Hypertex PreProcessor (PHP) ............................................... 10


commit to user xi

2.4.2. XHTML (eXtensible HyperText Markup Language) ............ 11

2.4.3. CSS (Cascading Style Sheet) ................................................. 12

2.4.4. Javascript ............................................................................... 12

2.4.5. jQuery .................................................................................... 13

2.5. Flowchart ........................................................................................... 13

2.6. Data Flow Diagram (DFD) ............................................................... 15

2.7. Entity Relationship Diagram (ERD) ................................................. 16

BAB III. DESAIN DAN PERANCANGAN SISTEM

3.1. Bisnis Proses ...................................................................................... 19

3.2. Data Flow Diagram (DFD) ............................................................... 19

3.2.1. DFD Level 0 .......................................................................... 19

3.2.2. DFD Level 1 .......................................................................... 20

3.2.3. DFD Level 2 .......................................................................... 21

3.2.3.1. DFD Level 2 Mengelola Profile .............................. 21

3.2.3.2. DFD Level 2 Melakukan Order .............................. 21

3.2.3.3. DFD Level 2 Konfirmasi / Komplain Order ........... 22

3.2.3.4. DFD Level 2 Mengelola Laporan ............................ 22

3.2.3.5. DFD Level 2 Mengelola Produk ............................. 23

3.2.3.6. DFD Level 2 Mengelola News ............................... 23

3.2.3.7. DFD Level 2 Mengelola User ................................. 24

3.2.3.8. DFD Level 2 Mengelola Setting ............................. 24

3.2.3.9.

3.3. Flowchart ........................................................................................... 25

3.3.1. Flowchart Register................................................................. 25

3.3.2. Flowchart Login .................................................................... 26

3.3.3. Flowchart Edit Profil ............................................................. 27

3.3.4. Flowchart Pesan Produk ....................................................... 28

3.3.5. Flowchart Konfirmasi Order ................................................ 29

3.4. Entity Relationship Diagram (ERD) ................................................. 30

3.5. Schema Diagram ............................................................................... 31

3.6. Rancangan Database .......................................................................... 32


commit to user xii

3.6.1. Tabel Badwords ..................................................................... 32

3.6.2. Tabel Bank ............................................................................. 32

3.6.3. Tabel Comment ..................................................................... 32

3.6.4. Tabel Complain ..................................................................... 33

3.6.5. Tabel Delivery ..................................................................... 33

3.6.6. Tabel Kategori ..................................................................... 34

3.6.7. Tabel Mail ............................................................................. 34

3.6.8. Tabel News ............................................................................ 35

3.6.9. Tabel Orders .......................................................................... 35

3.6.10. Tabel Orders_Detail .............................................................. 36

3.6.11. Tabel Orders_Tempt .............................................................. 37

3.6.12. Tabel Produk .......................................................................... 37

3.6.13. Tabel Rekening ...................................................................... 38

3.6.14. Tabel Settings ...................................................................... 38

3.6.15. Tabel Settings_Widget .......................................................... 38

3.6.16. Tabel Shipping ....................................................................... 39

3.6.17. Tabel Statistik ....................................................................... 39

3.6.18. Tabel Tag ............................................................................... 39

3.6.19. Tabel Users ........................................................................... 40

BAB IV. IMPLEMENTASI DAN ANALISA

4.1. Analisa ............................................................................................... 41

4.2. Daftar Fitur CMS E-Commerse ....................................................... 41

4.3. Hak Akses CMS E-Commerse .......................................................... 46

4.4. Site Map ............................................................................................ 48

4.5. Desain Tampilan ................................................................................ 49

4.5.1. Layout Halaman Depan ......................................................... 49

4.5.2. Layout Halaman Mobile......................................................... 49

4.5.3. Layout Halaman Pengelola .................................................... 50

4.6. Implementasi Sistem .......................................................................... 51

4.6.1. Homepage .............................................................................. 51

4.6.1.1. Halaman Home ........................................................ 51


commit to user xiii

4.6.1.2. Halaman Lihat Produk ............................................ 52

4.6.1.3. Halaman Detail Produk .......................................... 53

4.6.1.4. Halaman Lihat News .............................................. 54

4.6.1.5. Halaman Detail News .............................................. 55

4.6.1.6. Menubar .................................................................. 56

4.6.1.7. Tampilan Form Pencarian AllinOne ....................... 56

4.6.1.8. Login, Forgot Password dan Signup Form ............. 58

4.6.1.9. Halaman Profil ........................................................ 66

4.6.1.10.Halaman Edit Profile .............................................. 67

4.6.1.11.Halaman Messages / Mail ....................................... 68

4.6.1.12.Shopping Cart .......................................................... 69

4.6.1.13.Selesai Belanja ........................................................ 70

4.6.1.14.My Order .................................................................. 71

4.6.1.15.My Order .................................................................. 73

4.6.1.16.Widget Kiri .............................................................. 71

4.6.1.17.Widget Kanan .......................................................... 75

4.6.1.18.Bantuan / FAG ........................................................ 77

4.6.1.19.Kontak ..................................................................... 77

4.6.1.20.Halaman Mobile ...................................................... 78

4.6.2. Halaman Mobile .................................................................... 78

4.6.3. Halaman Pengelola ................................................................ 79

4.6.3.1. Halaman Login ........................................................ 79

4.6.3.2. Halaman Dashboard ................................................ 79

4.6.3.3. Menubar .................................................................. 80

4.6.3.4. Status Pengelola ...................................................... 80

4.6.3.5. Manajemen Payment ............................................... 80

4.6.3.6. Daftar Bank ............................................................. 81

4.6.3.7. Daftar Rekening ...................................................... 81

4.6.3.8. Manajemen Delivery ............................................... 82

4.6.3.9. Manajemen Shipping ............................................... 82

4.6.3.10.Manajemen Settings ................................................. 83


commit to user xiv

4.6.3.11.General Settings ...................................................... 83

4.6.3.12.Themes Settings ....................................................... 84

4.6.3.13.Upload Settings ....................................................... 85

4.6.3.14.Paging Settings ........................................................ 85

4.6.3.15.Comment Settings .................................................... 86

4.6.3.16.Mobile Site ............................................................... 86

4.6.3.17.Bantuan ................................................................... 87

4.6.3.18.Syarat & Ketentuan ................................................. 87

4.6.3.19.Kontak Kami ........................................................... 88

4.6.3.20.Statistik .................................................................... 88

4.6.3.21.Smart Navigation .................................................... 89

4.6.3.22.News ........................................................................ 89

4.6.3.23.Produk ..................................................................... 91

4.6.3.24.Rating ....................................................................... 93

4.6.3.25.Kategori ................................................................... 93

4.6.3.26.Tag ........................................................................... 94

4.6.3.27.Komentar ................................................................. 95

4.6.3.28.C&C (Confirmation & Complain) ........................... 95

4.6.3.29.Order ....................................................................... 97

4.6.3.30.Laporan ................................................................. 100

4.6.3.31.Manajemen User ................................................... 102

BAB V. PENUTUP

1.1. Kesimpulan ...................................................................................... 105

1.2. Saran ............................................................................................... 105

DAFTAR PUSTAKA ........................................................................................ 106


commit to user xv

DAFTAR TABEL

Nomor Halaman

2.1 Notasi Flowcart 14

2.2 Notasi Kesatuan Keluar DFD 16

2.3 Notasi ERD 17

3.1 Tabel Badwords 32

3.2 Tabel Bank 32

3.3 Tabel Comment 33

3.4 Tabel Complain 33

3.5 Tabel Delivery 33

3.6 Tabel Kategori 34

3.7 Tabel Mail 34

3.8 Tabel News 35

3.9 Tabel Orders 36

3.10 Tabel Orders_Detail 36

3.11 Tabel Orders_Temp 37

3.12 Tabel Produk 37

3.13 Tabel Rekening 38

3.14 Tabel Settings 38

3.15 Tabel Settings_Widget 38

3.16 Tabel Shipping 39

3.17 Tabel Statistik 39

3.18 Tabel Tag 39

3.19 Tabel Users 40

4.1 Daftar Hak Akses CMS E-Commerce 47


commit to user xvi

DAFTAR GAMBAR

Nomor Halaman

3.1 DFD Level 0 Sistem CMS E-Commerce 19

3.2 DFD Level 1 Sistem CMS E-Commerce 20

3.3 DFD Level 2 Mengelola Profil 21

3.4 DFD Level 2 Melakukan Order 21

3.5 DFD Level 2 Konfirmasi / Komplain Order 22

3.6 DFD Level 2 Konfirmasi / Komplain Order 22

3.7 DFD Level 2 Mengelola Produk 23

3.8 DFD Level 2 Mengelola News 23

3.9 DFD Level 2 Mengelola User 24

3.10 DFD Level 2 Mengelola Setting 24

3.11 Flow Chart Register 25

3.12 Flow Chart Login Sistem CMS E-Commerce 26

3.13 Flow Chart Edit Profil Sistem CMS E-Commerce 27

3.14 Flow Chart Pesan Produk Sistem CMS E-Commerce 28


3.16 ERD Sistem CMS E-Commerce 30

3.17 Schema Diagram Sistem CMS E-Commerce 31



4.3 Site Map Halaman Depan CMS E-Commerce 48

4.4 Site Map Halaman PengelolaCMS E-Commerce 48

4.5 Layout Halaman Depan CMS E-Commerce 49

4.6 Layout Halaman Mobile CMS E-Commerce 49

4.7 Layout Halaman PengelolaCMS E-Commerce 50

4.8 Halaman Depan CMS E-Commerce 51


commit to user xvii

4.9 Halaman Lihat Produk CMS E-Commerce 52

4.10 Halaman Detail Produk CMS E-Commerce 53

4.11 Halaman Lihat News CMS E-Commerce 54

4.12 Halaman Detail News CMS E-Commerce 55

4.13 Menubar Sebelum Login CMS E-Commerce 56

4.14 Menubar Sesudah Login CMS E-Commerce 56

4.15 Pencarian AllinOne CMS E-Commerce 56

4.16 Hasil Pencarian AllinOne CMS E-Commerce 57

4.17 Tampilan Form Login CMS E-Commerce 58

4.18 Flow Chart Login Sistem CMS E-Commerce 59

4.19 Alert Login Gagal CMS E-Commerce 60

4.20 Alert Password Salah CMS E-Commerce 60

4.21 Tampilan Login Berhasil CMS E-Commerce 61

4.22 Flow Chart Register 63

4.23 Tampilan Cek Data Pengguna Signup CMS E-Commerce 64

4.24 Tampilan Sudah Ada Data Pengguna Signup CMS E-Commerce 64

4.25 Tampilan Data Pengguna Tersedia Signup CMS E-Commerce 64

4.26 Tampilan Biodata Signup CMS E-Commerce 65

4.27 Tampilan Summary Signup CMS E-Commerce 66

4.28 Halaman Profil CMS E-Commerce 66

4.29 Halaman Edit Profile CMS E-Commerce 67

4.30 Halaman Messages / Mail CMS E-Commerce 68

4.31 Halaman Shopping Cart CMS E-Commerce 69

4.32 Halaman Status Shopping Cart CMS E-Commerce 69

4.33 Halaman Selesai Belanja CMS E-Commerce 70

4.34 Halaman My Order CMS E-Commerce 71

4.35 Halaman Detail My Order CMS E-Commerce 72

4.36 Widget Kategori CMS E-Commerce 73

4.37 Widget Tag CMS E-Commerce 73

4.38 Widget Produk Terbaru CMS E-Commerce 74

4.39 Widget Komentar Terbaru CMS E-Commerce 74


commit to user xviii

4.40 Widget Join Us CMS E-Commerce 75

4.41 Widget Best Seller CMS E-Commerce 75

4.42 Widget Our Rating CMS E-Commerce 75

4.43 Widget Recommended Product CMS E-Commerce 76

4.44 Widget Statistik CMS E-Commerce 76

4.45 Halaman Bantuan CMS E-Commerce 77

4.46 Halaman Kontak CMS E-Commerce 77

4.47 Halaman Mobile CMS E-Commerce 78

4.48 Halaman Login Form Pengelola CMS E-Commerce 79

4.49 Halaman Dashboard Pengelola CMS E-Commerce 79

4.50 Tampilan Menubar Pengelola CMS E-Commerce 80

4.51 Status Pengelola CMS E-Commerce 80

4.52 Manajemen Payment Pengelola CMS E-Commerce 80

4.53 Daftar Bank Pengelola CMS E-Commerce 81

4.54 Daftar Rekening Pengelola CMS E-Commerce 81

4.55 Daftar Delivery Pengelola CMS E-Commerce 82

4.56 Daftar Shipping Pengelola CMS E-Commerce 82

4.57 Daftar Shipping Pengelola CMS E-Commerce 83

4.58 General Settings Pengelola CMS E-Commerce 83

4.59 Themes Settings Tampilan Pengelola CMS E-Commerce 84

4.60 Themes Settings Widget Pengelola CMS E-Commerce 84

4.61 Upload Settings Pengelola CMS E-Commerce 85

4.62 Paging Settings Pengelola CMS E-Commerce 85

4.63 Comment Settings Pengelola CMS E-Commerce 86

4.64 MobileSite Settings Pengelola CMS E-Commerce 86

4.65 Bantuan Pengelola CMS E-Commerce 87

4.66 Syarat & Ketentuan Pengelola CMS E-Commerce 87

4.67 Kontak Kami Pengelola CMS E-Commerce 88

4.68 Kontak Kami Pengelola CMS E-Commerce 88

4.69 Smart Navigation CMS E-Commerce 89

4.70 News Pengelola CMS E-Commerce 89


commit to user xix

4.71 Tampilan Tab News Pengelola CMS E-Commerce 90

4.72 Tampilan Add & Edit News Pengelola CMS E-Commerce 90

4.73 Tampilan Produk Pengelola CMS E-Commerce 91

4.74 Tampilan Tab Produk Pengelola CMS E-Commerce 91

4.75 Tampilan Add & Edit Produk Pengelola CMS E-Commerce 92

4.76 Tampilan Advanced View Produk Pengelola CMS E-Commerce 92

4.77 Tampilan Rating Produk Pengelola CMS E-Commerce 93

4.78 Tampilan Kategori Produk Pengelola CMS E-Commerce 93

4.79 Tampilan Kategori News Pengelola CMS E-Commerce 93

4.80 Tampilan Add & Edit Kategori Pengelola CMS E-Commerce 94

4.81 Tampilan Tag Pengelola CMS E-Commerce 94

4.82 Tampilan Add & Edit Tag Pengelola CMS E-Commerce 94

4.83 Tampilan Komentar Pengelola CMS E-Commerce 95

4.84 Tampilan C&C Pengelola CMS E-Commerce 96

4.85 Smart Navigation Order Pengelola CMS E-Commerce 97

4.86 Tampilan List Order Pengelola CMS E-Commerce 97

4.87 Tampilan Detail Order Pengelola CMS E-Commerce 98

4.88 Tampilan Advanced View Order Pengelola CMS E-Commerce 99

4.89 Tampilan Laporan Pengelola CMS E-Commerce 100

4.90 Tampilan Hasil Laporan Total Pengelola CMS E-Commerce 100

4.91 Tampilan Hasil Laporan Total Versi PDF Pengelola CMS 101

E-Commerce

4.92 Tampilan Hasil Laporan Penjualan Produk Pengelola CMS 101

E-Commerce

4.93 Tampilan Hasil Laporan Penjualan Produk Versi PDF 102

Pengelola CMS E-Commerce

4.94 Tampilan Manajemen User Pengelola CMS E-Commerce 102

4.95 Tampilan Daftar Pelanggan Pengelola CMS E-Commerce 103

4.96 Tampilan Daftar Staff Pengelola CMS E-Commerce 103

4.97 Tampilan Daftar Admin Pengelola CMS E-Commerce 104

4.98 Tampilan Super Admin Pengelola CMS E-Commerce 104


commit to user

1

BAB I

PENDAHULUAN

1.1. Latar Belakang Masalah

Bisnis adalah suatu organisasi yang menjual barang atau jasa kepada

konsumen atau bisnis lainnya, untuk mendapatkan laba. Dalam ekonomi,

dimana kebanyakan bisnis dimiliki oleh pihak swasta, bisnis dibentuk untuk

mendapatkan profit dan meningkatkan kemakmuran para pemiliknya.

Pemilik dan operator dari sebuah bisnis mendapatkan imbalan sesuai dengan

waktu, usaha, atau kapital yang mereka berikan. Namun tidak semua bisnis

mengejar keuntungan seperti ini, misalnya bisnis koperatif yang bertujuan

meningkatkan kesejahteraan semua anggotanya atau institusi pemerintah

yang bertujuan meningkatkan kesejahteraan rakyat.

Dengan makin pesatnya pertumbuhan lahan bisnis di dunia maka

diperlukannya sebuah pengelolaan yang tepat agar semua hal yang

bersangkutan tidak ada yang mengalami kesalahan atau kegagalan. Pada

jaman dahulu pengelolaan bisnis masih menggunakan metode yang masih

primitif dan menyita banyak pikiran dan waktu. Tuntutan Globalisai

memaksa kita untuk dapat mengikuti perkembangan jaman, tidak lain juga

dalam pengelolaan bisnis harus ikut berkembang dan mulai beranjak ke

pengelolaan dengan metode modern yakni dengan E-Commerce / Electronic

Commerce / Elektronik Dagang.

Melihat peluang yang ada untuk menumbuhkan sistem ini adalah

dengan dibuat dengan berbasis webserver. Karena didunia pertumbuhan

pengguna internet makin meningkat dari tahun ke tahun terutama negara

Indonesia. Semua orang kini hampir bisa mengakses internet meski tidak

harus memiliki kommputer dan koneksi internet, dengan handpone mereka

mereka sudah bisa menikmati internet.


commit to user

2

Untuk mengatasi tuntutan itu maka perlu dibuat sebuah sistem yang

kompleks untuk mengelola bisnis. Disini sistem yang akan dibuat adalah

sistem pengelolaan bisnis yang bergerak di bidang Jual-Beli produk.

Dengan ditanam beberapa fitur yang menunjang segala kegiatan bisnis ini

meliputi distribusi produk, penjualan, pembelian, manajemen stok, pesanan

/ order, data pelanggan, multiuser handle, laporan transaksi, serta fitur-fitur

lainnya yang membantu dalam pengelolaan bisnis yang lebih otomais,

terorganisir dan rapi.

1.2. Rumusan Masalah

Berdasarkan latar belakang masalah tersebut maka perumusan

masalah yang dibahas adalah "Bagaimana Membuat CMS E-Commerce?"

yang memudahkan dalam pengelolaan bisnis di bidang jual beli produk.

1.3. Pembatasan Masalah

Dalam pembuatan tugas akhir ini penulis akan membuat CMS

(Content Management System) E-Commerce yang membantu kegiatan

pengelolaan bisnis di bidang jual beli produk.

1.4. Tujuan Penelitian

Membuat sebuah sistem yang dapat mengelola aktifitas bisnis dengan

pemanfaatan teknologi E-Commerce. Yang dimaksud pemanfaatan E-

Commerce adalah melakukan aktifitas dunia bisnis dengan pemanfaatan

media digital guna mempermudah pekerjaan yang sebelumnya

menggunakan cara konvensional menjadi modern.

1.5. Manfaat Penelitian

Adapun manfaat dari pembuatan CMS E-Commerce ini adalah

sebagai berikut :

a. Dibangun berbasis web dengan bahasa pemrograman PHP dilengkapi

XHTML, CSS, Javascript dan JQuery sehingga dapat dijalankan


commit to user

3

berbagai platform (multi-platform) dengan tampilan yang bagus dan

tingat kompleksitas yang tinggi.

b. Mempercepat dan menghemat waktu transaksi antara konsumen dan

produsen produk.

c. Meningkatkan akurasi perhitungan transaksi.

d. Admininistrator akan dimudahkan dalam mengelola bisnis dengan CMS

E-Commerce ini.

1.6. Sistematika Penulisan

Dalam laporan ini, terdapat lima bab yang masing-masing akan diuraikan

secara singkat dalam sistematika penulisan sebagai berikut:

a. BAB I PENDAHULUAN

Bab ini merupakan bab awal dalam laporan penelitian ini. Bab ini

berisi latar belakang masalah, perumusan masalah, batasan

masalah, tujuan dan manfaat, metodologi penelitian, serta sistematika

penelitian.

b. BAB II LANDASAN TEORI

Bab ini memuat tinjauan pustaka teori-teori yang disajikan dalam

landasan teori hanyalah teori yang mendukung pembuatan CMS E-

Commerce.

c. BAB III DESAIN DAN PERANCANGAN

Bab ini memuat data-data yang diperlukan dalam perancangan sistem,

yaitu Flowchart, Context Diagram, Data Flow Diagram, Entity

Relathionship Diagram, Schema Diagram , desain database, dan desain

tampilan.

d. BAB IV IMPLEMENTASI DAN ANALISA

Bab ini berisi tentang langkah dan hasil analisa yang disajikan dalam

bentuk tabel, gambar dan keterangannya.

e. BAB IV PENUTUP

Bab ini berisi kesimpulan dan saran.


commit to user

4

BAB II

LANDASAN TEORI

2.1. CMS (Content Management System)

Menurut http://id,wikipedia,org/wiki/sistem_manajemen_konten,

Content Management System disingkat CMS adalah perangkat lunak yang

memungkinkan seseorang untuk menambahkan dan/atau memanipulasi

(mengubah) isi dari suatu situs web. Umumnya, sebuah CMS terdiri dari dua

elemen:

a. Aplikasi Manajemen Isi (Content Management Application [CMA])

b. Aplikasi Pengiriman Isi (Content Delivery Application [CDA]).

Elemen CMA memperbolehkan si manajer isi -yang mungkin tidak

memiliki pengetahuan mengenai HTML (HyperText Markup Language)-,

untuk memenej pembuatan, modifikasi, dan penghapusan isi dari suatu situs

Web tanpa perlu memiliki keahlian sebagai seorang Webmaster. Elemen

CDA menggunakan dan menghimpun informasi-informasi yang sebelumnya

telah ditambah, dikurangi atau diubah oleh si empunya situs web untuk

meng-update atau memperbaharui situs web tersebut. Kemampuan atau fitur

dari sebuah sistem CMS berbeda-beda, walaupun begitu, kebanyakan dari

software ini memiliki fitur publikasi berbasis web, manajemen format,

kontrol revisi, pembuatan index, pencarian, dan pengarsipan.

Berikut pemanfaatan CMS:

a. Website perusahaan, bisnis, organisasi atau komunitas.

b. Portal

c. Galeri foto

d. Aplikasi E-Commerce.

e. Mengelola website pribadi / blog.

f. Dan lain-lain.


commit to user

5

2.2. E-Commerce

Menurut http://id.wikipedia.org/wiki/perdagangan_elektronik,

perdagangan elektronik atau E-Commerce (bahasa Inggris: Electronic

Commerce, disingkat menjadi E-Commerce) adalah penyebaran, pembelian,

penjualan, pemasaran barang dan jasa melalui sistem elektronik seperti

internet atau televisi, www, atau jaringan komputer lainnya. E-Commerce

dapat melibatkan transfer dana elektronik, pertukaran data elektronik, sistem

manajemen inventori otomatis, dan sistem pengumpulan data otomatis.

Industri teknologi informasi melihat kegiatan E-Commerce 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-Commerce merupakan bagian dari E-Business, di mana cakupan E-

Business lebih luas, tidak hanya sekedar perniagaan tetapi mencakup juga

pengkolaborasian mitra bisnis, pelayanan nasabah, lowongan pekerjaan dll.

Selain teknologi jaringan www, E-Commerce juga memerlukan teknologi

basisdata (databases), e-surat atau surat elektronik (e-mail), dan bentuk

teknologi non komputer yang lain seperti halnya sistem pengiriman barang,

dan alat pembayaran untuk E-Commerce ini.

Pertama kali diperkenalkan pada tahun 1994 pada saat pertama kali

banner-elektronik dipakai untuk tujuan promosi dan periklanan di suatu

halaman web (website). Menurut Riset Forrester, perdagangan elektronik

menghasilkan 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.

E-Commerce Dapat melibatkan transfer dana elektronik, pertukaran

data elektronik, sistem manajemen inventori otomatis, dan sistem


commit to user

6

pengumpulan data otomatis. Industri teknologi informasi melihat kegiatan

E-Commerce 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.

2.2.1. Sejarah Perkembangan

Istilah "perdagangan elektronik" telah berubah sejalan dengan

waktu. Awalnya, perdagangan elektronik berarti pemanfaatan

transaksi komersial, seperti penggunaan EDI untuk mengirim

dokumen komersial seperti pesanan pembelian atau invoice secara

elektronik.

Pada awalnya ketika web mulai terkenal di masyarakat pada

1994, banyak jurnalis memperkirakan bahwa E-Commerce akan

menjadi sebuah sektor ekonomi baru. Namun, baru sekitar empat

tahun kemudian protokol aman seperti HTTPS memasuki tahap

matang dan banyak digunakan. Antara 1998 dan 2000 banyak bisnis

di AS dan Eropa mengembangkan situs web perdagangan ini.

E-Commerce merupakan bagian dari E-Business, di mana

cakupan E-Business lebih luas, tidak hanya sekedar perniagaan tetapi

mencakup juga pengkolaborasian mitra bisnis, pelayanan nasabah,

lowongan pekerjaan dll. Selain teknologi jaringan www, E-

Commerce juga memerlukan teknologi basisdata atau pangkalan data

(databases), e-surat atau surat elektronik (e-mail), dan bentuk

teknologi non komputer yang lain seperti halnya sistem pengiriman

barang, dan alat pembayaran untuk E-Commerce ini.


commit to user

7

E-Commerce pertama kali diperkenalkan pada tahun 1994

pada saat pertama kali banner-elektronik dipakai untuk tujuan

promosi dan periklanan di suatu halaman-web (website). Menurut

Riset Forrester, perdagangan elektronik menghasilkan 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.

Istilah "perdagangan elektronik" telah berubah sejalan dengan

waktu. Awalnya, perdagangan elektronik berarti pemanfaatan

transaksi komersial, seperti penggunaan EDI untuk mengirim

dokumen komersial seperti pesanan pembelian atau invoice secara

elektronik.

Kemudian dia berkembang menjadi suatu aktivitas yang

mempunya istilah yang lebih tepat "perdagangan web" - pembelian

barang dan jasa melalui World Wide Web melalui server aman

(HTTPS), protokol server khusus yang menggunakan enkripsi untuk

merahasiakan data penting pelanggan.

Pada awalnya ketika web mulai terkenal di masyarakat pada

1994, banyak jurnalis memperkirakan bahwa E-Commerce akan

menjadi sebuah sektor ekonomi baru. Namun, baru sekitar empat

tahun kemudian protokol aman seperti HTTPS memasuki tahap

matang dan banyak digunakan. Antara 1998 dan 2000 banyak bisnis

di AS dan Eropa mengembangkan situs web perdagangan ini

(Sumber : Wikipedia.Org).


commit to user

8

2.2.2. Faktor kunci sukses dalam E-Commerce

Dalam banyak kasus, sebuah perusahaan E-Commerce bisa

bertahan tidak hanya mengandalkan kekuatan produk saja, tapi

dengan adanya tim manajemen yang handal, pengiriman yang tepat

waktu, pelayanan yang bagus, struktur organisasi bisnis yang baik,

jaringan infrastruktur dan keamanan, desain situs web yang bagus,

beberapa faktor yang termasuk:

1. Menyediakan harga kompetitif

2. Menyediakan jasa pembelian yang tanggap, cepat, dan ramah.

3. Menyediakan informasi barang dan jasa yang lengkap dan jelas.

4. Menyediakan banyak bonus seperti kupon, penawaran istimewa,

dan diskon.

5. Memberikan perhatian khusus seperti usulan pembelian.

6. Menyediakan rasa komunitas untuk berdiskusi, masukan dari

pelanggan, dan lain-lain.

7. Mempermudah kegiatan perdagangan

(Sumber : Wikipedia.Org).

2.3. Basis Data

Menurut http://id.wikipedia.org/wiki/basis_data, basis data

(database) atau sering pula dieja basisdata, adalah kumpulan informasi yang

disimpan di dalam komputer secara sistematik sehingga dapat diperiksa

menggunakan suatu program komputer untuk memperoleh informasi dari

basis data tersebut. Perangkat lunak yang digunakan untuk mengelola dan

memanggil kueri (query) basis data disebut sistem manajemen basis data

(Database Management System/DBMS).


commit to user

9

2.3.1. MySQL

Menurut Kadir Abdul, MySQL tergolong sebagai DBMS

yang bermanfaat untuk mengelola data dengan cara yang sangat

fleksibel dan cepat. Itulah sebabnya, istilah seperti tabel, baris dan

kolom digunakan pada MySQL. Pada MySQL, sebuah database

mengandung satu atau sejumlah tabel. Tabel terdiri atas sejumlah

baris dan setiap baris mengandung satu atau beberapa kolom.

MySQL adalah salah satu jenis database server yang sangat

terkenal. Kepopuleranya disebababkan MySQL menggunakan SQL

(Stuktur Query Language) sebagai bahasa dasar untuk mengakses

databasenya. Selain itu, ia bersifat Open Source (Anda tidak perlu

membayar untuk menggunakanya) pada pelbagai platform (kecuali

untuk jenis Enterprise, yang bersifat komersial). Perangkat lunak

MySQL sendiri bisa di-download dari http://www.mysql.com.

Sejumlah aktifitas yang didukung oleh MySQL adalah :

a. Menyimpan data ke dalam tabel

b. Menghapus data dalam tabel

c. Mengubah data dalam tabel

d. Mengambil data yangn tersimpan dalam tabel

e. Memungkinkan untuk memilih data tertentu yang diambil

f. Memungkinkan untuk melakukan pengaturan hak akses

terhadap data

2.4. Bahasa Pemrograman

Menurut http://id.wikipedia.org/wiki/bahasa_pemrograman bahasa

pemrograman, atau sering diistilahkan juga dengan bahasa komputer, adalah

teknik komando/instruksi standar untuk memerintah komputer. Bahasa

pemrograman ini merupakan suatu himpunan dari aturan sintaks dan

semantik yang dipakai untuk mendefinisikan program komputer. Bahasa ini

memungkinkan seorang programmer dapat menentukan secara persis data

mana yang akan diolah oleh komputer, bagaimana data ini akan


commit to user

10

disimpan/diteruskan, dan jenis langkah apa secara persis yang akan diambil

dalam berbagai situasi.

2.4.1. Hypertex PreProcessor (PHP)

Menurut http://en.wikipedia.org/wiki/php, PHP merupakan

kependekan dari kata Hypertext Prepocessor. PHP tergolong sebagai

bahasa pemrograman yang berbasis server (server side scripting). Ini

berarti bahwa semua script PHP diletakkan di server dan

diterjemahkan oleh web server terlebih dahulu, kemudian hasil

terjemahan itu dikirimkan ke browser client. Secara teknologi,

bahasa pemrograman PHP memiliki kesamaan dengan bahasa ASP

(Active Server Page), Cold Fusion, JSP (Java Server Page) ataupun

Perl.

PHP yang merupakan bahasa pemrograman berbasis web

yang memiliki kemampuan untuk memproses data dinamis. PHP

dikatakan sebagai sebuah server-side embedded script language

artinya sintaks-sintaks dan perintah yang kita berikan akan

sepenuhnya dijalankan oleh server tetapi disertakan pada

halaman HTML biasa. Aplikasi-aplikasi yang dibangun oleh PHP

pada umumnya akan memberikan hasil pada web browser, tetapi

prosesnya secara keseluruhan dijalankan di server. Pada prinsipnya

server akan bekerja apabila ada permintaan dari client. Client

menggunakan kode-kode PHP untuk mengirimkan permintaan

ke server. Sifat sever side ini membuat pengerjaan skrip

tersebut dikerjakan di server sedangkan yang dikirim kepada

browser adalah hasil proses dari skrip tersebut yang sudah

terbentuk HTML.

Server akan melakukan hal-hal sebagai berikut ketika

menggunakan PHP sebagai server-side embedded script language :

a. Membaca permintaan dari client/browser

b. Mencari halaman/page di server


commit to user

11

c. Melakukan instruksi yang diberikan oleh PHP untuk

melakukan modifikasi pada halaman/page

d. Mengirim kembali halaman tersebut kepada client melalui

internet atau intranet.

Sifat server side ini membuat pengerjaan skrip tersebut

dikerjakan di server sedangkan yang dikirim kepada browser adalah

hasil proses dari skrip Keunggulan dari sifatnya yang server side

tersebut adalah :

a. Tidak diperlukan adanya kompatibilitas browser atau harus

menggunakan browser tertentu, karena server lah yang akan

mengerjakan skrip tersebut. Hasil yang dikirimkan kembali

ke browser biasanya dalam bentuk teks ataupun gambar

sehingga dapat dikenali oleh browser apapun.

b. Dapat memanfaatkan sumber-sumber aplikasi yang dimiliki

oleh server. Contoh hubungan kedalam database.

c. Skrip asli tidak dapat dilihat sehingga keamanan lebih

terjamin.

2.4.2. XHTML (eXtensible HyperText Markup Language)

Menurut http://id.wikipedia.org/wiki/Extensible_hypertext_

markup_language, XHTML merupakan singkatan dari eXtensible

HyperText Markup Language. XHTML merupakan bentuk

reformulasi dari HTML menggunakan paradigma XML.

XHTML adalah bahasa markup penerus dan pengembangan

dari HTML yang memiliki kemampuan yang kurang lebih mirip

HTML, tapi dengan aturan sintaks yang lebih ketat. HTML

merupakan aplikasi dari SGML (Standard Generalized Markup

Language) yang sangat fleksibel, sedangkan XHTML adalah

aplikasi dari XML, turunan SGML yang lebih terbatas.

Karena XHTML harus memiliki keteraturan-bentuk

(mengikuti sintaks yang tepat), dokumen XHTML dapat diproses


commit to user

12

otomatis dengan menggunakan standar pemroses XML - tidak

seperti HTML yang membutuhkan pemroses yang cukup sulit dan

kompleks. XHTML dapat dianggap sebagai perpaduan antara

HTML dan XML karena merupakan formulasi ulang HTML dalam

bentuk XML. XHTML 1.0 telah menjadi rekomendasi W3C atau

World Wide Web Consortium pada tanggal 26 Januari 2000.

2.4.3. CSS (Cascading Style Sheet)

Menurut http://id.wikipedia.org/wiki/Cascading_Style_

Sheets, Cascading Style Sheet (CSS) merupakan salah satu bahasa

pemrograman web untuk mengendalikan beberapa komponen

dalam sebuah web sehingga akan lebih terstruktur dan seragam.

Sama halnya styles dalam aplikasi pengolahan kata seperti

Microsoft Word yang dapat mengatur beberapa style, misalnya

heading, subbab, bodytext, footer, images, dan style lainnya untuk

dapat digunakan bersama-sama dalam beberapa berkas (file). Pada

umumnya CSS dipakai untuk memformat tampilan halaman web

yang dibuat dengan bahasa HTML dan XHTML.

CSS dapat mengendalikan ukuran gambar, warna bagian

tubuh pada 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 adalah

bahasa style sheet yang digunakan untuk mengatur tampilan

dokumen. Dengan adanya CSS memungkinkan kita untuk

menampilkan halaman yang sama dengan format yang berbeda.

2.4.4. Javascript

Menurut http://en.wikipedia.org/wiki/Javascript, JavaScript

adalah bahasa skrip yang populer di internet dan dapat bekerja di

sebagian besar penjelajah web populer seperti Internet Explorer


commit to user

13

(IE), Mozilla Firefox, Netscape dan Opera. Kode JavaScript dapat

disisipkan dalam halaman web menggunakan tag SCRIPT.

2.4.5. jQuery

Menurut http://en.wikipedia.org/wiki/JQuery, jQuery adalah

library JavaScript kecil bersumber terbuka yang menekankan pada

interaksi antara JavaScript dan HTML. Sintaks jQuery dirancang

untuk memudahkan navigasi dokumen, DOM elemen, membuat

animasi , menangani peristiwa , dan mengembangkan aplikasi

Ajax. jQuery juga menyediakan kemampuan bagi para

pengembang untuk membuat plugin di atas JavaScript library.

Dengan menggunakan fasilitas ini, pengembang dapat menciptakan

abstraksi untuk tingkat interaksi rendah dan animasi, efek canggih

tingkat tinggi, widget-tema, dll. Hal ini memberikan kontribusi

untuk penciptaan halaman web yang kompleks dan dinamis.

2.5. Flowchart

Flowchart adalah penggambaran secara grafik dari langkah-langkah

dan urut-urutan prosedur dari suatu program. Flowchart menolong analist

dan programmer untuk memecahkan masalah kedalam segmen-segmen

yang lebih kecil dan menolong dalam menganalisis alternatif-alternatif lain

dalam pengoperasian.


commit to user

14

Tabel 2.1 Notasi Flowcart


commit to user

15

( Sumber : febriani.staff.gunadarma.ac.id/Downloads/files/5616/Flowchart.pdf)

2.6. Data Flow Diagram (DFD)

Menurut Fatansyah Ir, Data Flow Diagram adalah gambaran

keseluruhan kerja sistem secara garis besar. Merupakan repsentasi dari

sistem DFD menggunakan komponen dari sebuah sistem, alir data diantar

ke komponen-komponen asal, tujuan dan penyimpanan dari data tersebut.

DFD adalah suatu model logika data atau proses yang dibuat untuk

menggambarkan dari mana asal data dan kemana tujuan data yang keluar

dari sistem, dimana data disimpan, proses apa yang menghasilkan data

tersebut dan interaksi antara data yang tersimpan dan proses yang dikenakan

pada data tersebut. DFD menggambarkan penyimpanan data dan proses

yang mentransformasikan data. DFD menunjukkan hubungan antara data

pada sistem dan proses sistem. DFD level model ini menggambarkan

sistem sebagai jaringan kerja antar fungsi yang berhubungan satu


commit to user

16

dengan yang lain dengan aliran dan penyimpanan data. Sebagai alat

bantu desain sistem, model ini hanya memodelkan dari sudut pandang

fungsi.

Dalam DFD leveled ini akan terjadi penurunan level dimana dalam

penurunan level yang lebih rendah harus mampu merepresentasikan proses

tersebut ke dalam spesifikasi proses yang jelas. Jadi dalam DFD leveled

biasa dimulai dari DFD level 0 kemudian turun ke DFD level 1 dan

seterusnya. Setiap penurunan hanya dilakukan bila perlu.

Tabel 2.2 Notasi Kesatuan Keluar DFD

Yourdon/de Marco Arti

Entitas eksternal, dapat berupa orang/unit

terkait yang berinteraksi dengan sistem

tapi diluar sistem

Orang atau unit yang mempergunakan atau

melakukan transfromasi data. Komponen

fisik tidak diidentifikasikan.

aliran data Aliran data dengan arah khusus dari

sumber ke tujuan

Data source

Penyimpanan data atau tempat data direfer

oleh diproses

2.7. Entity Relationship Diagram (ERD)

Menurut Pressman (2002) Entity Relationship Diagram (ERD)

adalah notasi yang digunakan untuk melakukan aktivitas pemodelan

data. ERD adalah suatu model jaringan yang menggunakan susunan

data yang disimpan dalam sistem secara abstrak. Jadi, jelaslah bahwa

ERD ini berbeda dengan DFD yang merupakan suatu model jaringan fungsi

yang akan dilaksanakan oleh sistem, sedangkan ERD merupakan model

jaringan data yang menekankan pada struktur-struktur dan relationship data.

Entitas eksternal

proses


commit to user

17

Tabel 2.3 Notasi ERD

Simbol Arti

Entity

adalah obyek yang dapat dibedakan dalam

dunia nyata.

Weak Entity

adalah suatu Entity dimana keberadaan

dari entity tersebut

tergantung dari keberadaan entity lain.

Relationship

adalah hubungan yang terjadi antara satu

atau lebih entity.

Identifying Relationship

adalah relationship induknya

Atribut

adalah karakteristik dari entity atau

relationship, yang menyediakan penjelasan

detail tentang entity atau relationship

tersebut.

Atribut Primary Key

adalah atribut yang terdapat kunci

yang digunakan untuk menentukan suatu

entity secara unik.

Atribut Multivalue

adalah atribut yang memiliki sekelompok

nilai untuk setiap instan entity.


commit to user

18

Atribut Composite

adalah atribut yang terdiri dari beberapa

atribut yang lebih kecil yang mempunyai

arti tertentu.

Atribut Derivatif

atribut yang dihasilkan dari atribut yang

lain.


commit to user

19

BAB III

DESAIN DAN PERANCANGAN

3.1. Bisnis Proses

Konsep yang dipakai dalam pembuatan CMS E-Commerce ini yakni

menawarkan CMS ini kepada client dengan sistem sewa. Dengan dibuatkan

empat level pengguna yaitu SuperAdmin (pemilik CMS), Admin (pemilik

toko), Staff (pegawai toko) dan User (pelanggan toko) sehingga

pengelolaannya dapat dibedakan tiap level dan pemilik CMS ini tetap

memegang kendali penuh terhadap CMS yang dipakai oleh pemilik toko.

3.2. Data Flow Diagram (DFD)

3.2.1. DFD Level 0

Data Flow Diagram (DFD) Level 0 ini menggambarkan aliran

data secara umum yang terdapat dalam sistem CMS E-Commerce.

Gambar 3.1 : DFD Level 0 Sistem CMS E-Commerce


commit to user

20

3.1.2. DFD Level 1


data lanjutan dari DFD Level 0 yang terdapat dalam sistem CMS E-

Commerce.

Gambar 3.2 : DFD Level 1 Sistem CMS E-Commerce


commit to user

21

3.1.3. DFD Level 2


data dari proses pada dari DFD Level 1 yang terdapat dalam sistem

CMS E-Commerce.

3.1.3.1. DFD Level 2 Mengelola Profil

Gambar 3.3 : DFD Level 2 Mengelola Profil

3.1.3.2. DFD Level 2 Melakukan Order

Gambar 3.4 : DFD Level 2 Melakukan Order


commit to user

22

3.1.3.3. DFD Level 2 Konfirmasi / Komplain Order

Gambar 3.5 : DFD Level 2 Konfirmasi / Komplain Order

3.1.3.4. DFD Level 2 Mengelola Laporan

Gambar 3.6 : DFD Level 2 Konfirmasi / Komplain Order


commit to user

23

3.1.3.5. DFD Level 2 Mengelola Produk

Gambar 3.7 : DFD Level 2 Mengelola Produk

3.1.3.6. DFD Level 2 Mengelola News

Gambar 3.8 : DFD Level 2 Mengelola News


commit to user

24

3.1.3.7. DFD Level 2 Mengelola User

Gambar 3.9 : DFD Level 2 Mengelola User

3.1.3.8. DFD Level 2 Mengelola Setting

Gambar 3.10 : DFD Level 2 Mengelola Setting


commit to user

25

3.2. Flow Chart

3.2.1. Flow Chart Register

Gambar 3.11 : Flow Chart Register


commit to user

26

3.2.2. Flow Chart Login

Gambar 3.12 : Flow Chart Login Sistem CMS E-Commerce


commit to user

27

3.2.3. Flow Chart Edit Profil

Gambar 3.13 : Flow Chart Edit Profil Sistem CMS E-Commerce


commit to user

28

3.2.4. Flow Chart Pesan Produk

Gambar 3.14 : Flow Chart Pesan Produk Sistem CMS E-Commerce


commit to user

29

3.2.5. Flow Chart Konfirmasi Order



commit to user

30

3.3. ERD (Entity Relationship Diagram)

Gambar 3.16 : ERD Sistem CMS E-Commerce


commit to user

31

3.4. Schema Diagram

Gambar 3.17 : Schema Diagram Sistem CMS E-Commerce


commit to user

32

3.5. Rancangan Database

Database merupakan elemen penting yang digunakan untuk

menyimpan seluruh data dari sistem. Dalam pembuatan CMS E-Commerce,

memiliki rancangan database seperti berikut :

3.5.1. Tabel Badwords

Tabel badwords digunakan untuk melakukan sensor terhadap

komentar yang akan masuk ke system CMS E-Commerce.

Tabel 3.1 Tabel Badwords

3.5.2. Tabel Bank

Tabel bank digunakan untuk menambahkan nama bank pada

saat payment order pada CMS E-Commerce.

Tabel 3.2 Tabel Bank

3.5.3. Tabel Comment

Tabel comment digunakan untuk menyimpan semua

komentar yang masuk pada sistem CMS E-Commerce.


commit to user

33

Tabel 3.4 Tabel Comment

3.5.4. Tabel Complain

Tabel complain digunakan untuk menyimpan semua

konfirmasi dan complain pelangan terhadap data pesanan pada

CMS E-Commerce.

Tabel 3.5 Tabel Complain

3.5.5. Tabel Delivery

Tabel delivery digunakan untuk menambahkan biaya

tambahan tentang ongkos kirim ke tiap kota.

Tabel 3.6 Tabel Delivery


commit to user

34

3.5.6. Tabel Kategori

Tabel kategori digunakan untuk mengelompokkan produk

dan news kedalam kategori yang berbeda.

Tabel 3.7 Tabel Kategori

3.5.7. Tabel Mail

Tabel mail memungkinkan CMS E-Commerce melakukan

baca dan kirim Private Message antar pengguna.

Tabel 3.8 Tabel Mail


commit to user

35

3.5.8. Tabel News

Tabel news digunakan untuk menyimpan berita – berita

CMS E-Commerce.

Tabel 3.9 Tabel News

3.5.9. Tabel Orders

Tabel order adalah tabel utama yang berfungsi sebagai

penyimpanan data pesanan pelanggan terhadap barang / produk

yang akan dibeli.


commit to user

36

Tabel 3.10 Tabel Orders

3.5.10. Tabel Orders_Detail

Tabel order_detail digunakan untuk menyimpan produk –

produk yang ada dalam pesanan pelanggan.

Tabel 3.11 Tabel Orders_Detail


commit to user

37

3.5.11. Tabel Orders_Temp

Tabel order_temp digunakan sebagai penyimpanan sementara

pada saat pelanggan melakukan pesan produk (Melakukan Order /

Add to Cart).

Tabel 3.12 Tabel Orders_Temp

3.5.12. Tabel Produk

Tabel produk digunakan untuk menyimpan produk – produk

yang akan dipasarkan di CMS E-Commerce.

Tabel 3.13 Tabel Produk


commit to user

38

3.5.13. Tabel Rekening

Tabel rekening digunakan untuk menambahkan nomor

rekening dan atas nama pemilik rekening saat dilakukannya

pembayaran pesanan.

Tabel 3.14 Tabel Rekening

3.5.14. Tabel Settings

Tabel settings digunakan untuk menyimpan nilai – nilai yang

digunakan sebagai pengaturan dalam CMS E-Commerce. Tabel ini

tidak berelasi dengan tabel manapun karena sifatnya cumin

menyimpan value-value yang dipanggil pada saat tertentu.

Tabel 3.15 Tabel Settings

3.5.15. Tabel Settings_Widget

Tabel settings_widget digunakan untuk pengaturan widget /

sidebar CMS E-Commerce.

Tabel 3.16 Tabel Settings_Widget


commit to user

39

3.5.16. Tabel Shipping

Tabel shipping digunakan untuk menambahkan biaya durasi

pengiriman barang.

Tabel 3.17 Tabel Shipping

3.5.17. Tabel Statistik

Tabel statistik digunakan sebagai penyimpan data

pengunjung website guna dipakai sebagai counter hitstat CMS E-

Commerce.

Tabel 3.18 Tabel Statistik

3.5.18. Tabel Tag

Tabel tag digunakan sebagai penanda produk maupun news

sama halnya seperti kategori, akan tetapi produk dan news boleh

memiliki banyak tag

Tabel 3.19 Tabel Tag


commit to user

40

3.5.19. Tabel Users

Tabel users digunakan sebagai penyimpan data pelanggan,

staff, admin dan superadmin yang berinteraksi dalam CMS E-

Commerce.

Tabel 3.20 Tabel Users


commit to user

41

BAB IV

IMPLEMENTASI DAN ANALISA

4.1. Analisa

Pembuatan CMS E-Commerce ini pada dasarnya berfungsi sebagai media

pengelolaan bisnis terutama dalam bidang jual beli produk. Dengan ditanam

beberapa fitur pada CMS ini yang menunjang segala kegiatan bisnis ini meliputi

distribusi produk, penjualan, pembelian, manajemen stok, pesanan / order, data

pelanggan, multiuser handle, laporan transaksi, serta fitur-fitur lainnya yang

membantu dalam pengelolaan bisnis yang lebih otomatis, terorganisir dan rapi.

4.2. Daftar Firur CMS E-Commerce

Dalam sistem CMS ini terdapat banyak berbagai fitur – fitur

diantaranya sebagai berikut :

1. Manajemen Produk

2. Manajemen News

3. Manajemen Kategori

4. Manajemen Tag

5. Multiple Level User Login

6. Forgot Password Recovery (Emergency Question & Email)

7. Daftar / Signup

8. Manajemen Profil

9. Komentar

10. Message / Mail

11. Sistem Rating

Melakukan rate terhadap produk – produk yang ditawarkan.

12. Best Seller

Menampilkan daftar produk yang terjual paling banyak, sehingga

pelanggan dapat memilih produk yang terlaris.


commit to user

42

13. Share to Social Networking

Fasilitas unutk berbagi link ke situs jejearing sosial.

14. Keranjang Belanja (Shopping Cart)

Menampung semua data pemesanan belanja saat pelanggan

bertransaksi.



commit to user

43

Algoritma yang dipakai seperti gambar flowchart diatas yaitu pelanggan

memilih kategori produk atau langsung memilih produk. Kemudian

akan dilakukan pengecekan apakah terdapat di database pemesanan

sementara, apabila sudah ada data maka akan diupdate jumlahnya

namun jika belum ada akan diinsert data pesanan baru pada database

pemesanan sementara. Apabila pelanggan selesai melakukan

perbelanjaan maka akan ditampilkan detail pesanan kemudian

pelanggan memilih jenis shipping yang diinginkan, apakah melalui jasa

pengiriman / delivery atau datang langsung ke toko. Dengan jasa

pengiriman dikenakan biaya tambahan terhadap pesanan yaitu biaya

ongkos kirim yang dikenakan harga per kilogram atas total berat data

pesanan. Bagi pelanggan yang menginginkan pesanan mereka datang

dengan cepat maka memilih durasi shipping yang kilat, akan tetapi

semakin sedikit durasinya maka semakin mahal harganya. Untuk

pelanggan yang datang ke toko tidak akan dikenakan biaya tambahan.

15. Antarmuka / interface dengan kombinasi bahasa pemrograman web

(XHTML, PHP, CSS3, JavaScript & jQuery)

16. Smart Navigation

Indikator pelanggan saat berada pada halaman tertentu.

17. Alternate Shipping

Pelanggan dapat menentukan jenis mendapatkan produk, dapat melalui

jasa pengiriman (Delivery) atau langsung diambil ke toko.

18. Manajemen Order

Pengelolaan order yang sangat mudah dan cepat


commit to user

44

19. Manajemen Komplain & Konfirmasi


Fasilitas yang memudahkan pelanggan dan pengelola dalam

menanggapi setiap konfirmasi dan komplain. Alur algoritma yang

dipakai pelanggan setelah melalukan pemesanan diminta melakukan

pembayaran yang sesuai, kemudian apabila diharuskan mengupload resi

bukti pembayaran maka pelanggan dapat mengapload dan pihak admin

dengan mudah melihat konfirmasi tersebut. Apabila terdapat komplain

dari pihak pelanggan maka proses komplain dapat dilakukan pada

halaman yang sama dengan mengirimkan komplain pada order yang


commit to user

45

bermasalah, maka pihak pengelola dapat menanggapi komplain

tersebut.

20. Pencarian All in One

Melakukan pencarian yang menampilkan auto complete dengan jQuery

dengan melakukan algoritma pencarian produk, news dan user yang

terkait dengan keyword.

21. Keamanan terhadap SQL Injection

22. Advanced View

Dalam CMS E-Commerce terdapat juga fitur yang paling

bermanfaat dalam pengolahan data yaitu bernama Advanced View.

Banyak kemudahan dalam Advanced View diantaranya :

a. Onscreen All Search

Pencarian data secara langsung pada halaman tanpa click tombol

submit dan refresh page.

b. Onscreen Sort Column

Sorting data dengan cepat langsung pada halaman tanpa click

tombol submit dan refresh page.

c. Onscreen Dinamic Paging

Pengaturan banyaknya data yang tampil dengan cepat langsung

pada halaman tanpa click tombol submit dan refresh page.

d. Focus Point View

Pengelola hanya ditampilkan data Advance View, sehingga

pandangan terfokus pada data yang sedang tampil tanpa gangguan

tampilan lain.

23. SEO URL

Penulisan URL yang mencantumkan nama dari judul item yang

dikunjungi.

24. RSS Feed

Pelanggan akan berlangganan pada toko tentan info terbaru secara

langsung pada browser tanpa mengunjungi website dengan RSS Feed

ini.


commit to user

46

25. Mobile Site

26. Manajemen Laporan

Pihak pengelola dapat mencetak laporan atas penjualan toko mereka.

Terdapat dua jenis laporan yaitu laporan total yang mencetak semua

transaksi lengkap dengan kalkulasi delivery dan shipping, kemudian

laporan jenis kedua yaitu laoran penjulan produk yang hanya

menampilkan biaya penjualan produk tanpa biaya lainnya

27. Pencetakan PDF Report

28. Manajemen Payment

Pihak pengelola dapat menyimpan data – data pembayaran meliputi

daftar bank, daftar rekening, ongkos kirim delivery dan durasi shipping.

29. Manajemen Pengguna

30. Manajemen Settings

Pihak pengelola dapat melakukan pengaturan atas toko online meliputi

nama toko, deskripsi, facebok, twitter, upload, pagging, comment, logo

toko, widget dan mobilesite.

31. Statistik

Menampilkan statistik terhadap item – item yang terdapat di toko

tersebut.

32. Kontak Kami

33. Bantuan

4.3. Hak Akses CMS E-Commerce

Pengelolaan hak akses terbagi atas lima aktor yang ikut serta dalam

sistem CMS E-Commerce ini, yaitu Pengunjung/Visitor, User, Staff, Admin

dan SuperAdmin. Daftar hak akses terhadap kelima aktor terdiri atas :


commit to user

47

Tabel 4.1 Daftar Hak Akses CMS E-Commerce

No Akses Visitor User Staff AdminSuper

Admin

1 Melihat Produk

2 Melihat News

3 Melihat Kategori

4 Melihat Tag

5 Mengirim Komentar

6 Melakuakan Rating

7 Login

8 Signup

9 Recovery Pasword

10 Pencarian AllinOne

11 Shopping Cart

12 My-Order

13 Message

14 Konfirmasi & Komplain

15 Edit Profil

16 Manajemen Kategori

17 Manajemen Tag

18 Manajemen News

19 Manajemen Produk

20 Manajemen Konfirmasi &

Komplain

21 Manajamen Komentar

22 Manajamen Order

23 Manajemen Laporan

24 Manajemen User

25 Manajemen Staff

26 Manajemen Admin

27 Manajemen SuperAdmin

28 Manajemen Payment

29 Manajemen AboutUs

30 Manajemen Settings


commit to user

48

4.4. Site Map

Site Map adalah peta situs yang menjelaskan struktur dari menu yang

ada dalam sistem. Site Map CMS E-Commerce dapat digambarkan sebagai

berikut :

Gambar 4.3 : Site Map Halaman Depan CMS E-Commerce

Gambar 4.4 : Site Map Halaman PengelolaCMS E-Commerce

SYSTEMCMS E-COMMERCE

Home Login Page

Shopping Cart Profile Message My-Order

Produk News Bantuan /FAQ Kontak Pencarian

SYSTEM CMS E-COMMERCE

Home Navigasi

Dashboard

News

Produk

Kategori

Tag

Komentar

C&C

Order

Laporan

User

Payment

Bank

Rekening

Delivery

Shipping

Settings

General

Themes

Upload

Paging

Comment

Mobile

AboutUs

Bantuan

Suarat&Ketentuan

Kotak Kami

Statistik


commit to user

49

4.5. Desain Tampilan

4.5.1. Layout Halaman Depan

Gambar 4.5 : Layout Halaman Depan CMS E-Commerce

4.5.2. Layout Halaman Mobile

Gambar 4.6 : Layout Halaman Mobile CMS E-Commerce

PAGE

H E A D E R

FOOTER

PAGE

H E A D E R

FOOTER

WIDGET

LEFT

WIDGET

RIGHT

CONTENT

MENU

CONTENT

MENU


commit to user

50

4.5.3. Layout Halaman Pengelola

Gambar 4.7 : Layout Halaman PengelolaCMS E-Commerce

PAGE

H E A D E R PROFILE

FOOTER

NAVIGASI CONTENT

MENU


commit to user

51

4.6. Implementasi Sistem

4.6.1. Homepage

4.6.1.1. Halaman Home

Halaman depan / Home CMS E-Commerce sebagai

antarmuka paling awal yang menampilkan cuplikan What’s New

(produk terbaru, news terbaru, komentar terbaru, dll) terhadap semua

konten – konten yang terdapat didalamnya.

Gambar 4.8 : Halaman Depan CMS E-Commerce


commit to user

52

4.6.1.2. Halaman Lihat Produk

Pada halaman lihat produk ditampilkan daftar semua produk

– produk yang terdapat dalam CMS E-Commerce. Dilengkapi

dengan daftar kategori, tag, tanggal masuk, stok, review, komentar,

harga dan tentunya foto produk yang dapat dizoom dengan sekali

click.

Gambar 4.9 : Halaman Lihat Produk CMS E-Commerce


commit to user

53

4.6.1.3. Halaman Detail Produk

Pada detail produk menampilkan spesifikasi produk yang

dipilih dengan menyebutkan nama produk, kategori, deskripsi,

tanggal masuk, stok, rating, terjual, berat, komentar, produk terkatit

serta fasilitas berbagi link ke situs jejaring sosial seperti Facebook,

Twitter, dll.

Gambar 4.10 : Halaman Detail Produk CMS E-Commerce


commit to user

54

4.6.1.4. Halaman Lihat News

Selain menampilkan produk – produk CMS E-Commerce

ini juga dapat menampilkan News yang berguna sebagai sarana

informasi layaknya sebuah blog, sehingga dapat meningkatkan

interaksi dari pihak pemilik toko dengan para pengunjung web.

Gambar 4.11 : Halaman Lihat News CMS E-Commerce


commit to user

55

4.6.1.5. Halaman Detail News

Setiap news dapat dilihat detainya dan akan ditampilkan

keseluruhan isi dari news tersebut, kategori news, tanggal posting,

pengguna yang memposting, tag serta dibawahnya terdapat form

komentar, news terkait dan berbagi link ke jejaring sosial.

Gambar 4.12 : Halaman Detail News CMS E-Commerce


commit to user

56

4.6.1.6. Menubar

Menubar adalah sebuah tombol yang berguna untuk

berpindah tempat dari halaman satu ke yang lainnya. Terdapat

perbedaan pada tampilan menubar ketia belum login dan sudah login

yaitu ditambahkannya menu Shooping Cart pada user yang sudah

login.

Gambar 4.13 : Menubar Sebelum Login CMS E-Commerce

Gambar 4.14 : Menubar Sesudah Login CMS E-Commerce

4.6.1.7. Tampilan Form Pencarian AllinOne

Salah satu fitur unggulan dalam CMS E-Commerce ini

adalah terdapatnya form pencarian yang sangat dinamis dan cepat.

Pengunjung dimudahkan dalam pencarian produk, news, pengguna

dengan tampilan AutoComplete. Dimana setiap kali pengunjung

menginputkan karakter maka secara otomatis akan muncul drop

down yang berisi hasil carian yang terkait dengan dilengkapi

gambar, sehingga pengunung tidak perlu melakukan sibmit berkali –

kali demi melakukan pencarian yang diinginkan.

Gambar 4.15 : Pencarian AllinOne CMS E-Commerce


commit to user

57

Gambar 4.16 : Hasil Pencarian AllinOne CMS E-Commerce


commit to user

58

4.6.1.8. Login, Forgot Password dan Signup Form

Konsep yang dibuat dalam CMS E-Commerce ini adalah

hanya member yang dapat melakukan perbelanjaan disini, jadi jika

pengunjung ingin berbelanja di CMS tersebut maka harus menjadi

member dengan melakuakan pendaftaran (Signup). Bagi pengunjung

yang sudah menjadi member maka dapat login akun mereka pada

Login Form. Pada suatu saat pengunjung lupa akan password

mereka, pengunjung dapat melakukan Recovery Password di bagian

Forgot Password Form (Lupa Password).

Gambar 4.17 : Tampilan Form Login CMS E-Commerce

Dalam Login, Forgot Password dan Signup Form terdapat

algoritma proses yang sangat rumit dan berperan penting dalam

kinerja CMS E-Commerce itu sendiri. Berikut rincian penjelasan

algoritma tersebut :

a. Algoritma Login

Proses login pada CMS E-Commerce ini memiliki algoritma

Multiple Level User Login yaitu satu tempat login bisa digunakan

untuk login di halaman lain, serta semua level user dapat login

ditempat yang sama dari pelanggan, staff, admin hingga

superadmin.


commit to user

59

Gambar 4.18 : Flow Chart Login Sistem CMS E-Commerce


commit to user

60

Dalam gambar flowchart login diatas dapat disimpulkan

bahwa setiap pengguna dapat melakukan login dengan ID

username, email atau nomor telepon mereka yang tentunya

sesuai dengan data profil pengguna tersebut. Pada saat pengguna

memasukan ID dan password maka akan dilakukan proses

pengecekan ID yang diinputkan. Langkah pertama ID akan

dicocokan dengan username pada database, jika ada maka akan

dilakukan pengecekan password namun jika tidak ada maka akan

dilakukan pengecekan selanjutnya ke langkah kedua. Langkah

kedua pengecekan ID dengan email pada database jika ada maka

akan dilakukan pengecekan password namun jika tidak ada maka

akan dilakukan pengecekan selanjutnya ke langkah ketiga.

Langkah ketiga yaitu mencocokan ID dengan nomor telepon

pada database jika ada maka akan dilakukan pengecekan

password namun jika tidak ada maka akan dilakukan alert yang

menampilkan kalau proses login gagal.

Gambar 4.19 : Alert Login Gagal CMS E-Commerce

Pada salah satu dari ketiga langkah proses pengecekan

diatas apabila ditemukan kecocokan ID dengan database maka

akan dilakukan proses pengecekan password. Apabila password

benar maka akan menuju proses cek level namun jika salah akan

ditampilkan alert password salah.

Gambar 4.20 : Alert Password Salah CMS E-Commerce


commit to user

61

Apabila pada saat proses pengecekan password cocok

dengan database maka akan dilakukan proses cek level dari

pengguna tersebut apakan user / staff / admin / superadmin

kemudian akan ditampilkan fitur berdasarkan level pengguna.

Gambar 4.21 : Tampilan Login Berhasil CMS E-Commerce


commit to user

62

b. Algoritma Forgot Password

1. Recovery by Email

Suatu saat pengunjung pasti akan lupa dari password

mereka, oleh karena itu dalam CMS E-Commerce ini terdapat

fitur Forgot Password yang memudahkan pengguna mereset

password mereka dengan mudah. Pada recovery by email

metode yang digunakan adalah pengguna memasukan email

mereka kemudian akan dikirimkan sebuah email verifikasi

yang berisi link untuk membuat password baru yang

kemudian dapat digunakan untuk login kembali ke CMS E-

Commerce.

2. Emergency Question

Seain fasilitas Forgot Password melalui recovery by

email dalam CMS E-Commerce ini juga ada metode reset

password dengan menjawab pertanyaan darurat yang telah

dibuat saat pengguna melakukan registrasi (Signup). Apabila

jawaban benar maka pengguna dapat membuat password baru

yang kemudian dapat digunakan untuk login kembali ke CMS

E-Commerce.

3. Kontak Kami

Apabila kedua metode diatas tidak berhasil maka ada ke

metode terakhir menghubungi kontak kami, kemudian

perubahan password akan dilakukan oleh pihak pengelola

(Staff/Admin/SuperAdmin).


commit to user

63

c. Algoritma Signup

Mirip dengan proses login dilakukan proses pengecekan

dengan tiga langkah yaitu pengecekan keterseediaan username,

email dan nomor telepon.

Gambar 4.22 : Flow Chart Register


commit to user

64

Pada Signup Form pengguna memasukkan username, email

dan nomor telepon serta captcha security, kemudian akan

dlakukan proses pencocokan apakah ada yang memakai

pengguna lain pada database.

Gambar 4.23 : Tampilan Cek Data Pengguna Signup CMS E-Commerce

Gambar 4.24 : Tampilan Sudah Ada Data Pengguna Signup CMS E-Commerce

Gambar 4.25 : Tampilan Data Pengguna Tersedia Signup CMS E-Commerce


commit to user

65

Setelah proses pengecekan tidak ada masalah makan

selanjutnya pengguna akan mengisi biodata mereka guna

keperluan data pelanggan.

Gambar 4.26 : Tampilan Biodata Signup CMS E-Commerce


commit to user

66

Tahap signup selesai dan akan ditampilkan summary

signupnya, sehingga pengguna telah resmi menjadi member dan

dapat langsung login seketika pada CMS E-Commerce.

Gambar 4.27 : Tampilan Summary Signup CMS E-Commerce

4.6.1.9. Halaman Profil

Profil berguna sebagai tampilan data diri dari tiap

pengguna, sehingga pengguna lain dapat melihat profil dari

pengguna lainnya. Akan tetapi ada pengaturan kebijakan privacy

yang mengatur boleh tidaknya alamat, email dan nomor telepon

diketahui publik. Kebijakan tersebut dapat menjaga identitas sang

pengguna tersebut.

Gambar 4.28 : Halaman Profil CMS E-Commerce


commit to user

67

4.6.1.10. Halaman Edit Profile

Dalam profil pengguna juga dapat merubah biodata

mereka guna kepetingan tertentu termasuk nama, alamat, email,

tanggal lahir, foto, dll kecuali username. Sama halnya pada saat

proses signup, edit profil ini juga diberlakukan pengecekan tiga

tahap untuk menghindari ada ID yang dipakai pengguna lain atau

tidak.

Gambar 4.29 : Halaman Edit Profile CMS E-Commerce


commit to user

68

4.6.1.11. Halaman Messages / Mail

CMS E-Commerce ini memiliki banyak fitur menarik dan

sangat berguna sekali salah satunya Message / Mail. Berfungsi

sebagai media kirim dan terima Private Message antar pengguna

termasuk dari pihak pengelola. Dengan adanya fitur ini bisa

menunjang komunikasi yang interaktif dalam CMS ini.

Gambar 4.30 : Halaman Messages / Mail CMS E-Commerce


commit to user

69

4.6.1.12. Shopping Cart

Berbelanja pada toko online pasti disediakan layaknya

keranjang belanja sungguhan yang befungsi untuk menampung

semua barang belanjaan para pengunjungnya. Istilah Shoopping Cart

adalah jawaban atas perumpamaan diatas.

Gambar 4.31 : Halaman Shopping Cart CMS E-Commerce

Terdapat juga status Shooping Cart yang berada di widget

kanan menampilkan total barang, produk dan rupiah yang ada dalam

keranjang belanja.

Gambar 4.32 : Halaman Status Shopping Cart CMS E-Commerce


commit to user

70

4.6.1.13. Selesai Belanja

Halaman ini menampilkan proses selesai berbelanjaan.

Pengguna diminta memilih Get Product dalam produk yang dipesan.

Terdapat dua pilihan yaitu jasa delivery atau ambil ke toko, sehingga

pengguna dapat lebih mudah menentukan pilihan. Apabila

dikehendaki mengirimkan produk dengan jasa delivery ke alamat

lain pengguna juga dimudahkan dengan disediakan form alamat

alternatif. Jasa delivery sesui kota yang telah ditentukan biaya

ongkos kirim yang telah ditentukan oleh pengelola. Metode

pembayaran tranfer via bank dengan banyak pilihan nomor rekening

yang dapat dipilih. Terdapat pula biaya tambahan bagi pengguna

yang menginginkan proses pengiriman kilat dengan perhitungan

durasi hari produk terkirim.

Gambar 4.33 : Halaman Selesai Belanja CMS E-Commerce


commit to user

71

4.6.1.14. My Order

Halaman ini digunakan untuk menampilkan jumlah

pesanan yang telah dilakukan oleh pengguna. Selain itu juga dapat

berfungsi sebagai halaman konfirmasi dan kompain terhadap order

yang dilakukan.

Gambar 4.34 : Halaman My Order CMS E-Commerce


commit to user

72

Gambar 4.35 : Halaman Detail My Order CMS E-Commerce


commit to user

73

4.6.1.15. Widget Kiri

Seperti dalam desain layout terdapat widget yang

berfungsi sebagai tools cepat untuk menuju ke halaman tertentu.

a. Login, Forgot Password & Signup

Sudah dijelaskan diatas form ini berfungsi sebagai login, forgot

password dan signup.

b. Kategori

Mengelompokan produk dan news kedalam sebuah katalog yang

memisahkan atara satu dengan yang lainnya.

Gambar 4.36 : Widget Kategori CMS E-Commerce

c. Tag

Menandai produk dan news dalam sebuah penanda.

Gambar 4.37 : Widget Tag CMS E-Commerce


commit to user

74

d. Produk Terbaru

Menampilkan daftar produk – produk terbaru.

Gambar 4.38 : Widget Produk Terbaru CMS E-Commerce

e. Komentar Terbaru

Menampilkan daftar komentar – komentar terbaru.

Gambar 4.39 : Widget Komentar Terbaru CMS E-Commerce


commit to user

75

4.6.1.16. Widget Kanan

Seperti dalam desain layout terdapat widget yang

berfungsi sebagai tools cepat untuk menuju ke halaman tertentu.

a. Join Us

Link langganan RSS Feed, Facebook dan Twitter.

Gambar 4.40 : Widget Join Us CMS E-Commerce

b. Best Seller

Menampilkan produk yang terjual paling banyak (Best Seller).

Gambar 4.41 : Widget Best Seller CMS E-Commerce

c. Our Rating

Menampilkan total rating terhadap semua produk.

Gambar 4.42 : Widget Our Rating CMS E-Commerce


commit to user

76

d. Recommended Product

Menampilkan produk secara random.

Gambar 4.43 : Widget Recommended Product CMS E-Commerce

e. Statistik

Menampilkan statistik toko dan pengunjung web.

Gambar 4.44 : Widget Statistik CMS E-Commerce


commit to user

77

4.6.1.17. Bantuan / FAQ

Halaman ini berisi bantuan atau FAQ (Frequency Asked

Question) serta syarat dan ketentuan yang dapat membantu

pengunjung dalam melakuakan berbelanjaan di CMS E-Commerce.

Gambar 4.45 : Halaman Bantuan CMS E-Commerce

4.6.1.18. Kontak

Halaman ini berisi kontak dari pemilik toko.

Gambar 4.46 : Halaman Kontak CMS E-Commerce


commit to user

78

4.6.2. Halaman Mobile

CMS E-Commerce ini telah ditambahkan fitur mobilesite

yang dikhususkan untuk browser ponsel. Apabila merek ponsel

termasuk dalam mobile detect ketika mengunjungi homepage maka

akan secara otomatis dialihkan kealamat mobilesite.

Gambar 4.47 : Halaman Mobile CMS E-Commerce


commit to user

79

4.6.3. Halaman Pengelola

4.6.3.1. Halaman Login

Dalam halaman depan untuk melakukan login juga dapat

dilakukan, akan tetapi di halaman pengelola juga terdapat login form.

Gambar 4.48 : Halaman Login Form Pengelola CMS E-Commerce

4.6.3.2. Hamalan Dashboard

Merupakan halaman awal dari halaman pengelola yang

berisi menu cepat menuju ke halaman tertentu.

Gambar 4.49 : Halaman Dashboard Pengelola CMS E-Commerce


commit to user

80

4.6.3.3. Menubar

Menubar adalah sebuah tombol yang berguna untuk

berpindah tempat dari halaman satu ke yang lainnya. Terdapat

perbedaan pada tampilan menubar ketia level pengelola yang login.

Gambar 4.50 : Tampilan Menubar Pengelola CMS E-Commerce

4.6.3.4. Status Pengelola

Menampilkan pengelola yang sedang login pada halaman

pengelola.

Gambar 4.51 : Status Pengelola CMS E-Commerce

4.6.3.5. Manajemen Payment

Mengelola pembiayaan dalam transaksi seperti nama bank,

nomor rekening, delivery dan shipping.

Gambar 4.52 : Manajemen Payment Pengelola CMS E-Commerce


commit to user

81

4.6.3.6. Daftar Bank

Mengelola daftar bank yang akan digunakan dalam setiap

transaksi order.

Gambar 4.53 : Daftar Bank Pengelola CMS E-Commerce

4.6.3.7. Daftar Rekening

Mengelola daftar nomor rekening yang dipakai dalam

transaksi order.

Gambar 4.54 : Daftar Rekening Pengelola CMS E-Commerce


commit to user

82

4.6.3.8. Manajemen Delivery

Mengelola daftar nama kota jasa pengiriman serta biaya

ongkos kirimnya.

Gambar 4.55 : Daftar Delivery Pengelola CMS E-Commerce

4.6.3.9. Manajemen Shipping

Mengelola daftar biaya durasi pengiriman order khusus

yang menginginkan pengiriman kilat.

Gambar 4.56 : Daftar Shipping Pengelola CMS E-Commerce


commit to user

83

4.6.3.10. Manajement Settings

Pengaturan terhadap CMS E-Commerce yang hanya dapat

diakses oleh pengelola yang berlevel SuperAdmin.

Gambar 4.57 : Daftar Shipping Pengelola CMS E-Commerce

4.6.3.11. General Settings

Digunakan untuk mengatur pengaturan umum CMS E-

Commerce mulai dari nama toko, deskripsi toko, URL, Facebook,

Twitter, dll.

Gambar 4.58 : General Settings Pengelola CMS E-Commerce


commit to user

84

4.6.3.12. Themes Settings

Digunakan untuk mengatur tampilan yakni logo dari toko

dan posisi widget.

Gambar 4.59 : Themes Settings Tampilan Pengelola CMS E-Commerce

Gambar 4.60 : Themes Settings Widget Pengelola CMS E-Commerce


commit to user

85

4.6.3.13. Upload Settings

Digunakan untuk pengaturan upload dengan menentukan

maksimal ukuran gambar serta dimensi gambar.

Gambar 4.61 : Upload Settings Pengelola CMS E-Commerce

4.6.3.14. Paging Settings

Digunakan untuk pengaturan semua paging yang ada pada

CMS E-Commerce.

Gambar 4.62 : Paging Settings Pengelola CMS E-Commerce


commit to user

86

4.6.3.15. Comment Settings

Digunakan sebagai fasilitas sensor terhadap semua

komentar yang menggunakan kata – kata jelek dengan dirubahnya

kata tersebut kedalam kata lain.

Gambar 4.63 : Comment Settings Pengelola CMS E-Commerce

4.6.3.16. Mobile Site

Digunakan sebagai pengaturan mobile detect yang dapat

mendeteksi secara otomatis perangkat ponsel, sehingga dapat

dialihkan secara langsung ke halaman mobile site para pengunjung

yang menggunakan browser ponsel.

Gambar 4.64 : MobileSite Settings Pengelola CMS E-Commerce


commit to user

87

4.6.3.17. Bantuan

Mengelola halaman statis yang berisi tentang bantuan /

FAQ.

Gambar 4.65 : Bantuan Pengelola CMS E-Commerce

4.6.3.18. Syarat & Ketentuan

Mengelola halaman statis yang berisi tentang dokumen

syarat dan ketentuan dalam aturan main di toko yang menggunakan

CMS E-Commerce ini.

Gambar 4.66 : Syarat & Ketentuan Pengelola CMS E-Commerce


commit to user

88

4.6.3.19. Kontak Kami

Mengelola halaman status yang berisi informasi toko guna

memudahkan pengunjung dapat mengetahui lokasi dari toko tersebut

berada.

Gambar 4.67 : Kontak Kami Pengelola CMS E-Commerce

4.6.3.20. Statistik

Menampilkan statistik toko dan pengunjung web.

Gambar 4.68 : Kontak Kami Pengelola CMS E-Commerce


commit to user

89

4.6.3.21. Smart Navigation

Merupakan suatu tools berisi tombol – tombol dinamis

yang berfungsi untuk menuju ke halaman tertentu dengan cepat.

Gambar 4.69 : Smart Navigation CMS E-Commerce

4.6.3.22. News

Digunakan sebagai pengelola semua news yang akan

digunakan untuk postingan di halaman depan.

Gambar 4.70 : News Pengelola CMS E-Commerce


commit to user

90

Dalam pengelolaan news terdapat empat tab yang

berfungsi untuk menampung konsep, trash serta arsip, sehingga

pengelola tidak khawatir kehilangan data karena data tidak akan

terhapus akan tetapi dipindahkan ke arsip.

Gambar 4.71 : Tampilan Tab News Pengelola CMS E-Commerce

Selain itu dalam CMS E-Commerce terdapat fitur yang

tidak kalah pentingnya yaitu tersediannya editor berbasis

WYSIWYG (What You See Is What You Get) yang semakin

mempermudah pengelola dalam mengolah konten.

Gambar 4.72 : Tampilan Add & Edit News Pengelola CMS E-Commerce


commit to user

91

4.6.3.23. Produk

Digunakan sebagai pengelola semua produk yang akan

dipasarkan di halaman depan.

Gambar 4.73 : Tampilan Produk Pengelola CMS E-Commerce

Dalam pengelolaan produk terdapat empat tab yang

berfungsi untuk menampung konsep, trash serta arsip, sehingga

pengelola tidak khawatir kehilangan data karena data tidak akan

terhapus akan tetapi dipindahkan ke arsip.

Gambar 4.74 : Tampilan Tab Produk Pengelola CMS E-Commerce


commit to user

92

Selain itu dalam CMS E-Commerce terdapat fitur yang

tidak kalah pentingnya yaitu tersediannya editor berbasis

WYSIWYG (What You See Is What You Get) yang semakin

mempermudah pengelola dalam mengolah konten.

Gambar 4.75 : Tampilan Add & Edit Produk Pengelola CMS E-Commerce

Gambar 4.76 : Tampilan Advanced View Produk Pengelola CMS E-Commerce


commit to user

93

4.6.3.24. Rating

Digunakan untuk melihat total rating terhadap semua

produk yang terdapat dalam CMS E-Commerce.

Gambar 4.77 : Tampilan Rating Produk Pengelola CMS E-Commerce

4.6.3.25. Kategori

Pengolahan kategori yang akan digunakan sebagai katalg

produk dan news.

Gambar 4.78 : Tampilan Kategori Produk Pengelola CMS E-Commerce

Gambar 4.79 : Tampilan Kategori News Pengelola CMS E-Commerce


commit to user

94

Gambar 4.80 : Tampilan Add & Edit Kategori Pengelola CMS E-Commerce

4.6.3.26. Tag

Digunakan untuk mengelola penanda yang akan

digunakan menandai produk dan news.

Gambar 4.81 : Tampilan Tag Pengelola CMS E-Commerce

Gambar 4.82 : Tampilan Add & Edit Tag Pengelola CMS E-Commerce


commit to user

95

4.6.3.27. Komentar

Digunakan untuk mengelola daftar komentar – komentar

yang sudah masuk.

Gambar 4.83 : Tampilan Komentar Pengelola CMS E-Commerce

4.6.3.28. C & C (Confirmation & Complain)

Digunakan untuk mengelola semua konfirmasi pelanggan

yang telah melakuakan order. Selain itu juga berfungsi sebagai data

komplain pelanggan.


commit to user

96

Gambar 4.84 : Tampilan C&C Pengelola CMS E-Commerce


commit to user

97

4.6.3.29. Order

Fitur yang utama dari CMS E-Commerce adalah

manajemen order. Terdapat pada Smart Navigation untuk

mengelompokan order berdasarkan statusnya sehingga pengelola

dapat dengan mudah mengkonfirmasi semua order.

Gambar 4.85 : Smart Navigation Order Pengelola CMS E-Commerce

Gambar 4.86 : Tampilan List Order Pengelola CMS E-Commerce


commit to user

98

Dalam detail order ditampilkan data pesanan pelanggan

dengan data produk – produk yang dibeli. Pada bagian bawah

tertampil alamat pelanggan yang melakukan order dan data upload

resi yang dilakukan oleh pelanggan, serta form pelayanan konfirmasi

dan komplain oleh pengelola.

Gambar 4.87 : Tampilan Detail Order Pengelola CMS E-Commerce


commit to user

99

Dalam manajemen order juga terdapat fitur Advanced

View. Seperti dijelahkan pada Advanced View pada produk diatas

bnyak kelebihan yang ditanam pada CMS E-Commerce ini.

Gambar 4.88 : Tampilan Advanced View Order Pengelola CMS E-Commerce

Fitur ini sangat berguna dalam pemilahan data order

pelanggan yang akan dilakukan konfirmasi, karena pencarian data

sangat cepat dengan Onscreen All Search. Pengelompokan order

juga bisa dilakukan dengan mudah dengan memisahkan order sesui

status order tersebut dan yang paling memudahkan pengelola adalah

tanpa harus refresh halaman semua data langsung muncul pada layar.


commit to user

100

4.6.3.30. Laporan

Setiap transaksi perlu adanya laporan guna mendapatkan

gambaran sejauh mana jumlah income dari toko tersebut.

Gambar 4.89 : Tampilan Laporan Pengelola CMS E-Commerce

Jenis laporan dibedakan menjadi dua yaitu laporan total

order dan laporan penjulan produk.

a. Laporan Total

Laporan total menampilkan total transaksi dari range

tanggal yang ditentukan.

Gambar 4.90 : Tampilan Hasil Laporan Total Pengelola CMS E-

Commerce


commit to user

101

Selain itu format laporan juga dapat dicetak dalam bentuk

PDF yang dapat digunakan sebagai arsip toko.

Gambar 4.91 : Tampilan Hasil Laporan Total Versi PDF Pengelola CMS E-

Commerce

b. Laporan Penjualan Produk

Laporan penjualan produk menampilkan total penjualan per

produk.

Gambar 4.92 : Tampilan Hasil Laporan Penjualan Produk Pengelola CMS E-

Commerce


commit to user

102

Selain itu format laporan juga dapat dicetak dalam bentuk

PDF yang dapat digunakan sebagai arsip toko.

Gambar 4.93 : Tampilan Hasil Laporan Penjualan Produk Versi PDF Pengelola

CMS E-Commerce

4.6.3.31. Manajemen User

Digunakan untuk pengelolaan daftar pengguna mulai dari

user, staff, admin hingga superadmin.

Gambar 4.94 : Tampilan Manajemen User Pengelola CMS E-

Commerce


commit to user

103

Untuk mengetahui daftar pelanggan dapat menuju

halaman user. Setiap pelanggan dapat diedit oleh pengelola berlevel

staff, admin dan superadmin.

Gambar 4.95 : Tampilan Daftar Pelanggan Pengelola CMS E-

Commerce

Daftar staff dapat menuju halaman staff. Setiap staff dapat

diedit oleh pengelola berlevel admin dan superadmin.

Gambar 4.96 : Tampilan Daftar Staff Pengelola CMS E-Commerce


commit to user

104

Daftar admin dapat menuju halaman admin. Setiap admin

dapat diedit oleh pengelola berlevel admin dan superadmin.

Gambar 4.97 : Tampilan Daftar Admin Pengelola CMS E-Commerce

Pada pengelola yang berlevel superadmin hanya terdapat

satu, dan posisi tersebut dipegang oleh masterweb dan statusnya

tidak dapat edit oleh siapapun kecuali dirinya sendiri serta memgang

akses penuh terhadap semua sistem.

Gambar 4.98 : Tampilan Super Admin Pengelola CMS E-Commerce


commit to user

105

BAB V

PENUTUP

5.1. Kesimpulan

Kesimpulan dari uraian dan pembahasan diatas, bahwa sistem CMS E-

Commerce dapat dibuat menggunakan bahasa pemrograman XHTML, PHP,

CSS3, JavaScript dan jQuery serta database MySQL. Dengan CMS E-Commerce

mempermudah pengelolaan bisnis di bidang jual beli produk.

5.2. Saran

Kedepannya diharapkan dapat bekerja sama dengan pihak bank, sehingga

dapat melakukan transaksi dengan Internet Banking.


commit to user

106

DAFTAR PUSTAKA

Fatansyah Ir, 2001, Basis Data, Informatika, Bandung

Kadir Abdul, 2008, Dasar Pemrograman Web Dinamis Menggunakan PHP,Andi, Yogyakarta

Hakim Lukmanul, 2008, Membongkar Rahasia Para Master PHP, Lokomedia,Yogyakarta

Hakim Lukmanul, 2009, Trik Rahasia Master PHP Terbongkar Lagi, Lokomedia,Yogyakarta

Handi Priyono, 2010, Pengertian dan Penjelasan E-Commerce,http://handzmentallist.blogspot.com/2010/04/pengertian-e-

commercepenjelasan-dan.html, didownload pada 27 Oktober 2010Kadir Abdul, 2009, Mudah Mempelajari Database MySQL, ANDI, YogyakartaSudarsono, 2007, Flowchart,

http://sdarsono.staff.gunadarma.ac.id/Downloads/files/16512/Flowchart.pdf

, didownload pada 19 Januari 2011Suprianto Dodit, 2008, Buku Pintar Pemrograman PHP, OASE Media, BandungWikipedia, 2010, Perdagangan Elektronik,

http://id.wikipedia.org/wiki/Perdagangan_elektronik, didownload pada 27Oktober 2010

Wikipedia, 2010, Sistem Manajemen Konten,

http://id,wikipedia,org/wiki/Sistem_manajemen_konten, didownload pada 3Desember 2010

Wikipedia, 2010, Bahasa Pemrograman,http://id.wikipedia.org/wiki/Bahasa_pemrograman, didownload pada 19

Januari 2011Wikipedia, 2010, PHP, http://en.wikipedia.org/wiki/PHP, didownload pada 19

Januari 2011Wikipedia, 2010, Extensible Hypertext Markup Language,

http://id.wikipedia.org/wiki/Extensible_hypertext_markup_language,didownload pada 19 Januari 2011

Wikipedia, 2011, Cascading_Style_Sheets,http://id.wikipedia.org/wiki/Cascading_Style_Sheets, didownload pada 19Januari 2011

Wikipedia, 2010, JavaScript, http://en.wikipedia.org/wiki/Javascript, didownloadpada 19 Januari 2011

Wikipedia, 2011, jQuery, http://en.wikipedia.org/wiki/JQuery, didownload pada19 Januari 2011

Wikipedia, 2011, Basis Data, http://id.wikipedia.org/wiki/Basis_data, didownloadpada 28 Mei 2011

Yuana Rosihan Ari, 2010, 67 Trik dan Ide Brilian Master PHP, Lokomedia,

Yogyakarta

PEMBUATAN CMS E-COMMERCE UNTUK PENGELOLAAN BISNIS … · PEMBUATAN CMS E-COMMERCE UNTUK PENGELOLAAN...

Documents

Transcript of PEMBUATAN CMS E-COMMERCE UNTUK PENGELOLAAN BISNIS … · PEMBUATAN CMS E-COMMERCE UNTUK PENGELOLAAN...