Perkembangan toko onlineku (E-commerce)

Pada kesempatan ini saya akan membahas kelanjutan website e-commerce yang telah dibuat sebelumnya di posting blog. Di sini kami tetap menggunakan CMS E-Commerce PrestaShop. Dalam posting kali ini pula akan dijelaskan:

• Produk yang akan kelompok kami jual
• Kategori produk pada aplikasi
• Gambar-gambar produk
• Rancangan kategori produk
• Tahapan -tahapan pembelian produk hingga pengiriman

Produk yang kami jual

Nama toko kami adalah MilanShop, kami menjual fashion dan aksesoris. Produk yang kami jual seperti T-shirt, jeans, jaket, sepatu, dress dan masih banyak lagi. Total produk yang kami jual berjumlah 9 produk.

Kategori produk pada aplikasi

Untuk mempermudah customer saat proses pemilihan barang, kami membuat kategori dan sub-kategori sesuai dengan jenis fashion dan aksesorisnya. Jika customer memilih kategori men, maka hanya produk yang berhubungan dengan laki-laki yang akan muncul. Sehingga barang tidak campur-aduk dan tidak membuat customer bingung. Pemilahan kategori dan sub-kategori seperti gambar dibawah ini:

kategori men dan sub kategori jacket

kategori men dan sub kategori T-shirt

kategori men dan sub kategori sepatu

kategori dress dan sub kategorinya

Gambar-gambar produk

Kami menjual beragam produk fashion dan aksesoris, mulai dari t-shirt, jacket, Sepatu , jeans, dress. Berikut gambar-gambar produk yang kami jual:

T-shirt  :

Jacket :

Sepatu  :

Jeans  :

Dress  :

Tahapan-tahapan pembelian produk hingga pengiriman produk

Sebagai customer, tentu harus ada tahap yang harus dilalui dalam pembelian barang. Mulai dari:

1. Pemilihan produk
2. Pembelian Produk
3. Pembayaran Produk
4. Pengiriman Produk

Pemilihan Produk  :


Pembelian Produk  :

Pengiriman Produk  :

Demikian perkembangan website E-Commerce kelompok kami.

Read More

INSTALASI XAMPP DAN CMS PRESTASHOP EKSPLORASI CMS E-COMMERCE 2017

XAMPP adalah salah satu aplikasi web server apache yang terintegrasi dengan mysql dan phpmyadmin. XAMPP adalah singkatan dari X, Apache Server, MySQL atau MariaDB, PHP, dan Perl. Huruf X didepan menandakan XAMPP bisa di instal di berbagai Operating System. XAMPP dapat di instal pada Windows, Linux, MacOS dan Solaris. Sampai saat ini XAMPP masih diberikan secara gratis, bebas didownload dan digunakan tanpa harus membayar. XAMPP pada linux juga disebut dengan LAMPP, dimana huruf L merupakan singkatan dari Linux.

XAMPP adalah buatan dari team apache friends. XAMMP dapat didownload langsung dari situs resminya http://www.apache-friends.org. Kali ini saya akan membahas cara instalasi XAMPP versi windows. Di sini saya menggunakan XAMPP versi 7.0.9.

Beberapa fitur yang terdapat pada XAMPP 7.0.9 diantaranya :

– Apache 2.4.23

– MariaDB 10.1.16 (Dulunya MySQL)

– PHP 7.0.9

– Perl

– FileZilla

– Mercury

– Tomcat

Instalasi XAMPP

Berikut adalah cara menginstal XAMPP di Windows 8.1:

1. Download dahulu XAMPP 7.0.9 di sini.
2. Jalankan file .exe yang telah di download.
3. Jika kita menggunakan anti-virus dan mengaktifkan fitur UAC maka akan muncul peringatan seperti gambar dibawah. Dikhawatirkan akan memperlambat instalasi, tetapi tidak akan membuat file corrupt. Klik  OK saja untuk melanjutkan instalasi.

4. Kemudian akan muncul jendela installer , klik next
5. Lalu muncul seleksi komponen XAMPP yang akan diinstal, pilih semua (default) lalu klik next
6. Pilih folder instalasi XAMPP, secara default akan ditaruh pada folder c:\xampp, silahkan dirubah jika ingin folder lain, jika tidak langsung klik next
7. Lalu ada jendela setup hilangkan tanda centang dan klik next saja
8. Kemudian proses instalasi akan dijalankan secara otomatis dan tunggu sampai proses instalasi selesai klik next untuk install
9. Jika sudah selesai akan tampil pesan Finished. Centang opsi untuk membuka XAMPP Control Panel, lalu klik Finish dan proses instalasi selesai.

Menjalankan XAMPP setelah proses instalasi:

1. Setelah proses instalasi, jika kita memberi tanda centang, maka XAMPP Control Panel akan terbuka dengan sendirinya. Dan akan muncul pemilihan bahasa yang tersedia hanya Amerika Serikat atau Jerman, lalu klik Save.

2. Kemudian akan terbuka jendela XAMPP Control Panel dengan tampilan seperti dibawah ini.

3. Jalankan modul Apache dan MySQL dengan klik Start di sebelah kanan hingga highlight di modul yang dijalankan berwarna hijau, seperti gambar dibawah.
4. Setelah sukses menjalankan Apache dan MySQL, selanjutnya buka browser dan ketik localhost/dashboard/index.html pada address bar. Jika munculnya seperti gambar dibawah, Selamat! Anda siap untuk membuat website dengan XAMPP.

Selanjutnya saya akan membagi cara menyetting document root.

Menyetting Document Root XAMPP

Documentroot merupakan lokasi/folder untuk menyimpan file PHP/web agar bisa dipanggil/dijalankan oleh webserver. Pada contoh ini, lokasi documentroot berada di c:/xampp/htdocs/. Berarti jika anda ingin agar file bisa dijalankan melalui webserver, letakkan file anda folder tersebut.

Akan tetapi lokasi documentroot bisa Anda pindahkan ke tempat lain sesuai dengan keinginan. Misalnya Anda ingin memindahkan ke drive F: atau drive lain komputer/laptop yang Anda miliki.

Berikut langkah-langkahnya:

1. Buatlah satu folder terlebih dahulu dengan nama htdocs di drive yang Anda inginkan. (Saya membuatnya di F:\XAMPP Document Root\htdocs. Semua tergantung keinginan Anda)

2. Kemudian buka file c:/xampp/apache/conf/httpd.conf dengan menggunakan notepad ataupun notepad++.

3. Setelah terbuka, Cari kata “documentroot” didalam file tersebut. Untuk memudahkan pencarian silahkan anda tekan Ctrl+F.

4. Anda akan menemukan baris sebagai berikut, seperti gambar dibawah ini.

5. Ganti C:/xampp/htdocs dengan folder lain sesuai keinginan dan folder htdocs yang telah Anda buat tadi, seperti saya di F:/XAMPP Document Root/htdocs. (Ganti juga baris yang ada di bawahnya)

6. Terakhir, save file tersebut dan buka kembali XAMPP Control Panel. Restart Apache dengan mengklik “Stop” dan “Start” kembali. Sekarang semua file PHP harus disimpan di F:/XAMPP Document Root/htdocs

Sumber

Untuk CMS (Content Management System) website E-Commerce, saya memilih CMS PrestaShop yang dapat di download di sini.

Mengapa memilih CMS PrestaShop?

PrestaShop dikembangkan di Perancis. Dengan karakteristik orang Perancis yang menekankan segi estetika tampak pada PrestaShop. Oleh karena itu, dari sisi tampilan PrestaShop terlihat lebih menarik dibandingkan dengan CMS e-commerce lainnya, beberapa keunggulan PrestaShop diantaranya:

1. Fitur Yang lengkap (cart, featured products,tag produk, dll)
2. Sudah support bahasa Indonesia
3. Membedakan antara pemasok dan merek
4. Tampilan yang menarik
5. Pilihan beberapa pengiriman dan pembayaran.
6. Adanya tag produk
7. Adanya fitur bingkisan hadiah
8. Adanya fitur untuk me-retur order.

Instalasi CMS E-Commerce PrestaShop di Localhost

Berikut adalah langkah-langkah untuk menginstal CMS E-Commerce PrestaShop:

1. Download PrestaShop disini.
2. Dalam menginstal PrestaShop, dibutuhkan software XAMPP yang sudah terinstal seperti langkah-langkah sebelumnya.
3. Extract Prestashop yang telah di Download dalam folder htdocs. Kebetulan folder htdocs saya sudah saya ubah lokasinya dan berada di F:/XAMMP Document Root/htdocs, lokasi asalnya berada di C:/xammp/htdocs. Keluarkan semua file dari folder Prestashop.

4. Selanjutnya kita akan membuat database prestashop. Aktifkan XAMPP Control Panel, buka browser Anda, dan ketik localhost/phpmyadmin/.
5. Pilih Database » Ketik nama database “prestashop” » Pilih Create

6. Install Prestashop dengan mengakses pada address bar http://localhost/prestashop/install
7. Pilih bahasa yang diinginkan, lalu klik Berikutnya. Untuk versi 1.7. sudah mendukung bahasa Indonesia.

8. Selanjutnya beri tanda centang “Saya setuju dengan syarat dan ketentuan diatas.” Klik Berikutnya.

9. Kemudian akan muncul jendela untuk mengecek kompatibel data base dengan prestashop,jika berhasil klik berikutnya
10. Pada bagian Informasi tentang toko Anda dan Akun Anda, isi semua formulir. Klik Berikutnya.

11. Selanjutnya akan muncul tampilan konfigurasi database seperti gambar dibawah ini. Lalu klik “Tes koneksi ke database sekarang!” Jika muncul “Berhasil terhubung ke database” klik Berikutnya.

12. Kemudian Anda akan menunggu selama ± 10 menit, sambil PrestaShop mengkonfigurasikan toko Anda.

13. Proses instalasi PrestaShop telah selesai dan Anda siap untuk me-manage website E-Commerce Anda sendiri.

14. Anda disarankan untuk menghapus folder “install” pada direktori prestashop, dengan alasan keamanan.
15. 

berikut tampilan prestashop

Setelah login menjadi Admin :

Referensi :

http://caramaster.net/cara-instal-prestashop-di-localhost-dengan-xampp/

https://www.aplikasipc.com/tutorial-cara-install-prestashop-di-localhost-dengan-xampp/

http://doc.prestashop.com/display/PS16/Installing+PrestaShop+on+your+computer

Read More