bukaOlshop versi 42.0 membawa fitur baru yaitu kostum halaman detail transaksi. Fitur ini memungkinkan anda untuk mengatur halaman detail transaksi menggunakan html, sehingga tampilan bisa lebih di kostumasi sesuai yang anda inginkan.
Sebelum menggunakan fitur ini, berikut hal-hal yang harus Anda ketahui:
- APK olshop memiliki versi bulid 67 keatas.
- Anda harus menggunakan paket BISNIS.
Sebelum memulai tutorial ini, kami ingatkan teman-teman agar teliti dalam memasang fitur ini agar tidak ada error seperti kesalahan sintaks dsb. Pastikan juga teman-teman memahami konsep dasar kode HTML.
Chapter 1 : Mengaktifkan Fitur
Untuk mengaktifkan fitur kostum detail transaksi, anda bisa mengaktifkannya di menu pada gambar dibawah:
Setelah anda mengaktifkan fitur kostum halaman detail transaksi, anda wajib memasang kode html yang akan digunakan nantinya. Untuk memasukan kode html, ikuti langkah-langkah berikut:
- Pindah ke tab TOKO, klik Personal Branding.
- Pindah ke tab KOSTUM HTML.
- Klik Kostum Halaman Detail Transaksi
Pada halaman input kode html ini, anda dapat memilih ingin menginput dalam bentuk html atau menggunakan script dari store. Jika anda ingin menggunakan script dari store, anda perlu menginstal script dengan kategori tampikan APK khusus, dengan posisi pemasangan di kostum halaman detail transaksi. Jika anda ingin menggunakan html, anda dapat memulainya dengan melakukan generate kode html template yang sudah bukaolshop sediakan, tombol generate kode html terletak di atas halaman dengan logo pensil.
Chapter 2 : Penjelasan Multi Transaksi dan Single Transaksi.
Pada halaman input html kostum detail transaksi, anda akan melihat kolom pertanyaan “Apakah script yang anda gunakan mendukung multi transaksi?”.
Berikut ini penjelasan maksud dari opsi tersebut.
Aplikasi olshop anda memungkinkan untuk melakukan pemesanan lebih dari satu produk, dan juga memungkinan untuk melakukan pemesanan berbeda lokasi pengiriman. Maka dari itu, menampilkan produk-produk pada transaksi tidak bisa dilakukan melalui shortcode biasa saja, namun diperlukan format json agar data transaksi dapat ditampilkan dengan lengkap.
Opsi “Ya, Mendukung multi transaksi” artinya script yang anda inputkan telah mendukung untuk menampilkan data pemesanan lebih dari satu produk, yang artinya script tersebut mengolah data json yang apk berikan untuk di tampilkan ke layar.
Sementara opsi “Tidak, Hanya single transaksi” artinya script hanya mendukung untuk menampilkan halaman, hanya jika pemesanan berjumlah 1 produk saja, jika transaksi memiliki lebih dari 1 produk, maka otomatis dialihkan ke halaman detail transaksi bawaan APK olshop. Jika opsi ini dipilih, anda hanya perlu menggunakan shortcode saja, tanpa perlu mengolah data json lagi.
Kami membuat opsi diatas, karena kami sadar bahwa tidak semua orang paham menggunakan javascript dan mengolah data json dengan baik, maka dari itu, kami buat opsi yang dapat anda pilih untuk mempermudah dalam pembuatan halaman.
Berikut panduan pilihan yang tepat untuk anda:
Pilih opsi “Ya, Mendukung multi transaksi” jika:
- Anda menggunakan generate kode template bawaan bukaOlshop.
- Anda menjual produk fisik, atau transaksi anda kemungkinan memiliki pesanan lebih dari 1 produk.
- Anda paham pemograman javascript/jquery, dan mengolah data json.
Pilih opsi “Tidak, Hanya single transaksi” jika:
- Anda hanya menjual produk digital, dan rata-rata jumlah pembelian produk hanya 1 tiap transaksi.
- Anda tidak terlalu mahir dalam pemograman, dan ingin mendesain halaman dengan cepat dan mudah.
Kode template bawaan bukaOlshop sudah mendukung multi transaksi
Chapter 3 : Shortcode Multi Transaksi.
Jika anda berencana membuat script yang mendukung multi transaksi, berikut ini daftar shortcode yang bisa anda gunakan:
Shortcode nomor 3, yaitu {{json_detail_transaksi}}, merupakan shortcode yang nantinya kan di replace dengan data json. Data json ini terdiri dari data transaksi, data produk yang dibeli, data alamat, dan url-url yang bisa anda langsung gunakan di dalam script. Anda harus mengolah data json ini dan menampilkannya ke layar sebagai informasi, contoh lengkap penggunaan json ini sudah kami sediakan di contoh script bawaan bukaolshop.
Jika anda meletakkan shortcode {{json_detail_transaksi}} di html, maka akan menghasilkan data json dengan struktur seperti gambar berikut:
Semua penjumlahan sudah dilakukan otomatis oleh server, anda tidak perlu melakukan penjumlahan apapun di javascript, cukup menampilkan angka yang ada di json ke layar.
Berikut ini penjelasan tipe data dari json diatas:
Contoh pengolahan data json ini lengkapnya bisa anda lihat sendiri di script yang bukaolshop sediakan. Selain itu, jika anda ingin mendownload script contoh ini langsung dan ingin mulai melakukan editing, kami sudah menyediakan script nya yang bisa anda download disini. Data di script tersebut sudah kami ganti ke data asli, jika anda sudah selesai melakukan editing dan ingin melakukan testing di apk olshop, ganti nilai var json_transaksi menjadi shortcode {{json_detail_transaksi}} kembali.
Chapter 4 : Shortcode Single Transaksi.
Jika anda tidak ingin ribet dalam mengolah data json, anda bisa mencoba opsi single transkasi ini. Opsi ini cocok bagi anda yang hanya menjual produk digital, dan tidak ingin repot mengolah data json. Anda dapat langsung meletakkan shortcode ke html langsung, dan untuk multi transaksi akan otomatis di alihkan ke detail transaksi bawaan bukaOlshop.
Berikut ini daftar shortcode yang bisa anda gunakan:
Terdapat sedikit penyesuaian yang harus anda lakukan dengan javascript dibagian alamat. Jika {{tipe_alamat_destinasi}} bernilai “ekspedisi”, maka anda gunakan shortcode yang berwarna biru, dan jika bernilai “delivery” maka gunakan shortcode yang berwarna orange. Jika fokus utama olshop anda hanya menjual produk digital, anda tidak perlu mengecek hal tadi dan bisa langsung menggunakan shortcode yang berwarna biru untuk menampilkan alamat.