<h1>Antarmuka</h1>
Disini kita akan mengenal antarmuka yang ada di BuntoApp. Ada dua komponen utama yang akan sering Anda lihat, yaitu Header Bar dan Tab Bar. Untuk header bar ada beberapa versi tampilan sesuai dengan kondisi halaman yang saat itu tampil. Kita akan membahas satu persatu mulai dari header bar.
<h2>Header Bar</h2>
Komponen utama yang akan sering Anda lihat ketika membuka website adalah Header Bar. Sesuai namanya, komponen ini berada diatas dari website kita dan akan tetap diatas walaupun websitenya di scroll. Ada beberapa versi tampilan dari header bar ini.
<h3>Tampilan Versi 1</h3>
<img src="https://antasena.site/assets/2021/8/13/1631518388395396.png" alt="Tampilan header bar versi 1" width="70%" height="70%" />
Pertama kita akan membahas yang versi satu. Terdapat empat komponen didalamnya antara lain adalah logo versi kecil, form pencarian, ikon notifikasi dan ikon untuk membuka menu.&nbsp;Beberapa halaman yang menerapkan Header Bar versi satu diantaranya <a href="https://app.buntoshop.com" target="_blank" rel="noopener">halaman utama</a>,&nbsp;<a href="https://app.buntoshop.com/categories" target="_blank" rel="noopener">daftar kategori</a>, dan <a href="https://app.buntoshop.com/search?q=a" target="_blank" rel="noopener">halaman pencarian produk.</a>
<ul>
<li style="font-weight: 400;" aria-level="1">Header menggunakan logo versi kecil karena agar ada cukup ruang yang tersedia untuk kolom input pencarian.</li>
<li style="font-weight: 400;" aria-level="1">Form pencarian digunakan untuk mencari barang yang ingin pengunjung cari agar lebih cepat ditemukan daripada mencari satu persatu. Cara menggunakannya adalah dengan mengetikan nama produk yang ingin Anda cari lalu tekan tombol Enter atau go pada keyboard.</li>
<li style="font-weight: 400;" aria-level="1">Ikon notifikasi digunakan untuk menerima pemberitahuan, untuk dapat melihat notifikasi maka user harus login dulu.</li>
<li style="font-weight: 400;" aria-level="1">Ikon menu ini digunakan untuk membuka menu, jika diklik maka akan muncul tampilan sebagai berikut</li>
</ul>
<img src="https://antasena.site/assets/2021/8/13/1631518388395325.png" alt="Tampilan detail menu" width="50%" height="50%" />
<h3>Tampilan Versi 2.A</h3>
<img src="https://antasena.site/assets/2021/8/14/1631591518115814.png" alt="Tampilan header bar versi 2.A" width="70%" height="70%" />
Kita buat namanya jadi 2.A ya karena memang agak mirip tampilannya dengan 2.B. Untuk tampilan versi 2.A ini hampir sama dengan versi satu.&nbsp; Yang membedakan hanya tombol kembali dan keranjang. Ketika tombol kembali di klik maka akan kembali ke halaman sebelumnya. Begitupun dengan tombol keranjang di klik maka akan menuju ke halaman keranjang. Halaman yang menerapkan Header Bar versi 2.A yaitu <a href="https://app.buntoshop.com/p/zm-zaskia-mecca-yogya-peach-scarf-kerudung-segi-empat" target="_blank" rel="noopener">halaman detail produk</a>.
<h3>Tampilan Versi 2.B</h3>
<img src="https://antasena.site/assets/2021/8/14/1631591518115105.png" alt="Tampilan header bar versi 2.B" width="70%" height="70%" />
Selanjutnya adalah versi 2.B, jika dilihat sekilas memang hampir sama tapi jika kita lihat lagi yang membedakan adalah jika 2.A menampilkan ikon keranjang sedangkan 2.B menampilkan ikon notif, selebihnya sama. Beberapa halaman yang menerapkan Header Bar versi 2.B diantaranya <a href="https://app.buntoshop.com/c/olahraga" target="_blank" rel="noopener">detail kategori</a> dan <a href="https://app.buntoshop.com/products" target="_blank" rel="noopener">semua produk</a>.
<h3>Tampilan Versi 3</h3>
<img src="https://antasena.site/assets/2021/8/14/163159151811512.png" alt="Tampilan header bar versi 2.B" width="70%" height="70%" />
Yang terakhir adalah versi tiga. Tampilan versi tiga ini berbeda dengan versi satu dan dua yang dimana jika versi satu dan dua menggunakan input pencarian di bagian tengah, sedangkan versi tiga tidak ada melainkan judul dari halaman itu sendiri. Lalu disebelah kanan ada ikon rumah, jika di klik akan mengarah ke halaman depan website atau <a href="https://app.buntoshop.com" target="_blank" rel="noopener">home page</a>. Dominan halaman menggunakan header bar versi tiga. Beberapa halaman yang menerapkan Header Bar versi 3 diantaranya <a href="https://app.buntoshop.com/flash-sale" target="_blank" rel="noopener">flash sale</a>, <a href="https://app.buntoshop.com/section/fashion-branded-sale" target="_blank" rel="noopener">section produk</a>, <a href="https://app.buntoshop.com/cart" target="_blank" rel="noopener">keranjang</a>, dan masih banyak lagi.
<h2>Tab Bar</h2>
<img style="font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;" src="https://antasena.site/assets/2021/8/14/1631591518115624.png" alt="Tampilan Tab Bar" width="70%" height="70%" />
Komponen utama selanjutnya yang akan sering Anda lihat adalag Tab Bar. komponen ini berada menempel dibawah walaupun websitenya di scroll. Item berwarna biru(sesuai warna dari websitenya) menandakan halaman yang aktif. Jika ikon dan teks kategori berwarna biru artinya halaman yang sedang dibuka adalah halaman kategori. Ada beberapa item yang ada didalam Tab Bar. Diantaranya adalah Beranda, Kategori, Blog, Keranjang, dan Akun. Jika Anda menetapkan untuk tidak menggunakan sistem user maka item Akun akan hilang sehingga hanya ada empat saja item yang akan ditampilkan.
&nbsp;

Disini penulis akan menjelaskan terlebih dahulu mengenai BuntoApp, jika Anda ingin melihat panduan cara instalasi silakan menuju ke menu Cara Instal
<h1>Memulai</h1>
Selamat datang di panduan Buntoshop!
Disini penulis akan membahas panduan instalasi hingga penggunaan dari website BuntoApp (produk dari Buntoshop). Jika Anda ingin mengakses demo website, Anda dapat membuka url https://app.buntoshop.com pada browser atau <a href="https://app.buntoshop.com" target="_blank" rel="noopener">klik disini</a>.
Jika Anda memiliki pertanyaan mengenai Buntoshop, Anda dapat mengirim pesan ke WhatsApp kami <a href="https://wa.me/6282322105137" target="_blank" rel="noopener">klik disini</a> atau sosial media kami yang tertera di bagian footer website ini.
&nbsp;
<h2>Apa itu Buntoshop</h2>
Buntoshop adalah sebuah platform atau situs yang menyediakan source code atau script website toko online. BuntoApp adalah nama dari source code atau script website toko online milik Buntoshop.
<ul>
<li style="font-weight: 400;" aria-level="1">Kenapa memilih Buntoshop? <a href="https://buntoshop.com" target="_blank" rel="noopener">klik disini</a> untuk tahu jawabannya.</li>
<li style="font-weight: 400;" aria-level="1">Beberapa pertanyaan yang mungkin Anda tanyakan dapat dilihat di home page Buntoshop atau <a href="https://buntoshop.com" target="_blank" rel="noopener">klik disini</a>.&nbsp;</li>
</ul>
<ul>
<li style="font-weight: 400;" aria-level="1">Fitur dari Buntoshop dapat dilihat disini <a href="https://buntoshop.com/features" target="_blank" rel="noopener">buntoshop.com/features</a>.</li>
<li style="font-weight: 400;" aria-level="1">Harga dan paket dari Buntoshop dapat dilihat disini <a href="https://buntoshop.com/pricing" target="_blank" rel="noopener">buntoshop.com/pricing</a></li>
</ul>
&nbsp;
<h2>Buka Websitenya</h2>
Untuk dapat membuka toko online BuntoApp Anda dapat membuka di browser pada perangkat handphone/mobile, tablet maupun desktop. Karena toko online ini berbentuk website maka Anda tidak perlu menginstalnya di perangkat yang Anda gunakan.
Silakan buka alamat ini <a href="https://app.buntoshop.com" target="_blank" rel="noopener">https://app.buntoshop.com</a> di browser atau jika Anda sudah membeli scriptnya dan memilikinya maka bisa dibuka pada domain Anda sendiri.
&nbsp;
<h3>Tampilan Desktop</h3>
<img src="https://antasena.site/assets/2021/8/13/1631518388395140.png" alt="Tampilan BuntoApp pada desktop Macbook Pro" width="100%" height="100%" />
&nbsp;
<h3>Tampilan Tablet</h3>
<img src="https://antasena.site/assets/2021/8/13/1631518388395213.png" alt="Tampilan BuntoApp pada tablet iPad PRO 11" width="70%" height="70%" />
<h3>&nbsp;</h3>
<h3>Tampilan Mobile</h3>
<img src="https://antasena.site/assets/2021/8/13/1631518388395591.png" alt="Tampilan BuntoApp pada handphone iPhone 11 Pro Max" width="50%" height="50%" />

<h1>Cara Instal di macOS</h1>
Untuk tutorial ini penulis akan menggunakan aplikasi web server bernama XAMPP, jika Anda sudah punya atau ingin menggunakan web server yang lain bisa skip tutorial instal aplikasi XAMPP ini dan Anda bisa langsung scroll kebawah untuk melihat tutorial pemasangan source code.
<h2>XAMPP Web Server</h2>
<ol>
<li>Untuk download aplikasi XAMPP, Anda bisa mengunjungi link <a href="https://www.apachefriends.org/download.html" target="_blank" rel="noopener">https://www.apachefriends.org/download.html</a>. Silakan ke bagian XAMPP for OS X dan pilih versi yang diinginkan (disarankan menggunakan versi 7 keatas). Setelah selesai download, silakan instal aplikasi tersebut seperti instal aplikasi di macOS pada umumnya.</li>
<li>Silakan buka aplikasinya. Berikut adalah tampilan dari aplikasi XAMPP.<img src="https://antasena.site/assets/2023/2/27/167992552874122.png" alt="Aplikasi XAMPP" width="80%" height="80%" /></li>
<li>Klik tab Manage Servers. Setelah itu klik tombol Start All yang ada di bawah hingga Statusnya menjadi&nbsp;Running dan berwarna hijau.<img src="https://antasena.site/assets/2023/2/27/1679925528741890.png" alt="Manage Server XAMPP" width="80%" height="80%" /></li>
<li>Buka browser lalu ketikan localhost atau http://localhost atau localhost/dashboard. Jika muncul tampilan seperti ini berarti web server sudah siap digunakan.<img src="https://antasena.site/assets/2023/2/27/1679925528741983.png" alt="Dashboard Localhost" width="100%" height="100%" /></li>
</ol>
<h2>Pemasangan Source Code</h2>
<ol>
<li>Pastikan Anda sudah download file source code-nya. Selanjutnya extract source code tersebut dan pindahkan folder source code-nya ke htdocs web server (jika Anda menggunakan XAMPP, biasanya folder htdocs ada di Applications/XAMPP/xamppfiles/htdocs<img src="https://antasena.site/assets/2023/2/27/1679925528741740.png" alt="folder htdocs" width="80%" height="80%" /></li>
<li>Pastikan dulu agar folder tersebut bisa di Read &amp; Write. Caranya klik kanan pada folder lalu klik Get Info.&nbsp;Akan muncul tampilan seperti dibawah. Pada bagian&nbsp;Sharing &amp; Permissions&nbsp;silakan ubah semua privilege menjadi Read &amp; Write<img src="https://antasena.site/assets/2023/2/27/1679925528741101.png" alt="get info mac" width="50%" height="50%" /></li>
<li>Lakukan hal yang sama seperti langkah ke-2 pada folder application/config dan file application/config/config.php</li>
<li>Setelah itu silakan buka browser dan ketikan localhost/[nama-foldernya] (misal: localhost/buntoapp) maka akan terbuka halaman instalasi seperti ini<img src="https://antasena.site/assets/2023/2/27/1679925528741744.png" alt="installasi page buntoapp" width="100%" height="100%" /></li>
<li>Silakan isi form tersebut dengan ketentuan sebagai berikut:
<ul>
<li>Hostname: localhost (biarkan default)</li>
<li>Username: root (jika Anda menggunakan XAMPP maka root adalah username default)</li>
<li>Password: (silakan kosongi saja jika Anda menggunakan XAMPP, karena default password XAMPP adalah kosong)</li>
<li>Database: buntoapp_db (isi sesuai keinginan)</li>
<li>URL: http://localhost/buntoapp (buntoapp diisi dengan nama folder yang ada di htdocs)</li>
</ul>
</li>
<li>Setelah diisi selanjutnya kllik tombol&nbsp;Install. Jika tampil seperti ini artinya instalasi source code sudah berhasil<img src="https://antasena.site/assets/2023/2/27/1679925528741955.png" alt="instalasi berhasil buntoapp" width="100%" height="100%" /></li>
</ol>
<h2>Konfigurasi Email</h2>
Penulis menyarankan Anda agar memiliki hosting atau server agar bisa melakukan konfigurasi email. Konfigurasi email ini berfungsi agar fitur kirim email dapat berfungsi, misal ketika user daftar maka akan mendapatkan email verifikasi.
Jika Anda sudah punya hosting (cPanel) silakan menuju ke menu Cara Instal di Hosting atau <a href="cara-instal-di-hosting" target="_blank" rel="noopener">klik disini</a> karena disitu ada panduan konfigurasi email di cPanel.
Jika Anda tidak memiliki hosting atau server, Anda dapat mematikan fitur verifikasi email (ketika user daftar) pada pengaturan admin panel. Buka panduan pada menu&nbsp;Beberapa Opsi atau <a href="beberapa-opsi" target="_blank" rel="noopener">klik disini</a> untuk melihat caranya.
<h2>Konfigurasi Midtrans (Payment Gateway)</h2>
Konfigurasi yang tidak kalah penting adalah payment gateway Midtrans. Silakan buka menu&nbsp;Payment Gateway Midtrans atau <a href="payment-gateway-midtrans" target="_blank" rel="noopener">klik disini</a> untuk melihat panduan secara lengkap.

Saat ini panduan instalasi di Windows belum tersedia atau masih dalam proses. Silakan gunakan panduan&nbsp; PDF dibawah. Pada konfigurasi email silakan di abaikan saja karena sudah tidak relevan lagi untuk sekarang.&nbsp;
<a href="https://drive.google.com/file/d/1PpHKy2BCy_DryMPS0Vj-kKANDiyEEoTM/view" target="_blank" rel="noopener">https://drive.google.com/file/d/1PpHKy2BCy_DryMPS0Vj-kKANDiyEEoTM/view</a>
<h2>Konfigurasi Email</h2>
Penulis menyarankan Anda agar memiliki hosting atau server agar bisa melakukan konfigurasi email. Konfigurasi email ini berfungsi agar fitur kirim email dapat berfungsi, misal ketika user daftar maka akan mendapatkan email verifikasi.
Jika Anda sudah punya hosting (cPanel) silakan menuju ke menu Cara Instal di Hosting atau <a href="cara-instal-di-hosting" target="_blank" rel="noopener">klik disini</a> karena disitu ada panduan konfigurasi email di cPanel.
Jika Anda tidak memiliki hosting atau server, Anda dapat mematikan fitur verifikasi email (ketika user daftar) pada pengaturan admin panel. Buka panduan pada menu&nbsp;Beberapa Opsi atau <a href="beberapa-opsi" target="_blank" rel="noopener">klik disini</a> untuk melihat caranya.
<h2>Konfigurasi Midtrans (Payment Gateway)</h2>
Konfigurasi yang tidak kalah penting adalah payment gateway Midtrans. Silakan buka menu&nbsp;Payment Gateway Midtrans atau <a href="payment-gateway-midtrans" target="_blank" rel="noopener">klik disini</a> untuk melihat panduan secara lengkap.

<h1>Cara Instal di Hosting</h1>
Sebelum melakukan instalasi source code di hosting, pastikan Anda sudah memiliki hosting dan domain dulu. Jika belum, Anda bisa membeli di DomaiNesia dengan menekan link <a href="https://www.domainesia.com/?aff=13295" target="_blank" rel="noopener">https://www.domainesia.com/?aff=13295</a>, lalu saat checkout masukan kode promo BSHOST&nbsp;untuk mendapatkan potongan harga sebesar 30% jika memilih siklus 1 tahun atau 2 tahun. Jika hosting dan domain sudah siap silakan ikuti tutorial dibawah ini.
<h2>Buat Subdomain</h2>
<ol>
<li>Silakan login ke cPanel masing-masing. Disini penulis menggunakan hosting dari DomaiNesia, sehingga bisa jadi ada beberapa langkah yang berbeda, silakan di sesuaikan saja. Jika mengalami kendala silakan hubungi kami.</li>
<li>Disini penulis akan menginstal source code pada subdomain, jika Anda ingin install di domain utama silakan scroll ke bagian Unggah File.</li>
<li>Silakan scroll kebawah hingga menemukan&nbsp;menu&nbsp;Domains atau Anda bisa mencari pada search.<img src="https://antasena.site/assets/2023/2/27/167992552874161.png" alt="cpanel" width="100%" height="100%" /></li>
<li>Pada halaman Domains silakan klik tombol&nbsp;Create A New Domain dan akan muncul halaman seperti dibawah. Silakan isi kolom Domain&nbsp;dengan subdomain yang diinginkan. Setelah itu klik tombol&nbsp;Submit.<img src="https://antasena.site/assets/2023/2/27/1679925528741992.png" alt="add domain" width="100%" height="100%" /></li>
<li>Jika sudah muncul subdomain yang baru Anda buat berarti subdomain berhasil dibuat.<img src="https://antasena.site/assets/2023/2/27/1679925528741491.png" alt="list domain" width="100%" height="100%" /></li>
</ol>
<h2>Unggah File</h2>
<ol>
<li>Setelah subdomain berhasil dibuat, silakan buka folder subdomain yang Anda buat. Anda bisa membuka File Manager&nbsp;dengan mengetikkan pada kolom pencarian di kanan atas atau jika ingin simpel Anda bisa klik /buntoapp.antasena.site&nbsp;yang berada di kolom Document Root pada gambar diatas (silakan sesuaikan dengan punya Anda sendiri).</li>
<li>Setelah File Manager terbuka, silakan Anda klik tombol Upload.<img src="https://antasena.site/assets/2023/2/28/1680009533252347.png" alt="file manager" width="100%" height="100%" /></li>
<li>Akan muncul tampilan seperti dibawah. Anda bisa drag &amp; drop file ke kotak atau bisa klik tombol&nbsp;Select File. Selanjutnya proses unggah file akan berlangsung.<img src="https://antasena.site/assets/2023/2/28/1680009533252409.png" alt="upload file" width="100%" height="100%" /></li>
<li>Tunggu hingga proses unggah selesai yang ditandai dengan progress bar berwarna hijau. Setelah itu Anda bisa close saja tab-nya.<img src="https://antasena.site/assets/2023/2/28/1680009533252889.png" alt="progress 100%" width="80%" height="80%" /></li>
<li>Pada tab File Manager, silakan Anda klik&nbsp;Reload dan akan muncul file source code yang baru saja. Anda unggah.<img src="https://antasena.site/assets/2023/2/28/1680009533252565.png" alt="" width="80%" height="80%" /></li>
<li>Setelah itu Anda extract file source code-nya dengan cara klik kanan pada file buntoapp.zip lalu klik&nbsp;Extract.&nbsp;Setelah muncul popup seperti ini langsung aja klik tombol&nbsp;Extract Files.<img src="https://antasena.site/assets/2023/2/28/1680009533252536.png" alt="extract file popup" width="80%" height="80%" /></li>
<li>Jika sudah di extract, silakan buka folder buntoapp&nbsp;dan akan muncul file dan folder source code.<img src="https://antasena.site/assets/2023/2/28/168000953325279.png" alt="source code" width="100%" height="100%" /></li>
<li>Jika Anda tidak melihat file&nbsp;.htaccess&nbsp;kemungkinan belum di setting. Silakan Anda klik tombol&nbsp;Setting&nbsp;yang berada di pojok kanan atas. Lalu centang pada&nbsp;Show Hidden Files (dotfiles)&nbsp;setelah itu klik&nbsp;Save.&nbsp;Seharusnya sekarang file&nbsp;.htaccess&nbsp;muncul. Jika masih belum muncul kemungkinan file-nya hilang, silakan hubungi kami.<img src="https://antasena.site/assets/2023/2/28/1680009533252848.png" alt="setting file manager" width="100%" height="100%" /></li>
<li>Selanjutnya kita akan memindahkan file dan folder source code ini keluar, karena tadi kita harus masuk dulu ke folder buntoapp untuk melihat file dan folder source code-nya.</li>
<li>Silakan Anda klik&nbsp;Select All&nbsp;lalu klik&nbsp;Move setelah itu hapus&nbsp;buntoapp hingga menyisakan Document Root-nya, selanjutnya klik&nbsp;Move Files.<img src="https://antasena.site/assets/2023/2/28/1680009533252617.png" alt="move source code" width="100%" height="100%" /></li>
<li>Maka sekarang isinya akan hilang dan berpindah ke Document Root, silakan klik tombol&nbsp;Back&nbsp;dan Anda akan melihat file dan source yang tadi didalam folder&nbsp;buntoapp sudah berpindah ke Document Root.<img src="https://antasena.site/assets/2023/2/28/1680009533252413.png" alt="directory is empty" width="80%" height="80%" /></li>
<li>Jika mau, Anda bisa menghapus folder yang tidak terpakai dan menyisakan folder penting dan isinya hanya seperti ini.<img src="https://antasena.site/assets/2023/2/28/168000953325286.png" alt="source code buntoapp" width="100%" height="100%" /></li>
<li>Selanjutnya silakan Anda buka folder application/config/ dan buka file config.php. Silakan ubah yang tadinya TRUE menjadi FALSE. Jika sudah silakan simpan dengan menekan tombol&nbsp;Save Changes yang ada di pojok kanan atas.<img src="https://antasena.site/assets/2023/2/28/1680009533252517.png" alt="config.php" width="50%" height="50%" /></li>
</ol>
<h2>Setting Database</h2>
<ol>
<li>Pada cPanel, klik&nbsp;MySQL Databases&nbsp;atau bisa search pada kolom pencarian di kanan atas.<img src="https://antasena.site/assets/2023/2/28/1680009533252160.png" alt="mysql databases" width="80%" height="80%" /></li>
<li>Silakan masukkan nama database dengan nama bebas. Setelah klik tombol Create Database.<img src="https://antasena.site/assets/2023/2/28/1680009533252629.png" alt="database name" width="80%" height="80%" /></li>
<li>Setelah database berhasil dibuat, silakan klik tombol Go Back.</li>
<li>Silakan scroll kebawah hingga menemukan bagian ini. Isi kolom username (bebas), password, setelah itu klik tombol Create User.<img src="https://antasena.site/assets/2023/2/28/1680009533252967.png" alt="create user db" width="80%" height="80%" /></li>
<li>Scroll kebawah lagi hingga Add User To Database. Silakan pilih user dan database yang sudah Anda buat tadi. Setelah itu klik Add.<img src="https://antasena.site/assets/2023/2/28/1680009533252624.png" alt="add user to database" width="80%" height="80%" /></li>
<li>Akan muncul halaman seperti ini. Silakan di centang pada&nbsp;ALL PRIVILEGES dan otomatis semua akan ikut tercentang. Selanjutnya scroll kebawah dan klik tombol&nbsp;Save Changes.<img src="https://antasena.site/assets/2023/2/28/1680009533252647.png" alt="add privileges database" width="80%" height="80%" /></li>
<li>Pembuatan database sudah selesai. Pastikan Anda menyimpan atau mengingat data username, password, dan nama database-nya karena akan kita gunakan pada langkah selanjutnya.</li>
</ol>
<h2>Instal Website</h2>
<ol>
<li>Silakan buka website Anda di browser. Contoh: domain.com&nbsp;atau&nbsp;subdomain.domain.com. maka akan terbuka halaman instalasi seperti ini.<img src="https://antasena.site/assets/2023/2/28/1680009533252505.png" alt="halaman instalasi buntoapp" width="100%" height="100%" /></li>
<li>Silakan isi form tersebut dengan ketentuan sebagai berikut:
<ul>
<li>Hostname:&nbsp;localhost&nbsp;(biarkan default)</li>
<li>Username: Seperti yang sudah Anda buat pada langkah ke-4</li>
<li>Password: Seperti yang sudah Anda buat pada langkah ke-4</li>
<li>Database: Seperti yang sudah Anda buat pada langkah ke-2</li>
<li>URL: Masukkan nama domain Anda, misal https://domain.com jika Anda instal website di domain utama atau https://subdomain.domain.com jika Anda instal website di subdomain.</li>
</ul>
</li>
<li>Setelah semuanya diisi, selanjutnya klik tombol Install yang berwarna bitu. Jika tampil seperti ini artinya instalasi source code sudah berhasil.<img src="https://antasena.site/assets/2023/2/28/168000953325239.png" alt="instalasi buntoapp berhasil" width="100%" height="100%" /></li>
</ol>
<h2>Konfigurasi Email</h2>
Konfigurasi email ini berfungsi agar fitur kirim email dapat berfungsi, misal ketika user daftar maka akan mendapatkan email verifikasi. Disini penulis akan menggunakan fitur Email Account yang ada di cPanel.
<ol>
<li>Pada cPanel silakan klik Email Account,&nbsp;atau jika tidak ketemu bisa cari pada kolom pencarian di kanan atas.<img src="https://antasena.site/assets/2023/2/28/1680009533252486.png" alt="email account menu" width="80%" height="80%" /></li>
<li>Akan muncul tampilan dari halaman Email Account, silakan klik tombol&nbsp;Create&nbsp;yang berada di sebelah kanan atas.</li>
<li>Silakan pilih domain, Anda bisa menggunakan domain/subdomain dari website Anda yang tadi sudah dibuat. Isi juga username (bebas) dan password. Setelah itu scroll kebawah dan klik tombol&nbsp;Create yang berwarna biru.<img src="https://antasena.site/assets/2023/2/28/1680009533252180.png" alt="create email" width="80%" height="80%" /></li>
<li>Email berhasil dibuat, selanjutnya memasang email yang sudah dibuat di website.</li>
<li>Buka website Anda dan masuk ke admin panel dengan menambahkan /admin-panel. Contoh:&nbsp;htttps://domain.com/admin-panel&nbsp;<img src="https://antasena.site/assets/2023/2/28/1680009533252335.png" alt="login admin panel" width="100%" height="100%" />Username:&nbsp;adminPassword:&nbsp;adminHarap ganti username dan password setelah login untuk keamanan akun Anda</li>
<li>Setelah login, silakan buka menu&nbsp;Pengaturan&nbsp;lalu submenu&nbsp;Server Email<img src="https://antasena.site/assets/2023/2/28/1680009533252736.png" alt="server email" width="100%" height="100%" /></li>
<li>Silakan isi semua kolomnya. Jika tidak ada tombol simpan, berarti ketika Anda mengisi salah satu kolom lalu klik diluar kolom maka otomatis data pada kolom itu akan tersimpan secara otomatis.
<ul>
<li>Mail SMTP Host: mail.domain.com atau mail.subdomain.domain.com&nbsp;(ganti domain atau subdomain.domain dengan domain/subdomain website Anda)</li>
<li>Mail SMTP Port:&nbsp;465</li>
<li>Mail SMTP Crypto:&nbsp;ssl</li>
<li>Mail Username: Username email yang Anda buat pada langkah ke-3</li>
<li>Mail Password: Password email yang Anda buat pada langkah ke-3<img src="https://antasena.site/assets/2023/2/28/1680009533252657.png" alt="server email form" width="100%" height="100%" /></li>
</ul>
</li>
<li>Konfigurasi email sudah selesai. Silakan di tes dengan melakukan pendaftaran user. Jika mengalami kendala silakan hubungi kami melalui WhatsApp.</li>
</ol>
<h2>Konfigurasi Midtrans (Payment Gateway)</h2>
Konfigurasi yang tidak kalah penting adalah payment gateway Midtrans. Silakan buka menu&nbsp;Payment Gateway Midtrans atau <a href="payment-gateway-midtrans" target="_blank" rel="noopener">klik disini</a> untuk melihat panduan secara lengkap.

<h1>Payment Gateway Midtrans</h1>
Midtrans adalah salah satu layanan payment gateway yang ada di Indonesia. Dengan Midtrans, Anda dapat menerima pembayaran dari pembeli secara otomatis. Pembeli melakukan pembelian produk di website Anda, setelah itu pembeli tinggal transfer ke nomor virtual account yang sudah ditentukan, dan otomatis status transaksi yang tadinya Menunggu Pembayaran berubah menjadi Sudah Dibayar, dan Anda bisa langsung memproses pesanan, tidak perlu lagi menerima bukti transfer dari pembeli karena sistem Midtrans yang akan mengurusi semuanya.
Pelajari secara lengkap mengenai Midtrans di situs resminya <a href="https://midtrans.com/" target="_blank" rel="noopener">https://midtrans.com/</a>
Ikuti panduan berikut untuk melakukan konfigurasi Midtrans dan menghubungkan dengan website Anda.
<ol>
<li>Daftar Midtrans terlebih dahulu jika belum punya akun, Anda bisa mengakses link <a href="https://dashboard.midtrans.com/register" target="_blank" rel="noopener">https://dashboard.midtrans.com/register</a></li>
<li>Silakan isi semua kolom yang tersedia lalu klik tombol Daftar.<img src="https://antasena.site/assets/2023/2/29/1680079770618516.png" alt="midtrans register page" width="100%" height="100%" />
<ul>
<li>NAMA BISNIS: Isi dengan nama bisnis atau nama toko online Anda.</li>
<li>NAMA LENGKAP: Isi dengan nama lengkap Anda.</li>
<li>EMAIL BISNIS: Isi dengan email bisnis atau email pribadi Anda.</li>
<li>NOMOR TELEPON BISNIS: Isi dengan nomor telepon bisnis atau nomor telepon pribadi Anda.</li>
<li>PASSWORD: Buat password akun Anda</li>
<li>KONFIRMASI PASSWORD: Tulis ulang password Anda</li>
</ul>
</li>
<li>Buka email Anda yang digunakan untuk melakukan pendaftaran Midtrans lalu lakukan verifikasi email seperti biasa.</li>
<li>Pastikan Anda memilih tab&nbsp;Merchant dan silakan login menggunakan email dan password yang sudah Anda buat.<img src="https://antasena.site/assets/2023/2/29/1680079770618333.png" alt="login page midtrans" width="50%" height="50%" /></li>
<li>Berikut adalah tampilan dashboard Midtrans ketika Anda berhasil login.<img src="https://antasena.site/assets/2023/2/29/1680079770618257.png" alt="midtrans dashboard" width="100%" height="100%" /></li>
</ol>
<h3>&nbsp;</h3>
<h3>Informasi:</h3>
Ada dua environment pada Midtrans yaitu Sandbox dan Production. Sandbox adalah environment yang bisa Anda gunakan untuk testing pembayaran sehingga nanti Anda bisa menggunakan simulator ketika membayar. Berbeda dengan Production yang bisa Anda gunakan jika ingin menerima pembayaran secara real dengan uang asli.
Disini penulis akan memberikan panduan kedua environment tersebut, silakan langsung scroll ke panduan environment yang ingin Anda gunakan.
&nbsp;
<h2>Environment Sandbox</h2>
<ol>
<li>Pastikan Anda sudah berada di environment sandbox dengan mengganti environment yang berada di kiri atas.<img src="https://antasena.site/assets/2023/2/29/1680079770618976.png" alt="change environment midtrans" width="80%" height="80%" /></li>
<li>Buka Menu&nbsp;PENGATURAN lalu submenu&nbsp;ACCESS KEYS dan akan muncul halaman Access Keys. Access Keys ini yang nanti harus Anda hubungkan dengan website Anda.<img src="https://antasena.site/assets/2023/2/29/1680079770618171.png" alt="access keys midtrans" width="100%" height="100%" /></li>
<li>Silakan buka folder source code website nya. Jika menggunakan cPanel ada di file manager, jika di macOS ada di folder Application/XAMPP/xamppfiles/htdocs/ atau mungkin ditempat lain silakan disesuaikan saja.<img src="https://antasena.site/assets/2023/2/29/1680079770618645.png" alt="finder macos" width="80%" height="80%" /> <img src="https://antasena.site/assets/2023/2/28/168000953325279.png" alt="file manager hosting" width="80%" height="80%" /></li>
<li>Setelah itu buka folder&nbsp;application/config/&nbsp;disitu ada file&nbsp;config.php silakan Anda buka dan isi sesuai ketentuan. Jangan lupa disimpan jika sudah melakukan perubahan.<img src="https://antasena.site/assets/2023/2/29/1680079770618387.png" alt="config.php" width="100%" height="100%" />
<ul>
<li>Line 7 isi dengan&nbsp;Client key&nbsp;yang ada di dashboard midtrans pada langkah ke-2.</li>
<li>Line 8 isi dengan Server key yang ada di dashboard midtrans pada langkah ke-2.</li>
<li>Line 9 isi dengan&nbsp;FALSE&nbsp;karena kita akan bermain-main dengan environment sandbox terlebih dahulu.</li>
</ul>
</li>
<li>Sekarang website Anda sudah terhubung dengan Midtrans. Untuk mengetes apakah sudah berfungsi dengan baik silakan Anda berbelanja pada website Anda. Jangan lupa ketika di halaman checkout pilih Metode Pembayaran Verifikasi Otomatis (Midtrans).<img src="https://antasena.site/assets/2023/2/29/1680079770618942.png" alt="checkout page buntoapp" width="80%" height="80%" /></li>
<li>Pada halaman berhasil silakan Anda klik tombol&nbsp;Pilih Metode Pembayaran. Jika muncul popup seperti ini (popup Midtrans) artinya konfigurasi Midtrans dan koneksi website Anda dengan Midtrans sudah berhasil.<img src="https://antasena.site/assets/2023/2/29/168007977061833.png" alt="popup midtrans" width="80%" height="80%" /></li>
<li>Kita akan mencoba simulasi pembayaran. Silakan pilih salah satu metode yang tersedia. Sebagai contoh penulis akan memilih Transfer bank&nbsp;dan memilih&nbsp;BCA. Akan muncul informasi cara bayar dan nomor virtual account. Silakan salin saja nomor virtual account-nya. <img src="https://antasena.site/assets/2023/2/29/1680079770618206.png" alt="midtrans payment method bca" width="80%" height="80%" /></li>
<li>Untuk mencoba melakukan simulasi pembayaran, Anda bisa menggunakan simulator yang disediakan oleh Midtrans pada link <a href="https://simulator.sandbox.midtrans.com/assets/index.html" target="_blank" rel="noopener">https://simulator.sandbox.midtrans.com/assets/index.html</a>. Setelah terbuka silakan Anda pilih menu Payment Page lalu pilih metode pembayaran yang tadi Anda pilih. Dalam hal ini penulis menggunakan BCA Virtual Account.<img src="https://antasena.site/assets/2023/2/29/16800797706182.png" alt="midtrans simulator" width="100%" height="100%" /></li>
<li>Setelah terbuka halamannya, silakan Anda tempelkan nomor virtual account yang tadi sudah disalin. Setelah itu klik tombol&nbsp;Inquire.<img src="https://antasena.site/assets/2023/2/29/168007977061895.png" alt="midtrans payment" width="80%" height="80%" /></li>
<li>Jika muncul halaman Payment Success artinya Anda sudah berhasil melakukan pembayaran.</li>
<li>Buka website toko online Anda dan tunggu maksimal 1 menit (biasanya hanya beberapa detik saja) maka akan langsung diarahkan ke halaman detail transaksi dengan status transaksi yaitu&nbsp;Menunggu Konfirmasi&nbsp;(sudah dibayar).<img src="https://antasena.site/assets/2023/2/29/1680079770618722.png" alt="detail transaction buntoapp" width="80%" height="80%" /></li>
<li>Anda bisa membuka halaman admin panel dan masuk ke menu&nbsp;Transaksi.&nbsp;Terdapat transaksi yang baru saja dilakukan dengan status pesanan Sudah Dibayar.<img src="https://antasena.site/assets/2023/2/29/1680079770618111.png" alt="admin panel buntoapp" width="100%" height="100%" /></li>
</ol>
Info:
Jika Anda melakukan di localhost dan statusnya tidak berubah, itu karena Midtrans tidak dapat mengirim status transaksi terbaru ke localhost. Sebagai solusi, Anda bisa menggunakan <a href="https://ngrok.com/" target="_blank" rel="noopener">https://ngrok.com/</a> agar localhost Anda bisa menjadi online dan dapat diakses secara publik. Untuk panduan menggunakan ngrok Anda bisa membaca dokumentasi yang di sediakan oleh ngrok atau mencari di google. Anda bisa menghubungi kami jika mengalami kendala atau merasa bingung.
&nbsp;
<h2>Environment Production</h2>
<ol>
<li>Pastikan Anda sudah berada di environment Production dengan mengganti environment yang berada di kiri atas.<img src="https://antasena.site/assets/2023/2/29/168007977061829.png" alt="environment production midtrans" width="80%" height="80%" /></li>
<li>Pada dashboard Midtrans terdapat banner berwarna oren yang menginformasikan bahwa Anda harus menyelesaikan registrasi Anda. Silakan di klik tombol&nbsp;di sini atau jika tidak ada banner tersebut Anda bisa klik link <a href="https://passport.midtrans.com/" target="_blank" rel="noopener">https://passport.midtrans.com/</a><img src="https://antasena.site/assets/2023/2/29/1680079770618517.png" alt="dashboard midtrans" width="100%" height="100%" /></li>
<li>Anda akan dibawa ke halama Registrasi Passport Midtrans,&nbsp;silakan dipilih berdasarkan tipe bisnis Anda. Jika Anda memiliki bisnis seperti PT, CV, Yayasan, dll. Anda bisa memilih Badan Usaha. Namun jika bisnis Anda adalah individu silakan pilih Perorangan.&nbsp;Setelah menentukan tipe bisnisnya, silakan klik Daftar.</li>
<li>Silakan Anda registrasi secara mandiri dengan mengikuti arahan dari Midtrans. Jika Anda mengalami kendala ketika registrasi, silakan hubungi pihak Midtrans dengan mengirimkan email ke activation@midtrans.com.</li>
<li>Penulis asumsikan Anda sudah melakukan aktivasi akun Midtrans dan sudah di approved. Selanjutnya adalah menghubungkan Midtrans dengan website kita.</li>
<li>Pada dashbord Midtrans, buka menu PENGATURAN&nbsp;lalu submenu&nbsp;ACCESS KEYS&nbsp;dan akan muncul halaman Access Keys. Access Keys ini yang nanti harus Anda hubungkan dengan website Anda.<img src="https://antasena.site/assets/2023/2/29/1680079770618947.png" alt="access keys midtrans" width="100%" height="100%" /></li>
<li>Silakan buka folder source code website nya. Jika menggunakan cPanel ada di file manager, jika di macOS ada di folder Application/XAMPP/xamppfiles/htdocs/ atau mungkin ditempat lain silakan disesuaikan saja.<img src="https://antasena.site/assets/2023/2/29/1680079770618645.png" alt="finder macos" width="80%" height="80%" /><img src="https://antasena.site/assets/2023/2/28/168000953325279.png" alt="file manager hosting" width="80%" height="80%" /></li>
<li>Setelah itu buka folder&nbsp;application/config/&nbsp;disitu ada file&nbsp;config.php&nbsp;silakan Anda buka dan isi sesuai ketentuan. Jangan lupa disimpan jika sudah melakukan perubahan.<img src="https://antasena.site/assets/2023/2/29/168007977061895.png" alt="settingan config.php" width="100%" height="100%" />
<ul>
<li>Line 7 isi dengan&nbsp;Client key&nbsp;yang ada di dashboard midtrans pada langkah ke-6.</li>
<li>Line 8 isi dengan&nbsp;Server key&nbsp;yang ada di dashboard midtrans pada langkah ke-6.</li>
<li>Line 9 isi dengan&nbsp;TRUE&nbsp;yang menandakan kita akan menggunakan environment Production dan siap untuk go live menerima pembayaran real.</li>
</ul>
</li>
<li>Sekarang website Anda sudah terhubung dengan Midtrans. Untuk mengetes apakah sudah berfungsi dengan baik silakan Anda berbelanja pada website Anda.
Info:
Jika Anda melakukan di localhost dan statusnya tidak berubah ketika sudah melakukan transaksi dan sudah bayar, itu karena Midtrans tidak dapat mengirim status transaksi terbaru ke localhost. Sebagai solusi, Anda bisa menggunakan <a href="https://ngrok.com/" target="_blank" rel="noopener">https://ngrok.com/</a> agar localhost Anda bisa menjadi online dan dapat diakses secara publik. Untuk panduan menggunakan ngrok Anda bisa membaca dokumentasi yang di sediakan oleh ngrok atau mencari di google. Anda bisa menghubungi kami jika mengalami kendala atau merasa bingung.
</li>
</ol>

<h1>Beberapa Opsi</h1>
Sebelum mengenal lebih dalam, kita akan membahas beberapa opsi pada wesbsite toko online yang bisa Anda pilih untuk menyesuaikan dengan kebutuhan Anda.
Disini penulis asumsikan Anda sudah memiliki toko online BuntoApp yang sudah dipasang sendiri atau jika belum, Anda dapat menggunakan website demo. Setelah semuanya siap mari kita menuju ke admin panel dengan cara sebagai berikut:
<ul>
<li>Buka halaman admin dengan mengetik url domain-anda.com/administrator pada browser Anda atau jika ingin menggunakan website demo bisa buka halaman <a href="https://app.buntoshop.com/administrator" target="_blank" rel="noopener">https://app.buntoshop.com/administrator</a>.</li>
<li>Akan muncul halaman login admin sebagai berikut, silakan masukan username&nbsp;admin&nbsp;dan password admin pada kolom yang tersedia. Anda juga dapat ceklis pada&nbsp;Ingat Saya supaya ketika suatu saat membuka halaman admin panel tidak perlu login lagi. Selanjutnya klik&nbsp;Login.</li>
</ul>
<img src="https://antasena.site/assets/2021/8/14/1631591518115788.png" alt="Halaman login admin BuntoApp" width="70%" height="70%" />
<ul>
<li>Selamat datang di halaman admin panel BuntoApp. Di sebelah kiri ada banyak menu, klik menu Pengaturan, lalu klik menu&nbsp;Pengaturan Website. Akan tampil halaman seperti dibawah ini. Kita akan memilih opsinya disini.</li>
</ul>
<img src="https://antasena.site/assets/2021/8/14/1631591518115517.png" alt="Halaman pengaturan website BuntoApp" width="100%" height="100%" />
&nbsp;
<h2>Role User</h2>
<h3>&rArr; Jika Diaktifkan</h3>
Apakah ketika ada orang yang mau beli produk kita maka dia harus login dulu (daftar jika belum memiliki akun)? Jika jawabannya adalah Iya maka Anda harus mengaktifkan&nbsp;Fitur Role User&nbsp;(sampai tombolnya berubah jadi berwarna biru).
<img src="https://antasena.site/assets/2021/8/14/1631591518115367.png" alt="Tombol fitur role user aktif" width="70%" height="70%" />
Lalu apa saja yang akan Anda dapatkan jika mengaktifkan fitur tersebut. Kita bagi menjadi dua bagian yaitu bagian depan dan belakang, bagian depan adalah bagian yang dapat dilihat oleh pengunjung website kita, bagian belakang adalah bagian yang hanya dapat dilihat oleh admin (admin panel).
Halaman Depan
<ul>
<li>Ikon notifikasi pada Header Bar akan ditampilkan, jika di klik akan mengarah ke halaman notifikasi. Akan tetapi jika pengguna belum login maka akan diarahkan ke halaman login.</li>
</ul>
<img src="https://antasena.site/assets/2021/8/13/1631518388395396.png" alt="Header Bar BuntoApp" width="70%" height="70%" />
<ul>
<li>Tab Bar akan menampilkan item Akun yang jika di klik maka akan mengarah ke halaman akun pengguna atau ke halaman login jika pengguna belum login.</li>
</ul>
<img src="https://antasena.site/assets/2021/8/14/1631591518115660.png" alt="Tab bar BuntoApp" width="70%" height="70%" />
<ul>
<li>Pastinya halaman yang krusial yaitu login dan daftar.</li>
</ul>
<img src="https://antasena.site/assets/2021/8/14/1631591518115739.png" alt="Halaman login BuntoApp" width="70%" height="70%" />
<ul>
<li>Halaman akun pengguna, disini pengguna dapat melihat pangkat, jumlah keranjang, jumlah notifikasi, jumlah point, dll. Kita akan membahasnya nanti pada panduan mengenai halaman akun pengguna.</li>
</ul>
<img src="https://antasena.site/assets/2021/8/14/163159151811595.png" alt="Halaman akun pengguna BuntoApp" width="70%" height="70%" />
&nbsp;
Halaman Belakang
<ul>
<li>Menu pengguna akan ditampilkan, jika di klik maka akan menampilkan daftar pengguna/user. Anda juga bisa melihat detail pengguna dengan menekan ikon mata berwarna hijau pada kolom Aksi.</li>
</ul>
<img src="https://antasena.site/assets/2021/8/14/1631591518115746.png" alt="Halaman pengguna admin panel" width="70%" height="70%" />
<ul>
<li>Selain menu pengguna, menu komplain dan menu bantuan juga akan ditampilkan.</li>
</ul>
<img src="https://antasena.site/assets/2021/8/14/1631591518115159.png" alt="Menu komplain dan bantuan di admin panel" width="50%" height="50%" />
<ul>
<li>Silakan buka menu&nbsp;Website, disitu Anda bisa melihat submenu&nbsp;Halaman Autentikasi&nbsp;dan Halaman User. Submenu tersebut juga akan ditampilkan ketika Anda mengaktifkan fitur Role User.</li>
</ul>
<img src="https://antasena.site/assets/2021/8/14/163159151811517.png" alt="Menu website" width="70%" height="70%" />
<ul>
<li>Yang terakhir, jika Anda buka menu Pengaturan&nbsp;maka Anda akan melihat ada submenu Pangkat User dan Poin User.</li>
</ul>
<img src="https://antasena.site/assets/2021/8/14/1631591518115451.png" alt="Menu pengaturan" width="70%" height="70%" />
&nbsp;
<h3>&rArr; Jika Dinonaktifkan</h3>
Lalu apa yang terjadi jika fitur&nbsp;Role User dinonaktifkan? Semua fitur atau menu yang sudah penulis sebutkan diatas akan dihilangkan atau tidak dapat digunakan.
Silakan disesuaikan dengan kebutuhan masing-masing apakah Anda menginginkan jika calon pembeli mau membeli produk harus login dulu atau tidak.
&nbsp;
<h2>Verifikasi Email</h2>
Opsi selanjutnya yang bisa Anda gunakan adalah verifikasi email, opsi ini berguna untuk memverifikasi email user apakah user benar-benar melakukan pendaftaran dengan emailnya atau hanya sekadar iseng dengan memasukan email acak. Jika diaktifkan maka ketika user melakukan pendaftaran akan diminta untuk verifikasi email agar user bisa login.
<img src="https://antasena.site/assets/2021/8/15/1631690963106714.png" alt="daftar verifikasi email" width="70%" height="70^" />
&nbsp;
<h2>Tipe Checkout</h2>
BuntoApp menyediakan dua opsi checkout yang bisa Anda pilih sesuai dengan kebutuhan. Yaitu checkout tetap di Website dan checkout menuju ke WhatsApp.
<img src="https://antasena.site/assets/2021/8/15/1631690963106651.png" alt="tipe checkout" width="70%" height="70%" />
<h3>Checkout tetap di Website</h3>
Jika Anda memilih opsi ini maka ketika user dari halaman keranjang dan mengisi data alamat serta metode pengiriman pada halaman checkout selanjutnya user akan diarahkan ke halaman transaksi berhasil seperti dibawah.
<img src="https://antasena.site/assets/2021/8/15/1631690963106639.png" alt="successfully order" width="50%" height="50%" />
<h3>Checkout menuju ke WhatsApp</h3>
Buat yang lebih suka sesuatu yang simpel maka opsi ini cocok untuk Anda gunakan, karena nantinya user akan diarahkan ke WhatsApp admin. Ketika Anda memilih opsi ini maka akan muncul pilihan opsi lagi dimana Anda dapat memilih Harus isi form dulu atau Langsung dari detail produk.
<img src="https://antasena.site/assets/2021/8/15/1631690963106736.png" alt="opsi checkout menuju wa" width="70%" height="70%" />
Sebelum itu kita harus melakukan pengaturan WhatsApp dulu. Caranya pada admin panel klik menu Pengaturan yang berada di sebelah kiri lalu klik submenu&nbsp;Pengaturan WhatsApp.
<img src="https://antasena.site/assets/2021/8/15/1631690963106484.png" alt="pengaturan whatsapp" width="70%" height="70%" />
Silakan ubah No. WhatsApp Tujuan Checkout dengan No. WhatsApp admin yang ingin menerima pesan. Sesuaikan juga kolom Konten Pesan WhatsApp&nbsp;dan kolom Daftar Produk&nbsp;atau Anda tidak perlu mengubahnya jika ingin menggunakan template default.
Informasi: Pada form yang tidak memiliki tombol simpan atau edit, setelah Anda mengedit atau mengetikkan sesuatu pada kolom, maka untuk menyimpannya Anda cukup klik pada area diluar kolom atau hingga border warna biru hilang. Silakan lihat gif dibawah.
<img src="https://antasena.site/assets/2021/8/15/1631690963106409.gif" alt="demo menyimpan data" width="70%" height="70%" />
Lanjut membahas mengenai opsi pada checkout WhatsApp:
<ul>
<li>Ketika Anda memilih&nbsp;Harus isi form dulu&nbsp;maka user akan diarahkan ke halaman checkout untuk mengisi data alamat, metode pengiriman, dan metode pembayaran (mirip seperti ketika memilih opsi Checkout tetap di Website). Setelah itu user akan diarahkan ke WhatsApp admin dengan membawa data-data produk serta data diri user sesuai dengan template yang sudah Anda tetapkan pada halaman Pengaturan WhatsApp diatas. Berikut contoh pesannya.</li>
</ul>
<img src="https://antasena.site/assets/2021/8/15/1631690963106688.png" alt="contoh pesan whatsapp" width="70%" height="70%" />
<ul>
<li>Cobalah mengganti opsi dari&nbsp;harus isi form dulu menjadi langsung dari detail produk&nbsp;lalu cobalah menuju ke menu&nbsp;Pengaturan -&gt; Pengaturan WhatsApp.</li>
</ul>
<img src="https://antasena.site/assets/2021/8/15/1631690963106251.png" alt="pengaturan whatsapp" width="70%" height="70%" />
Terjadi perbedaan dengan yang sebelumnya bukan? Silakan disesuaikan dengan keinginan atau biarkan saja seperti itu juga boleh. Setelah itu coba Anda buka salah satu produk lalu tekan tombol&nbsp;BELI SEKARANG&nbsp;maka otomatis Anda akan diarahkan ke WhatsApp admin dengan template yang sudah Anda tetapkan diatas.
<img src="https://antasena.site/assets/2021/8/15/1631690963106577.png" alt="contoh pesan wa" width="70%" height="70%" />
&nbsp;
Itulah beberapa opsi dari BuntoApp yang bisa Anda coba dan sesuaikan dengan kebutuhan masing-masing. Kami terus bekerja untuk memberikan layanan yang terbaik untuk Anda dan bisa menambahkan opsi-opsi lain yang bisa Anda pilih sesuai dengan kebutuhan.
Di panduan selanjutnya kita akan mencoba untuk melakukan pemesanan atau order produk dengan berbagai opsi.

Berikut adalah beberapa fitur akan kamu dapatkan. Fitur tersebut hanya sebagian kecil saja, untuk melihat atau mengeksplorasi semua fitur silakan coba demo websitenya ya.

Fitur Apa Saja Yang Akan Kamu Dapatkan Nih??

Dengan mengedepankan tampilan mobile menjadi nilai lebih BuntoApp karena sebagian besar pengguna internet mengakses website menggunakan perangkat smartphone mereka. Tampilan yang profesional akan menambah kepercayaan konsumen terhadap toko online kamu .

Tampilan Profesional & Mobile Friendly

Flash sale memungkinkan untuk menampilkan daftar produk dengan harga diskon sehingga calon pembeli menjadi tertarik untuk membelinya. Timer flash sale dapat memberikan dorongan kepada calon pembeli untuk segera melakukan checkout barang.

Flash Sale Untuk Menarik Calon Pembeli

Ada yang hobi ngeblog atau sekadar iseng bikin artikel di blog? BuntoApp dilengkapi dengan blog yang dapat digunakan untuk menulis dan sharing artikel lhoo. Sehingga kamu bisa berbagi mengenai apapun itu lewat artikel yang kamu tulis.

Blog Untuk Posting dan Sharing Artikel

BuntoApp menyediakan halaman profil dengan fitur yang cukup lengkap seperti daftar transaksi, informasi akun, pengaturan alamat, komplain pesanan, dan bantuan. 

Halaman Profil Pengguna Terlengkap

Dapatkan segera source code toko online BuntoApp dengan fitur yang cukup lengkap seperti flash sale yang dapat menarik calon pembeli, dashboard khusus pengguna, blog untuk berbagi artikel, dan masih banyak lagi yang bisa kamu dapatkan. Jangan khawatir soal biaya karena gak bikin kantong kamu kering kok.

Bangun Branding Tokomu Secara Online. Sekarang!!

Kami telah mengumpulkan beberapa pertanyaan yang mungkin ditanyakan oleh pelanggan atau calon pelanggan kami.
Jika pertanyaan kamu tidak terjawab setelah membaca FAQ ini silakan hubungi kami melalui sosial media yang ada di bagian footer atau chat lewat WhatsApp dengan menekan tombol dibawah ini ya.

Frequently Asked Questions - `FAQ`

Pertama, kamu harus membuka website buntoshop.com dulu ya. Kamu bisa membaca semua informasi yang ada di website seperti fitur, harga, dan panduan penggunaaan BuntoApp.

Buka Website Buntoshop

Buka halaman harga, silakan tentukan paket sesuai kebutuhan. Kamu bisa pilih paket demo dulu jika belum yakin lhoo. Paket bisa kamu ubah di dashboard Buntoshop nantinya. 

Pilih Paketnya

Silakan isi semua kolomnya dulu, pastikan emailnya aktif agar bisa menerima notifikasi. Panjang password minimal 8 karakter, mengandung huruf besar, kecil, dan angka.

Isi Datanya Dulu

Silakan aktivasi email dulu ya, kalo gak ada email di folder inbox coba cek di folder spam siapa tau ada disitu. Kalo udah silakan login pake email dan password yang udah kamu buat.

Login Dulu Dong

Akan muncul pesan bahwa kamu diminta melakukan pembayaran di halaman Tagihan. Sebelum itu, silakan menonton video tutorial penggunaan/panduan di halaman Tutorial ya.

Selamat Datang di Dashboard

Pilih metode pembayaran yang kamu inginkan. Setelah melakukan pembayaran maka paketmu otomatis aktif dan kamu bisa download source code di halaman Source Code yaa..

Udah Selesai Nih..

Masih bingung cara dapetin toko onlinenya? Berikut caranya..

Cara Mendapatkan

Tertarik? Tunggu apalagi, ayo segera dapatkan script toko online kamu sekarang dan rasakan manfaatnya.

Belum yakin nih? Yuk baca testimoni dari member kami.

Kata Member Kami

Berbagai macam fitur dan opsi yang bisa kamu sesuaikan dengan kebutuhan

Fitur Lengkap

Buat pelangganmu betah dengan desain yang elegan dan dapat kamu ubah-ubah atau sesuaikan

Desain Profesional

Tersedia berbagai macam ekspedisi yang ada di Indonesia , pilih sendiri yang ingin kamu pake

Banyak Ekspedisi

Kenapa sih kamu harus pilih Buntoshop? Simak Yuk..

Kenapa Buntoshop

Cocok buat kamu yang sudah paham atau bahkan berpengalaman pengembangan web khususnya dengan Codeigniter 3 dan tidak terlalu butuh support dari kami.

Cocok buat kamu yang kurang paham atau belum paham mengenai pengembangan aplikasi website khususnya Codeigniter 3 sehingga butuh support lebih dari kami.