Merubah warna/menambah gambar pada background Prestashop 1.6.0.14

Merubah warna/menambah gambar pada background Prestashop 1.6.0.14 sebenarnya terbilang mudah dilakukan saya jamin anda semuanya pasti bisa, sekarang mari kita lakukan perubahan sedikit file global.css yang berada di C:\xampp\htdocs\presta16014\themes\default-bootstrap\css, bukalah file global.css dengan notepad++ seperti gambar dibawah ini :

Background: #fff;     script ini merubah warna background dari standard yang berwarna putih menjadi warna lain sesuai dengan pilihan anda, anda bisa menggunakan addon-nya mozilla yaitu  COLOR That Site!. untuk mencari warna yang anda inginkan. Sekarang cobalah anda rubah #fff  menjadi #345455 dan lihat hasilnya dibawah ini :

Selanjutnya jika background: #fff; dirubah menjadi background: url(../img/cute.jpg) repeat;     maka bagian ini akan merubah background dengan memberikan latar belakang berupa image/picture, file cute.jpg ini berukuran 215px x 185px atau sesuaikan dengan selera anda , file ini diletakan di C:\xampp\htdocs\presta16014\themes\default-bootstrap\img, contoh background image :

Lihat gambar dibawah ini, hasil dari perubahan dengan latarbelakang image :

Anda juga bisa mengtur background picture dengan memberikan script repeat / repeat-x; / repeat-y; bagian ini memberikan efect penyebaran image ke seluruh bagian halaman web baik secara  horizontal maupun vertikal , jika anda hanya menuliskan repeat-x maka penyebaran image hanya secara horizontal        ( 1 baris ) begitu juga dengan repeat-y penyebaran image dilakukan secara vertikal,.

Selamat mencoba……….

 

Module-Module Front Office di Prestashop 1.6.0.14

Semua modules yang ada pada prestashop dapat anda gunakan melalui Admin Panel / Control Panel, dibawah ini ada beberapa modules yang akan saya bahas.

Block Banner      
Block ini mengatur gambar pada banner bagian atas web anda perubahan ini dapat anda lakukan melalui Admin Panel – Modules – Modules – Banner Block ( lihat gambar )

Anda juga dapat melakukan perubahan terhadap script program ini dengan notepad++, script program ini berada  pada folder :
-    C:\xampp\htdocs\presta16014\modules\blockbanner
-    C:\xampp\htdocs\presta16014\themes\default-bootstrap\css\modules\blockbanner

Block Contact      
Block untuk menambahkan informasi yang diperlukan untuk customer online anda, Module ini dapat dibuka melalui Admin Panel – Modules – Modules – Contact Block ( lihat gambar )

Script program berada pada folder :
C:\xampp\htdocs\presta16014\modules\blockcontact
C:\xampp\htdocs\presta16014\modules\blockcontactinfos
C:\xampp\htdocs\presta16014\themes\default-bootstrap\css\modules\blockcontact
C:\xampp\htdocs\presta16014\themes\default-bootstrap\modules\blockcontact
C:\xampp\htdocs\presta16014\themes\default-bootstrap\modules\blockcontactinfos

Block Language
Block ini mengatur bahasa pengantar yang akan dipergunakan, Module ini dapat dibuka melalui Admin Panel – Modules – Modules – Language Block ( lihat gambar )

Module block language ini hanya memberikan 2 pilihan Enable/DisableScript program berada pada folder :
C:\xampp\htdocs\presta16014\modules\blocklanguages

Block User Info
Block untuk User informasi customer ke dalam database yang nantinya akan dipergunakan pada saat transaksi terjadi seperti Nama, Alamat, Email, dll

Module block user info ini hanya memberikan 2 pilihan Enable/Disable

Script program berada pada folder :
C:\xampp\htdocs\presta16014\modules\blockuserinfo
C:\xampp\htdocs\presta16014\themes\default-bootstrap\modules\blockuserinfo
C:\xampp\htdocs\presta16014\themes\default-bootstrap\css\modules\blockuserinfo

LOGO
Untuk merubah logo seperti yang anda inginkan bukalah Admin Panel – Preferences – Themes

Block Search

  Module block language ini hanya memberikan 2 pilihan Enable/Disable

Script program berada pada folder :
C:\xampp\htdocs\presta16014\modules\blocksearch
C:\xampp\htdocs\presta16014\themes\default-bootstrap\css\modules\blocksearch
C:\xampp\htdocs\presta16014\themes\default-bootstrap\modules\blocksearch

Block Cart

Konfigurasi Cart Block

Sekian Terima kasih

MERUBAH GAMBAR HOME SLIDER DI PRESTASHOP 1.6.0.14

Modules Home Slider ini berada pada folder C:\xampp\htdocs\presta16014\modules\homeslider 

Home Slider adalah gambar product yang muncul secara bergantian pada halaman utama, ini bisa kita setting melalui Admin Control / Dashboard /  Control Panel, lantas bagaimana caranya mengganti gambar yang sesuai dengan keinginan kita, mari kita bahas mengenai ini.

Bukalah Admin Control melalui browser dengan mengetikan pada browser http://localhost/presta16014/admin16014 ( admin16014 adalah folder yang berada pada C:\xampp\htdocs\presta16014\admin16014 ), anda akan diminta mengisi username dan password setelah itu halaman Admin Control akan disajikan, pilihlah menu Modules, Modules seperti gambar dibawah ini :

Selanjutnya pada halaman modules muncul carilah module dengan nama “image slider for your homepage”, jika anda diminta meng-update update-lah module ini, jika tidak lanjutkan dengan meng-klik “Configure”

 

Maka akan muncul halaman selanjutnya, pada halaman ini anda dapat melakukan pengaturan image slider dari meng-aktif-kan/me-nonaktif-kan gambar, perubahan gambar, lebar gambar, tingi gambar, keterangan gambar dan peng-hapus-an gambar

INSTALASI PRESTASHOP 1.6.0.14 DI LOCAL HOST / XAMPP SERVER

Persiapan yang harus anda lakukan adalah :
1.    Unduhlah CMS Prestashop melalui situs resminya yaitu :
       https://www.prestashop.com/download/old/prestashop_1.6.0.14.zip
2.    Jika anda belum mempunyai server untuk localhost unduhlah XAMPP server di
       http://www.nat32.com/xampp

Install terlebih dahulu XAMPP Server di PC anda kemudian lanjutkan dengan meng-Copy  CMS Prestashop di folder c:\xampp\htdocs\ (1 folder CMS mis : prestashop_1.6.0.14 singkat menjadi presta16014 ) lihat gambar :

 

Aktifkan XAMPP server dengan meng-klik shortcut XAMPP Control Panel di desktop, kemudian klik button start pada module Apache dan MySql seperti gambar berikut ini :

Buatlah sebuah file kosong di MySql dengan cara :
Jalankan Browser anda ketik http://localhost/phpmyadmin, Selanjutnya pada halaman phpMyadmin buatlah sebuah file seperti gambar berikut ini :

Setelah selesai klik button “create”, dan muncul sebuah dialog box yang menyatakan bahwa file database kosong ( tanpa table ) bernama  presta16014 telah selesai dibuat.

Jalankan browser  Firefox  anda dan ketikan http://localhost/presta16014 (atau sesuai dengan nama yang anda buat pada folder XAMPP)

Selanjutnya browser akan menampilkan proses peng-install-an Prestashop agar bisa digunakan seperti dibawah ini :

Bahasa pengantar yang akan kita gunakan biarkan secara default English (English),  jangan dirubah dengan bahasa yang lain karena belum tentu support dan pada akhirnya pada proses peng-install-an akan terjadi error, sehingga proses terhenti, kemudian klik “Next” button akan muncul dialog selanjutnya :

Berilah tanda “centang/curet” pada kotak text yang bertuliskan “ I agree to the above terms and conditions.” Kemudian klik “Next” button selanjutnya akan muncul

Isilah sesuai dengan keinginan anda contoh :

Information about your Store

Shop Name                    : isikan dengan nama toko online anda misal Handycraft plasa
Main activity                 : isikan dengan jenis usaha anda misal flower, gifts dan craft
Country                          : isikan dengan Indonesia atau negara lainnya
Shop time zone               : automaticaly muncul misal Asia/Jakarta
First name, Last name    : isikan dengan nama anda
Email address, Shop Password dan Re-type to confirm    : isikan email dan password anda ingat-ingatlah karena pada saat anda akan membuka admin control ( Back Ofiice ) akan diminta username / email dan password-nya.

Selanjutnya click Next button untuk melanjutkan….

Database server  address    : Default localhost
Database name                   : Isilah nama database yang sebelumnya anda buat
                                            melalui PHPMyAdmin misal : presta16014
                                            ( defaultnya : prestashop )
Database login                    : Default root
Database password            : sebaiknya anda isi demi keamanan web anda jika anda 
                                            menggunakan web host, tetapi jika tidak, bisa diabaikan
Tables prefix                       : Default ps_ anda bisa mengganti dengan prefix yang
                                            lain misal  ps_, tk_, px_, toko_ dll    hasilnya jika dilihat
                                            tabel  database-nya   akan seperti ini :

ps_                           tk_                         px_                            toko_
---------------------------------------------------------------------------------------
ps_access                 tk_access               px_access                  toko_access       
ps_accessory            tk_accessory          px_accessory             toko_accessory
ps_address               tk_address              px_address                toko_address

Setelah itu Click button Test your database connection now!  dan confirmasi berhasil ter-koneksi atau tidak akan diberikan seperti gambar diatas

Tahap selanjutnya jika semua berjalan dengan  lancar maka peng-install-an system Prestashop mulai dilakukan lihat gambar

Proses peng-installan berakhir setelah muncul pemberitahuan yang menyatakan installasi telah selesai dan anda diminta untuk mengingat email dan password serta menghapus folder Install lihat gambar

Lihat gambar dibawah, pesan ini menyatakan anda belum menghapus folder “install” lakukanlah demi keamanan web anda dari tangan-tangan jahil kemudian lanjutkan dengan membuka halaman Admin / Control Panel / Dashboard untuk mengelola web online anda dengan meng-klik alamat URL yang diberikan atau anda bisa menuliskan sendiri di browser

Setelah semua proses selesai anda bisa langsung melihat halaman web anda dengan meng-click “Discover your store” (front office ) atau masuk ke bagian admin panel/ Back Office / Control Panel  dengan meng-click  “Manage your store”

Penampilan Fron Office :

 Penampilan Back Office / Control Panel / Admin Panel :

Sekian,Terima kasih
Syah Jehan Muhammad