4.2 Pengembangan Aplikasi Batik Shop
4.2.3.1 Instalasi Prestashop
Sebelum melakukan penginstalan prestashop pastikan pada PC atau laptop harus terinstal XAMPP. Langkah-langkah instalasi Prestashop :
1) Download file prestashop versi terbaru
(http://www.prestashop.com/download/prestashop_1.2.
5.0.zip).
2) Pada saat download, bisa sekaligus download bahasa yang akan di install pada Prestahop misalnya Bahasa Indonesia.
(http://www.prestashop.com/download/lang_packs/gzip
/id.gzip).
3) Ekstrak file Prestashop yang sudah di download pada folder yang sudah ditentukan pada server local misalnya c:\xampp\htdocs\prestashop.
4) Buka browser ketik address http://localhost/prestashop, otomatis akan tampil halaman instalasi. Ada dua pilihan bahasa instalasi, pilih English klik next.
5) Database Configuration : Buka web browser dan ketik, http://localhost/phpmyadmin.
6) Buat database baru dengan nama prestashop, selanjutnya kembali ke instalasi prestashop. Lalu klik verify now .
7) Setelah database telah terhubung, klik next untuk menyelesaikan proses instalasi prestashop.
Pada saat akan mengelola Back office caranya adalah sebagai berikut :
1) Buka web browser lalu ketik
http://localhost/prestashop/admin.
2) Untuk selanjutnya, hapuslah folder install pada c:\xampp\htdocs\prestashop\install dan ganti folder admin menjadi admin2406 sehingga
http://localhost/prestashop/admin2406. Seperti terlihat
pada gambar di bawah ini :
Gambar 4.22 Menu Back office
Prestashop sudah menggunakan program ajax, misalnya fitur keranjang belanja. Transaksi online saat menambah item belanja ke dalam keranjang sebelah kiri, sehingga muncul animasi yang lebih menarik, selain itu prestashop mendukung beberapa mata uang dan pilihan bahasa yang bisa ditambahkan melalui back office oleh pihak administrator.
Penulis dalam penelitian ini menggunakan mata uang rupiah sehingga penulis harus menambah mata uang rupiah pada prestashop dan menjadikan mata uang rupiah
tersebut sebagai default currency pada batik shop online ini. Berikut di bawah ini langkah-langkah menambah mata uang rupiah sebagai default currency:
a. Sebelumnya harus login terlebih dahulu sebagai admin. b. Back Office >> Payment >> Currencies.
Gambar 4.23 Modul Payment
c. Untuk menambah silahkan klik ‘Add New’ lalu isikan : -Currency : Rupiah
-ISO Code : IDR -Symbol : Rp
Gambar 4.24 Field Currencies
d. Lalu simpan dengan klik ‘Save’.
e. Kembali ke >> Payment >> Currencies.
f. Jika ingin Rupiah menjadi default : di bawah daftar mata uang tersebut ada ‘Currencies Option’.
g. Lalu setting rupiah sebagai ‘Default Currency’ dan klik ‘Save’.
Selain menggunakan mata uang rupiah sebagai default currency, penulis juga menggunakan bahasa Indonesia sebagai default language. Langkah yang harus dilakukan yaitu menambah bahasa, berikut cara nya : a. Back Office >> Tools >> Languages >> Add new.
b. Isi informasi kolom yang ada lalu klik save.
c. Terdapat kolom untuk mengisi kode ISO Negara untuk dapat mengetahui kode ISO tiap Negara dapat di lihat
(http://www.iso.org/iso/country_codes/iso_3166_code_l
ists/english_country_names_and_code_elements.htm.)
untuk kode ISO negara Indonesia yaitu ID.
d. Terdapat kolom untuk mengisi icon flag ( bendera ) yang digunakan pada prestashop.
e. Untuk dapat mengetahui icon flag negara dapat dilihat pada (http://www.famfamfam.com/lab/icons/flags/) f. Back Office >> Tools >> Translations >> Translation
exchange >> Import a language pack. Lalu klik Browse untuk mencari file .gzip pada hard drive.
g. Klik import.
Menurut penulis, salah satu layanan penting yang harus ada pada setiap website adalah online help, dimana pelanggan atau calon pembeli dapat langsung berintersaksi dengan penjual. Dengan adanya layanan online, pelanggan bisa bertanya langsung tentang produk yang ingin atau telah dibelinya “after sales service”, dan penjual dapat melakukan pendekatan yang lebih kepada calon pembeli agar mereka yakin dengan produk yang ditawarkan.
Dengan demikian probabilitas terjadi penjualan menjadi lebih besar dan loyalitas pelanggan yang ada bisa terjaga. Untuk Prestashop ada satu modul yang dapat dipakai untuk layanan online ini, yaitu online help yang penulis temukan dengan bantuan alat pencari Google. Berikut caranya:
a. Download file online help.
b. Jika sudah dapat filenya, yang harus dilakukan berikutnya adalah tambah modul baru di back office prestashop dan atur posisi sesuai keinginan.
c. Lakukan konfigurasi. Caranya:
1. Cari file onlinehelp.tpl di folder modules. Bisa menggunakan FTP >> modules > onlinehelp.
2. Temukan baris yang seperti dibawah ini :
<a href="ymsgr:sendim?Your_Yahoo_ID"><img
src="http://opi.yahoo.com/online?u=Your_Ya
hoo_ID&m=g&t=14" width="128" height="100">
</a>.
3. Lalu ganti Your_Yahoo_ID dengan Yahoo ID yang ingin digunakan.
Penulis menambahkan integrasi s3slider dengan prestashop pada halaman home website Batik Shop yang berguna untuk menampilkan slideshow. Menggunakan script ini cukup dengan menyisipkan kode javascript, CSS
dan HTML (berupa list untuk .menampilkan image). Halaman depan yang memuat tampilan yang akan diganti sebetulnya adalah berupa modul bernama Editorial. Modul ini dapat ditemukan di folder modules\Editorial. Berikut caranya :
a. Download S3SliderFull.zip yang berisi script.
b. Ada beberapa file disana, antara lain: editorial.xml (sumber data), editorial.tpl (template layout), editorial.php (bertanggung jawab mengisi data dengan menggunakan layout diatas dan menampilkannya di halaman depan). Karena yang akan diubah adalah layoutnya, maka perubahan cukup dilakukan pada file editorial.tpl. (Tercantum di Lampiran).
c. Selanjutnya copy file S3Slider.js dan file image dari S3SliderFull.zip yang sudah di edit ke folder modules\editoral.
d. Buat file editorial.css di folder yang sama dan tambahkan kode. (Tercantum di Lampiran).
Selain itu, penulis menambahkan modul lainnya yang bermanfaat untuk memperbesar ukuran gambar saat di rollover oleh pelanggan. Berikut caranya:
a. Download dan ekstrak file imagesenlarge_v1_2.zip. b. Copy dan paste folder tersebut ke direktori modul.
c. Buka panel admin (back office), lalu klik tab modules. d. Klik tambah produk baru.
e. Klik Utilities, lalu klik instal.
Gambar 4.25 Add new modules image enlarge