HP Social Login adalah ekstensi OpenCart untuk melakukan login menggunakan social media seperti Facebook atau Google.

Instal module pada bagian pra install berikut sebelum instalasi.

Pra-Instal

1. Instal Admin Menu
2. Untuk OC 2.x → Instal: FTP Quick Fix
3. Untuk OC 3.x → Install: Base Theme Modification
4. Refresh Modifikasi dengan Akses: Extension → Modification. Klik tombol Refresh modifikasi di pojok kanan atas.

Setelah selesai dengan step diatas Anda bisa melanjutkan Instalasi sbb:

NB: Anda dapat melakukan disable base theme modification setelah instalasi.

Instalasi

1. Setelah melakukan pembelian Module HP Social Login, maka kalian akan mendapatkan sebuah file dengan format nama XXXX.ocmod.zip.

2. Navigasi ke halaman Extension → Extension Installer, kemudian upload file dengan nama XXXX.ocmod.zip tadi.

NOTE

Pada OC 2.x
Pastikan proses upload hingga terdapat pesan sukses: Success: The extension has been installed!
Jika muncul pesan kesalahan: … is using the same ID code as the one you are trying to upload!
Artinya Anda telah mengupload file yang sama sebelumnya. Sehingga Anda tidak perlu menguploadnya kembali.

Untuk Proses Update:
akan terjadi file override terhadap file lama. Klik tombol Continue untuk melanjutkan proses upload.

3. Akses menu Extensions → Modifications. Kemudian klik tombol Refresh pada bagian kanan atas, seperti tampak pada gambar berikut.

Refresh Modifikasi – HP Social Login OpenCart

4. Akses halaman module. Extension → Module / Extension → Extension, filter untuk Module (OC →= 2.3.0.x). Klik Install dan Edit HP Social Login. Sampai tahap ini Anda akan melihat halaman seting HP Social Login. Halaman yang sama dapat diakses via Admin Menu (HP Web Design → HP Social Login).

5. Store Validation

Validasi ini diadakan sehubungan dengan batasan license per purchase. Yakni 1 domain penggunaan pada 1 purchase.

Kirimkan Order ID dan domain install Anda ke email support@opencart.id

Dengan format:
Subject : Store Validation
Order ID : xxxx
Domain Store/Developtment Store domain : {eg. indolisterasi.com, dev.indoliterasi.com, etc.}

NOTE

Versi saat ini masih didesain agar dapat validasi otomatis saat di localhost. Hanya, Anda harus re-validate saat deployment. Jika tidak, maka HP Social Login tidak akan bekerja dengan baik. Dan otomatis akan menghapus semua seting HP Social Login yang dilakukan di localhost sebelumnya.

6. Tab General

• Status : Untuk melakukan aktivasi module.
• Customer Group : Customer Group yang diberikan ketika mendaftar menggunakan HP Social Login.
• Checkout Login : Menampilkan popup ketika checkout tetapi belum login.
• Google reCaptcha : Memberikan Google reCaptcha ketika register atau login.

Setting Login / Register Facebook

1. Buka link https://developers.facebook.com/apps/

2. Klik tombol Create App

3. Pilih Consumer.

4. Isi Display Name dengan nama website yang kalian gunakan.

5. Klik tombol Set Up pada Facebook Login.

6. Pilih Platform Web dan isikan URL web kalian.

7.  Buka halaman Settings pada Facebook Login.

8. Isi Form Valid OAuth Redirect URIs dengan :

https://{your domain}/index.php?route=extension/module/hp_social_login/facebook

setting 0Auth redirect URI on hp social login opencart

9. Buka halaman Basic melalui menu Settings > Basic. Isi semua sesuai informasi web kalian kecuali Namespace (optional).

10. Buka halaman App Review > Permissions and Features. Klik Get Advanced Access untuk public_profile dan email. Jika sudah Get Advanced Access akan tampil seperti di bawah ini.

11. Buat App Mode ke Live.

12. Copy App ID dan App Secret, agar dapat melihat App Secret tekan tombol Show.

13. Kembali ke halaman setting HP Social Login lalu paste App ID dan App Secret yang telah tadi kalian copy. Jangan lupa setting Status agar On.

Setting Login / Register Google

1. Buka link https://console.developers.google.com/apis/dashboard.

2. Jika belum memiliki Project, klik Select Project.

3. Klik New Project, lalu lakukan pengisian data. Jika sudah klik tombol Create.

4. Masuk ke halaman Credentials lalu klik Create Credentials. Pilih OAuth Client ID.

5. Pilih Web application pada Application type dan isi URIs dengan :

https://{your domain}/index.php?route=extension/module/hp_social_login/google

Lalu tekan tombol Create.

6. Copy Client ID dan Client Secret.

7. Kembali ke halaman setting HP Social Login lalu paste Client ID dan Client Secret. Jangan lupa setting Status agar On.

Setup di Journal Theme

Untuk setup pada Journal Theme diperlukan setting khusus agar HP Social Login dapat berfungsi.

Halaman Desktop

Untuk setting pada Halaman Desktop dapat dengan membuka Journal > Header > Top Menu > Secondary Menu.

Pilih menu Login, setting bagian link dengan custom lalu masukan :

javascript:openLoginModal();

Lakukan juga untuk Register, setting bagian link dengan custom lalu masukan :

javascript:openRegisterModal();

Halaman Mobile

Selain itu lakukan hal yang sama untuk Halaman Mobile, dapat dengan membuka Journal > Header > Top Menu > Top Menu – Mobile.