LAPORAN
Membuat situs Toko Komputer Online dengan
OpenCart
Di Susun Oleh :
NIM :
201213016
NAMA : Harsupan Dahliman
PRODI TEKNIK INFORMATIKA
POLITEKNIK KAMPAR
ANGKATAN 2012
<![if !supportLists]>1. <![endif]>KATA PENGANTAR
E-commerce adalah sekian banyak CMS (Content
Management System) atau sistem manajemen konten yang dapat digunakan untuk
membuat toko jual beli secara online. Software ini bisa didapat secara gratis
di website resminya http://oscommerce.com dengan ukuran yang cukup ringan untuk
didownload. Untuk memenuhi tugas dari mata kuliah E-Commerce, diberikan projek
pembuatan toko online dengan menggunakan software E-commerce dan hosting file
secara online sehingga agar bisa juga di lihat dengan online.
Pada Laporan ini membahas “Membuat Toko Online
dengan OpenChart serta Upload dan meng-on linekan toko online” dimana cara dan langkah-langkah membuat toko
online dengan openchart banyak di temui di Internet sehingga dapat menjadi
pembelajaran bagi Mahasiswa khususnya bagi penulis walaupun banyak terdapat
kendala.
<![if !supportLists]>3. <![endif]>Latar Belakang
Opencart adalah salah satu perangkat lunak
pengatur isi sebuah website, atau pada bahasa inggrisnya disebut dengan Content
Management System. Opencart termasuk dalam kelompok CMS untuk membuat toko
online. Beberapa CMS toko online lainnya yaitu : Prestashop, E-Commerce, Zen
Cart dan masih banyak lagi.
Opencart menjadi yang terbaik menurut saya
karena ringan (jadi bukanya cepet, meski pada koneksi GPRS sekalipun) , support
multibahasa, mudah digunakan dan yang lebih penting adalah support dari
komunitas yang demikian lengkap, khususnya di indonesia.
<![if !supportLists]>4. <![endif]>Sejarah Opencart
Pada limswiki.org tercatat bahwa opencart pada
awalnya adalah software yang dikembangkan oleh Christopher G. Mann seorang
teknisi manager dan administrator web pada Walnut Creek CDROM dan The FreeBSD
Mall. Pada rilis awal tanggal 28 Januari 1999, softwwre ini hanya diperuntukkan
bagi Walnut Creek CDROM. Namun akhirnya Mann membuat rilis software dengan bahasa
Perl pada tanggal 11 Mei 1999 dengan lisensi GPL.
Setelah sekian lama tidak terdengar
pengembangannya, pada tahun 2005 seorang programmer inggris, Daniel Kerr mulai
menangani proyek opencart, namun kali ini menggunakan bahasa PHP.
Pengembangan versi beta terus berlangsung sampai kahirnya muncul rilis stabil
pada google code dengan kode rilis versi 1.1.1 pada 10 Februari 2009. Dan sejak
saat itu perkembangan opencart terus naik dan sekarang saat ditulis artikel ini
opencart sudah mencapai rilis 1.5.6.
<![if !supportLists]>5. <![endif]>Software Yang Dibutuhkan
Syarat pendukung instalasi adalah Web Server
(Apache), PHP 5 keatas, MySQL, dan Curl. Instalasi dapat dilakukan dengan
mengikuti step-step halaman instalasi yang cukup simpel dan mudah dimengerti.
detail instalasi akan dibahas di artikel selanjutnya.
<![if !supportLists]>6. <![endif]>Fitur Opencart
Beberapa
fitur utama opencart adalah :
- Kategori
terbatas, produk, dan entri produsen
- Ketersediaan
template yang banyak
- Mendukung
multi bahasa dalam satu situs.
- Ada
manajemen gambar
- Mendukung
beberapa mata uang dan tarif pajak
- Mendukung
sistem kupon
- Ada
fasilitas review produk dan rating produk
- Ada link
untuk produk-produk terkait
- Mendukung
fitur download
- PCI
compliant
- Optimasi
mesin pencari (SEO)
- Dilengkapi
sistem backup dan restore
- Tersedia
halaman untuk membuat faktur dan pelaporan
- Ada
pencatatan error logging
<![if !supportLists]>7. <![endif]>Screenshot Tampilan
Halaman depan Toko Opencart
Halaman admin opencart
<![if !supportLists]>8. <![endif]>Cara Install atau membuat OpenCart
Sebelumnya pastikan pada komputer telah
terinstal web server Apache, PHP MyAdmin atau XAMPP dan MySQL. Sebagai misal
kita menggunakan aplikasi web server XAMPP jadi kita akan bekerja pada
folder/direktori HTDOCS.
Berikut ini
langkah-langkah instal opencart pada localhost :
- Download /
cari file Opencart, jika sudah ada langsung saja ke langkah berikutnya.
- Ekstrak
file tersebut pada folder tersebut.
- Cari
folder upload pada folder hasil ekstrak tadi kemudian copy/pindah ke folder
htdocs (pada C:\xampp\htdocs)
- Boleh Ganti
nama folder upload tersebut dengan nama baru, misal: opencart. kebetulan
dalam laporan ini saya tidak mengganti nama foldernya.
- Ganti nama
file config-dist.php menjadi config.php pada folder opencart
- Ganti nama
file config-dist.php menjadi config.php pada folder opencart/admin, jika
point 4 dan 5 telah sesuai dengan langkah diatas langsung saja ke
Langkah-langkah berikutnya.
- Buat
database baru pada phpmyadmin, dianjurkan buat database sesuai dengan nama
database yang ada di masukan pada Openchart
- Catat nama
database, nama user dan passwordnya.
- Buka
browser, lalu masuk ke halaman opencart dengan mengetik alamat:
localhost/opencart
- Jika benar
akan tampil halaman STEP 1 – LICENSE berikut ini:
<![if !supportLists]>11.
<![endif]>Klik “I agree to the license” lalu klik
Continue, maka akan tampil halaman STEP 2 – PRE INSTALATION berikut ini:
- Pastikan
semua status benar (tampak hijau) lalu klik continue
Jika benar akan tampil halaman STEP 3 –
CONFIGURATION berikut ini:
Kosong kan column password pada point 1 jika password tidak di
buat.
- Isi dengan
data pada langkah ke-8 dan masukkan nama admin dan password, sebagai
contoh berikut ini:
- Kemudian klik Continue dan jika
semua benar akan tampil halaman STEP 4 – FINISHED berikut ini:
- Proses
instalasi telah selesai, lalu hapus folder instal pada folder opencart.
- Hasil
instalasi opencart bisa dilihat dengan mengetik alamat localhost/opencart
pada browser.
- Dan untuk
masuk ke halaman admin bisa diakses dengan mengetik alamat
localhost/opencart/admin pada browser.
Hasil
Akhir nya adalah sebagai berikut :
Kita
bisa merubah tampilan default menjadi tampilan yang kita inginkan dengan cara masuk
sebagai admin.
<![if !supportLists]>9. <![endif]>Cara
menginput data ke OpenChart
Sebagai contoh dari data yang ingin
di inputkan adalah Sebagai berikut :
|
Kategory
/ Jenis
|
Nama
|
Deskripsi
|
Gambar
|
Harga
|
||||||||||||||||
|
Lenovo PC All in One C225
|
Lenovo
|
AMD E450 1.65 HD6320, 18.5 inch LCD, 500GB HDD, 2GB RAM DDR3,
USB, Bluetooth, WiFi, Lan, Card Reader, Camera, VGA, DOS
|
|
Rp 4.700.000,-
|
||||||||||||||||
|
Asus
|
Intel Core i3 3.3 GHz, 18.5" LED, 500GB HDD, 2GB RAM DDR3,
VGA Intel HD Grafhics, DVD, Bluetooth, WiFi, USB, HDMI, LAN, Card Reader, DOS
|
|
Rp 5.700.000,-
|
||||||||||||||||
|
Apple MAC MINI - MD388ZA/A
|
Apple
|
Intel Core i7 2.5 GHz, 1TB, 4GB RAM, Intel GMA HD, Full HD,
Bluetooth, WiFi, USB, HDMI, LAN, Card Reader, Mac OS X
|
|
Rp 9.750.000,-
|
||||||||||||||||
|
Dell Inspiron One 2330
|
Dell
|
Intel Core i3 3.4 GHz, 23" inch, 1TB, 4GB RAM, AMD Radeon HD
7650, Full HD, Bluetooth, WiFi, USB, HDMI, LAN, Card Reader, Win8
|
|
Rp 11.100.000,-
|
||||||||||||||||
|
Asus EEETOP 2300INTI-B042K Touchscreen
|
Asus
|
Intel Core i7 3.4 GHz, 23" inch, 1TB, 6GB RAM, Nvidia
GT630M, Full HD, Bluetooth, WiFi, USB, HDMI, LAN, Card Reader, WIN8
|
|
Rp 17.000.000,-
|
||||||||||||||||
|
Printer Epson K100
|
Printer Epson
|
|
|
Rp
1.190.000,-
|
||||||||||||||||
|
|
|
|
Rp
4.450.000,-
|
||||||||||||||||
|
Tablet
|
|
|
Rp 3.599.000,-
|
Langkah
menginput data ke Openchart :
<![if !supportLists]>-
<![endif]>Masuk terlebih
dahulu sebagai Admin Contoh : Localhost/Upload/admin
<![if !supportLists]>-
<![endif]>sebelumnya saya
hapus terlebih dahulu data bawaan dari Openchart, dan sedikit Modifikasi.
<![if !supportLists]>-
<![endif]>Selanjutnya
Pilih Menu Bar Catalog > Product
<![if !supportLists]>-
<![endif]>Tambahkan nama
Product yang ingin kita tambahkan dengan cara klik Insert
<![if !supportLists]>-
<![endif]>Pada general
diisikan contoh data sebagai berikut :
Product
name : Apple MAC MINI - MD388ZA/A
Description : Intel Core i7 2.5 GHz, 1TB, 4GB RAM,
Intel GMA HD, Full HD, Bluetooth, WiFi, USB, HDMI, LAN, Card Reader, Mac OS X
<![if !supportLists]>-
<![endif]>Pada Data
diisikan :
Model : Apple
MAC MINI - MD388ZA/A
Price : 9750000 (berisikan Harga dari barang)
Image : Masukan gambar dari product, dalam
memasukan gambar di harapkan gambar satu folder dengan folder Openchart di data
C:\xampp\htdocs\upload
<![if !supportLists]>-
<![endif]>Dan pada bagian
Categories yang terdapat di dalam Links, centang Combo Box sesuai dengan Nama
dan Product yang diinputkan, seperti Contoh : Product komputer maka centang
combo box PC. Tujuan mencentang Combo box ini adalah untuk membuat relasi Untuk
data yang diinput dengan menu barnya.
<![if !supportLists]>-
<![endif]>jika selesai
lalu Save. Lakukan perulangan untuk memasukan data selanjut nya yang hasilnya
akan seperti berikut :
karena
saya tadi menghapus semua data bawaan dari Openchart yang telah di install,
jika ingin menambahkan sebagai promosi dari tampilan barang yang di inputkan
tadi maka langkah-langkah nya adalah sebagai berikut :
<![if !supportLists]>-
<![endif]>pilih
Extensions – Module
<![if !supportLists]>-
<![endif]>pada pilihan
dari module – pilih Latest
<![if !supportLists]>-
<![endif]>pada sebelah
kanan Lates – Pilih edit
Remove :
Mengapus
Add Module :
Menambahkan ke tampilan bagian awal dari Product yang diinput tadi sebagai
Iklan atau Promosi
Save : menyimpan
Cancel :
membatalkan
Layout (Product) : bagian yang mana yang akan di
tampilkan pada halaman atas.
Hasil
(Halaman tampilan)
Komentar yang di tinggalkan Pembeli
<![if !supportLists]>-
<![endif]>Pilih atau Klik barang yang iingin ditinggalkan komentar
<![if !supportLists]>-
<![endif]>Selanjutnya
Klik Review yang berada disebelah Description- Lalu Isi kan dengan nama,
Komentar/ Pesan , serta masukan Kode yang tertera yang ada di bawah.
<![if !supportLists]>-
<![endif]>Terakhir Klik Continue.
Pembuktian bahwa admin mengetahui bahwa pembeli meninggalkan
komentar:
<![if !supportLists]>-
<![endif]>Masuk sebagai
Admin, localhost/upload/admin/ pada browser dan kemudian Login.
<![if !supportLists]>-
<![endif]>Pilih Menu Bar
Catalog – Reviews
Lihat pesan yang di tinggalkan oleh si pembeli
Tampilan Layanan Komentar
Cara Belanja Di toko Idal.com
<![if !supportLists]>-
<![endif]>Setelah barang belanja ditemukan klik Add Cart
Add Cart yaitu menambahkan/ memilih barang belanja yang ingin di
beli oleh si Pembeli.
<![if !supportLists]>-
<![endif]>setelah selesai
pencarian barang, maka lanjut ke tahap Transaksi Barang. Klik Shopping Cart
untuk mengetahui jumlah Transaksi yang akan di bayar oleh si pembeli.
<![if !supportLists]>-
<![endif]>klik Checkout untuk melanjuti tahap selanjutnya
Update :
Refresh Halaman
Continue Shooping : Melanjutkan kan belanja/ Pencarian barang
<![if !supportLists]>-
<![endif]>pada tahap ini
pengisian data lengkap dan pembayaran belanja.
:: Pengisian data dan Alamat harus lengkap untuk mempermudah proses
pengiriman barang
:: Pembayaran melalui paypal, Bank, dll
<![if !supportLists]>10. <![endif]>Upload File OpenChart
<![if !supportLists]>-
<![endif]>Langkah pertama
buka alamat www.idhostinger.com atau http://www.000webhost.com/ untuk upload file OpenChart.
<![if !supportLists]>-
<![endif]>Pada idhostinger
silahkan login melalui Facebook atau E-mail.
<![if !supportLists]>-
<![endif]>Tampilan Login
jika melalui faceboook.
<![if !supportLists]>-
<![endif]>Setelah itu klik
tombol oke untuk melanjutkan proses
login sehingga akan masuk ke cpanel idhostinger.
<![if !supportLists]>-
<![endif]>Pada tampilan
cpanel idhostinger terdapat tampilan awal untuk memulai upload file pada
idhostinger. Klik Order pada paket Rp.0,00
untuk mendapatkan hostingan yang free atau gratis.
<![if !supportLists]>-
<![endif]>Lalu memasuki
tahap selanjutnya dalam tahap registrasi, dimana kita akan memilih domain apa
yang kita pakai, membuat password.
Type Domain : Subdomain
Subdomain : idalkomputer .esy.es
Password : idalkomputer
Jika tidak ada kesalahan maka, lanjutkan proses dengan
mengklik tombol Lanjutkan.
<![if !supportLists]>-
<![endif]>Pada tahap ke 3
menjelaskan tentang paket hosting yang telah dibuat pada tahap 1 dan 2, lalu
memasukan kode Captcha dengan benar
dan mencentang Checkbox saya
setuju degan ketentuan penggunaan layanan, kemudian klik tombol order.
<![if !supportLists]>-
<![endif]>Tampilan daftar
akun hosting. Langkah selanjutnya Klik tombol tambah pada tabel kemudian klik kelola.
<![if !supportLists]>-
<![endif]>Klik File
manager 2 untuk mengupload file yang ada pada Xampp ( Htdocs).
<![if !supportLists]>-
<![endif]>Masuk ke
directory public_html dimana file
yang ada di htdocs pada xampp akan di upload kedalam directory public_html
<![if !supportLists]>-
<![endif]>Klik upload untuk
memulai proses upload file.
<![if !supportLists]>-
<![endif]>Sebelumnya semua
file yang akan diupload terlebih dahulu harus dengan format *zip.
<![if !supportLists]>-
<![endif]>Dan lalu klik Choose
file untuk pencarian file pada kategory Archives (zip, tar, tgz, gz) yang ada di sebelah kanan.
<![if !supportLists]>-
<![endif]>Kemudian klik
tanda Betul atau ceklis (ü).
<![if !supportLists]>-
<![endif]>Tunggu proses upload file hingga selesai.
<![if !supportLists]>-
<![endif]>Sehingga tampilan nya akan seperti berikut .
<![if !supportLists]>-
<![endif]>Dimana file dengan format zip yang telah di
upload secara otomatis mengexstract di dalam file directory public_html.
<![if !supportLists]>-
<![endif]>Klik tanda ü . jika ingin melihat file yang telah di upload, kita
dapat mengklik Back atau tanda ï .
<![if !supportLists]>-
<![endif]>Setelah file di upload, langkah selanjutnya
mengupload file database yang ada pada Phpmyadmin localhost.
<![if !supportLists]>-
<![endif]>Sebelumnya database tersebut harus di Exsport
dengan format sql.
<![if !supportLists]>-
<![endif]>Kemudian pada cpanel idhostinger, pilih database
Mysql pada menu Database, lalu isikan nama database, Username dan Password.
Lalu Ok.
<![if !supportLists]>-
<![endif]>Database berhasil
di buat.
<![if !supportLists]>-
<![endif]>Selanjutnya, klik impor database yang ada pada menu Database.
<![if !supportLists]>-
<![endif]>Lalu cari dan upload file yang telah dibuat
dengan format sql.
<![if !supportLists]>-
<![endif]>Jika untuk melihat database yang telah di upload
, klik Masuk ke PhpMyadmin.
<![if !supportLists]>-
<![endif]>Edit kodingan nya sesuai dengan database yang
telah dibuat pada /public_html/config.php.
Kodingan config.php
pada localhost Xampp
(Kodingan config.php yang telah di upload)
<![if !supportLists]>11. <![endif]>Masalah dan Kendala
Dalam pembutan toko online
menggunakan Openchart, banyak terdapat masalah dan kendala diantaranya adalah
sebagai berikut :
<![if !supportLists]>-
<![endif]>Mengonlinekan serta menampilkan hasil dari toko
online menggunakan OpenChart.
<![if !supportLists]>-
<![endif]>Telah banyak sumber yang di dapat, tapi masalah
tak kunjung kelar yaitu konfigurasi kodingan pada config.php, terdapat error
pada index.php sehingga tampilannya terdapat pesan error.
Comments
Post a Comment