Panduan Pengaturan Checkout Form di bosOnline

Home/Artikel Produk / Panduan Pengaturan Checkout Form di bosOnline

Halo Sahabat bosOnline! 👋
Kamu sudah berhasil menambahkan Pengaturan Informasi Produk, selamat ya! . Sekarang, kita lanjut ke Step 2, yaitu Pengaturan Checkout Form.
Pada bagian ini, kamu akan berfokus untuk mengkreasikan tampilan form agar terlihat lebih menarik dan mudah digunakan.
Yuk, simak tutorialnya berikut ini! ✨


Pada bagian Pengaturan Checkout Form, kamu akan mengisi beberapa informasi penting mengenai Header Checkout Form, yang berisi:

BagianKeteranganContoh PengisianPro Tip 💡
Nama Checkout Form*Masukkan nama untuk form checkout-mu. (Kolom ini wajib diisi.)Checkout Baju Batik PrabuGunakan nama yang singkat dan mudah dikenali agar kamu cepat menemukannya di daftar form.
Template FormPilih template form sesuai kebutuhan atau gaya tampilan yang kamu inginkan.Template Default atau Template MinimalisPilih template yang sesuai dengan tema produkmu biar tampilan checkout terlihat konsisten.
Kategori ProdukTentukan kategori produk yang ingin kamu tampilkan di form checkout.Batik, Fashion Wanita, AksesorisKelompokkan produk sejenis agar pengguna tidak bingung saat checkout.
Gambar HeaderUpload gambar untuk header form-mu. Format: .jpg, .png, .svg, .webp Ukuran maksimal: 2 MBheader-batik.pngGunakan gambar dengan resolusi tinggi dan ukuran proporsional supaya tampilannya tetap tajam dan ringan.
Title dan Tagline FormIsi judul dan tagline yang akan muncul di bagian atas form checkout untuk mempercantik tampilan dan memberi informasi singkat.Title: Form Pemesanan Batik PrabuTagline: Isi data berikut untuk melanjutkan pembelianmuBuat title singkat tapi informatif, dan tagline yang ramah supaya pengguna merasa nyaman saat isi form.
(Informasi form)

Kemudian, pilih tampilan form. Pada sesi ini, kamu bisa memilih antara Template Resposive atau Mobile Commerce.
Silakan pilih tampilan yang paling sesuai dengan kebutuhan dan gaya tokomu, ya

(Tampilan tema responsive)
(Tampilan tema mobile commerce)

Selanjutnya, untuk mempercantik tampilan form-mu, kamu bisa menambahkan Gambar Header. Caranya sangat mudah!
Cukup klik field gambar header yang tersedia, lalu pilih gambar yang kamu inginkan dari perangkatmu.

💡 Pro Tip:
Gunakan gambar dengan ukuran 1200×400 px agar tampilan header tetap proporsional dan tajam.
Pastikan juga ukuran file tidak lebih dari 2 MB supaya halaman checkout tetap cepat saat dimuat

(Berhasil menambah gambar header)

Lalu, kamu akan mengisi Title dan Tagline Form. Bagian ini berfungsi untuk memberikan judul dan deskripsi singkat pada form checkout-mu.
Title akan tampil di bagian atas form sebagai nama utama, sedangkan Tagline berisi kalimat pendukung yang bisa menarik perhatian calon pembeli.

💡 Pro Tip:
Gunakan Title dan Tagline untuk mengenalkan produkmu secara singkat.
Contohnya:

  • Title: “Batik Prabu Wicaksan”
  • Tagline: “Batik premium dengan motif klasik yang elegan, cocok untuk acara formal maupun santai.”

Dengan begitu, pelanggan langsung tahu produk apa yang mereka pesan dan tertarik untuk lanjut checkout ✨

(Berhasil menambahkan title & tagline)

Masuk pada sesi Pengaturan Tampilan Form.
Nah, di bagian ini pasti seru banget karena kamu bisa bebas berkreasi dengan tampilan form onlinemu!. Ada beberapa opsi yang bisa kamu ubah sesuai selera, yaitu:

  1. Ubah Warna Latar Belakang : Sesuaikan warna background agar tampilan form terlihat lebih menarik dan sesuai dengan tema tokomu.
  2. Kustomisasi Tombol : Ubah warna dan teks tombol agar terlihat lebih menonjol dan menarik perhatian pengguna.
  3. Segel Penjamin Mutu : Aktifkan fitur ini untuk menampilkan segel jaminan kepercayaan pada pelangganmu.

Untuk mengaktifkan setiap fitur, kamu cukup klik toggle yang tersedia mudah banget kan?

💡 Pro Tip:
Gunakan warna yang senada dengan identitas brand-mu agar tampilan checkout terlihat profesional dan konsisten. Warna yang cerah di tombol juga bisa bantu menarik perhatian pengguna untuk segera menyelesaikan pesanan

(Berhasil ubah warna belakang)

Pada bagian Kustomisasi Tombol, kamu bisa mengubah warna tombol yang secara default berwarna oranye, menjadi warna apa pun yang kamu mau.
Nggak cuma itu, kamu juga bisa mengubah teks di dalam tombol agar lebih sesuai dengan gaya bahasamu atau kebutuhan tokomu lo

💡 Pro Tip:
Gunakan warna tombol yang kontras dengan latar belakang agar lebih menarik perhatian pembeli.
Untuk teks tombol, pilih kalimat yang mengajak tindakan, misalnya: “Beli Sekarang” atau “Lanjut ke Pembayaran” supaya pelanggan lebih cepat klik

(Berhasil kustomisasi tombol)

Jangan lupa tambahkan juga Segel Penjamin Mutu!. Fitur ini berfungsi untuk menampilkan segel jaminan kepercayaan di halaman checkout-mu. Dengan menambahkan segel ini, pelanggan akan merasa lebih aman dan yakin untuk melanjutkan pembelian.

💡 Pro Tip:
Pilih desain segel yang terlihat profesional dan sesuai dengan identitas brand-mu. Tambahkan kata-kata seperti “100% Aman” atau “Garansi Kepuasan Pelanggan” untuk memperkuat rasa percaya pembeli.

(Berhasil menambah segel penjamin mutu)

Jika sudah, masuk pada bagian Detail Produk Tambahan.
Untuk mengaktifkan setiap fiturnya, kamu cukup klik toggle yang tersedia gampang banget kan? 😍

Di bagian ini, kamu bisa menambahkan berbagai elemen tambahan agar halaman checkout-mu terlihat lebih informatif dan menarik, seperti:

  1. Deskripsi Tambahan : Berisi informasi tambahan seputar produkmu, misalnya bahan, ukuran, atau cara perawatan.
  2. Poin Unggulan Produk : Tampilkan poin-poin kelebihan produkmu dalam bentuk list agar pembeli langsung tahu nilai lebihnya.
  3. Judul Keunggulan : Beri judul menarik untuk bagian keunggulan produk, misalnya “Kenapa Harus Pilih Produk Ini?”
  4. Lampirkan Video : Tambahkan video promosi atau penjelasan produk agar calon pembeli makin yakin.

💡 Pro Tip:
Gunakan deskripsi dan video yang singkat tapi padat informasi.
Poin-poin keunggulan sebaiknya berisi manfaat utama yang bisa dirasakan pelanggan, misalnya “Bahan Adem & Nyaman Dipakai” atau “Motif Eksklusif Handmade”

(Berhasil menambahkan deskripsi produk)

Ketika kamu mengaktifkan Poin Unggulan Produk, pastikan untuk mengisi terlebih dahulu Judul Keunggulan Produk agar tampilannya terlihat lebih rapi dan informatif. Jika kamu ingin menambahkan beberapa poin keunggulan, cukup klik tombol “Tambah Poin Unggulan” untuk menuliskan kelebihan produkmu satu per satu.
Kalau ada poin yang ingin kamu hapus, tinggal klik ikon (hapus) di samping poin tersebut, ya!

💡 Pro Tip: Susun poin keunggulan secara singkat dan jelas, mulai dari kualitas bahan, kenyamanan, hingga nilai estetik agar calon pembeli langsung tertarik.

Untuk menambahkan video, kamu hanya bisa menyematkan link dari YouTube saja, ya. Cukup salin URL video YouTube yang ingin kamu tampilkan, lalu tempelkan pada kolom yang tersedia.

💡 Pro Tip: Gunakan video berdurasi singkat yang menampilkan detail produk, cara pakai, atau proses pembuatannya — ini bisa meningkatkan kepercayaan calon pembeli!

(Berhasil menambahkan video)

Masuk pada sesi Opsi Pengiriman, di bagian ini kamu akan memilih kurir yang akan mengirimkan paketmu, serta menentukan alamat gudang terdaftar

Selain itu, kamu juga bisa mengaktifkan fitur Flat Ongkir dengan beberapa kriteria pilihan:

  • Tanpa Pengecualian : Semua pesanan mendapatkan ongkir flat tanpa syarat.
  • Pakai Kurir Tertentu : Kamu bisa memilih kurir mana saja yang berlaku untuk ongkir flat.
  • Provinsi Tujuan Pilihan : Kamu bisa menentukan provinsi mana yang mendapatkan ongkir flat.

💡 Pro Tip: Gunakan flat ongkir untuk menarik minat pembeli baru ongkir yang terprediksi sering jadi alasan utama pelanggan checkout tanpa ragu!

(Berhasil tambah kurir pengiriman)
(Flat ongkir tanpa pengecualian)
(Flat ongkir tanpa pengecualian)
(Flat ongkir kurir tertentu)
(Flat ongkir provinsi tujuan pilihan)

Lanjut pada bagian Metode Pembayaran, di sini kamu bisa memilih cara pembayaran yang ingin kamu aktifkan untuk pembeli

Terdapat beberapa opsi yang bisa kamu pilih :

  • Manual Transfer : Pembeli mentransfer langsung ke rekening yang kamu tentukan.
  • Cash on Delivery (COD) : Pembayaran dilakukan saat barang diterima.
  • Persentase COD Fee Ditagihkan : Kamu bisa menentukan berapa persen biaya tambahan COD yang akan dibebankan ke pembeli.
  • E-Payment : Pembayaran melalui sistem online seperti e-wallet atau payment gateway.

💡 Pro Tip: Aktifkan lebih dari satu metode pembayaran agar pembeli punya banyak pilihan semakin mudah mereka bayar, semakin besar peluang transaksi berhasil!

(Tampilan default metode pembayaran)

Jika kamu baru saja menggunakan bosOnline dan mengaktifkan Manual Transfer, akan muncul field Tambah Nomor Rekening Pembayaran.

Ketika kamu klik Tambah Nomor Rekening Pembayaran, akan muncul opsi Tambah Bank.
Selanjutnya, klik Tambah Bank, maka akan muncul pop-up Tambah Rekening Baru.
Klik saja tombol Tambah Rekening Baru, dan kamu akan diarahkan ke halaman Metode Pembayaran untuk menambahkan rekening barumu

💡 Pro Tip: Gunakan rekening atas nama toko atau bisnismu agar pembeli lebih percaya dan transaksi terlihat profesional!

(Field tambah nomor rekening)

Selanjutnya kamu sudah menambahkan rekening, maka akan muncul daftar rekening yang telah kamu daftarkan. Cukup klik rekening yang sudah tersedia, dan sistem akan otomatis menampilkan data rekening tersebut di metode pembayaranmu.

💡 Pro Tip: Pastikan nomor rekening dan nama pemiliknya sudah benar sebelum kamu simpan, supaya tidak terjadi kesalahan saat pembeli melakukan transfer!

(Pilih rekening)

Apabila kamu sudah memilih rekening yang dibutuhkan, kamu juga bisa menambahkan rekening lain dengan cara yang sama cukup klik kembali Daftar Nomor Rekening, lalu pilih rekening tambahan yang kamu perlukan

Apabila kamu ingin menghapus rekening, cukup klik ikon hapus pada rekening yang ingin dihapus.

(Berhasil tambah daftar rekening)

Jika kamu ingin menambahkan metode E-Payment, cukup aktifkan toggle E-Payment. Setelah diaktifkan, kamu bisa menentukan siapa yang akan menanggung biaya admin transaksi Seller atau Customer.

  • Jika dibebankan ke Seller, maka biaya admin akan otomatis dipotong dari hasil penjualan.
  • Jika dibebankan ke Customer, maka biaya admin akan ditambahkan ke total pembayaran mereka.

Setelah itu, akan muncul daftar Virtual Account yang bekerja sama dengan bosOnline, lengkap dengan informasi biaya transaksinya.
Kamu juga bisa memilih lebih dari satu metode E-Payment dengan mencentang opsi yang kamu inginkan

(List va yang bekerjasama)

Lanjut ke Pengaturan Input Field, di bagian ini kamu bisa menambahkan, mengurutkan, atau menghapus field sesuai kebutuhanmu

Fitur ini berfungsi untuk mengatur data apa saja yang ingin kamu minta dari pembeli saat mereka mengisi form checkout. Misalnya, kamu bisa menambahkan field seperti:

  • Nama lengkap
  • Nomor telepon
  • Alamat pengiriman
  • Catatan khusus pembeli

Kamu juga bisa menyesuaikan urutannya agar tampilan form lebih rapi dan mudah dipahami oleh pembeli.

💡 Pro Tip: Pastikan hanya menampilkan field yang benar-benar diperlukan form yang terlalu panjang bisa bikin pembeli malas melanjutkan proses checkout!

(Tampilan default pengaturan input field)

Untuk mulai menambahkan field, kamu hanya perlu klik Tambah Field Custom, lalu akan muncul pop-up Tambah Custom Field Form yang menampilkan Nama Field dan Detail Field.

  1. Isi bagian Nama Field : Ketik nama field yang ingin kamu tambahkan, misalnya:
    • Nama Lengkap
    • Nomor WhatsApp
    • Catatan Pesanan
  2. Atur bagian Detail Field : Di sini kamu bisa menyesuaikan tipe dan tampilan field yang akan muncul di form checkout:
    • Tipe Field: Pilih antara Text, Number, atau Text Area sesuai kebutuhan.
    • Label: Teks yang akan muncul di form sebagai judul field (contoh: Masukkan Nama Lengkap).
    • Placeholder: Teks petunjuk di dalam kolom input, misalnya Tulis nama kamu di sini.
  3. Klik “Simpan Perubahan”
    Setelah semua sudah diisi dengan benar, klik tombol Simpan Perubahan untuk menambahkan field baru ke dalam form checkout.
    Kalau batal, tinggal klik Batalkan.

💡 Pro Tip:
Gunakan label dan placeholder yang jelas agar pembeli langsung paham apa yang harus mereka isi ini bisa membantu mempercepat proses checkout dan mengurangi kesalahan input.

(Tambah custom field form)
(Berhasil menambah field)

Untuk menampilkan atau menyembunyikan field, kamu hanya perlu klik checkbox.

(Berhasil menampilkan field)

Untuk mengubah atau menghapus field, cukup klik ikon Ubah atau Hapus.
Ketika kamu memilih untuk mengubah field, akan muncul pop-up Ubah Tampilan Field Form. Di sini, kamu bisa menyesuaikan form sesuai kebutuhan dan preferensimu dengan mudah.

(Pop up tampilan field form)

Untuk mengaktifkan voucher belanja, cukup tekan toggle pada bagian voucher. Setelah diaktifkan, akan muncul tombol Tambah Voucher.
Klik tombol tersebut, dan kamu akan langsung diarahkan ke halaman Daftar Voucher Promo untuk menambahkan atau mengatur voucher sesuai kebutuhanmu.

(Tambah voucher belanja)

Selanjutnya jika kamu ingin menambahkan testimoni pelanggan. kamu tinggal aktifkan saja bagian testimoni pelanngan. setelah diaktifkan klik tambah testimoni untuk mulai menambahkan, jika sudah kamu harus mengisi foto testimoni, nama customer, dan uraian testimoni. tak lupa untuk mengatur rating testimoni. jika sudah kamu bisa klik simpan testimoni.

Lalu, kita masuk pada bagian terakhir pada tahap ini, yaitu fitur tracking ads. Dengan fitur Tracking Ads di bosOnline, kamu bisa sambungkan data dari berbagai platform iklan seperti Facebook Pixel, TikTok Pixel, dan Google Tag Manager. Tujuannya agar performa iklanmu makin optimal dan setiap konversi bisa terukur dengan jelas.


1. Pengaturan Dasar Tracking

Pastikan tombol Tracking Ads di kanan atas aktif (warna oranye).
Kemudian pilih metode tracking:

  • Semua trigger event di-tracking semua aktivitas pengunjung dicatat.
  • Trigger event di-tracking sekali hanya event pertama yang dicatat.

2. Facebook Pixel

  1. Klik tab Facebook Pixel
  2. Tekan + Tambah Facebook Pixel ID, lalu masukkan ID milikmu dari Meta Ads Manager.
  3. Tekan + Tambah Facebook Pixel’s Event, lalu pilih event yang mau kamu pantau (misalnya PageView, AddToCart, Purchase).

Setelah tersimpan, Pixel kamu akan otomatis aktif dan merekam semua aktivitas yang relevan.


3. TikTok Pixel

  1. Pindah ke tab TikTok Pixel
  2. Klik + Tambah TikTok Pixel ID, lalu isi ID yang kamu dapat dari TikTok Ads Manager.
  3. Tambahkan juga event seperti ViewContent, AddToCart, atau CompletePayment dengan klik + Tambah TikTok Pixel’s Event.

Dengan cara ini, kamu bisa tahu performa iklan TikTok-mu langsung dari dashboard bosOnline 💫


4. Google Tag Manager (GTM)

  1. Klik tab Google Tag Manager
  2. Masukkan Container ID milikmu (biasanya formatnya GTM-XXXXXXX).
  3. Setelah itu, semua tag dan event dari GTM akan otomatis terhubung ke sistem bosOnline.

Langkah ini cocok buat kamu yang ingin mengelola tracking dari berbagai platform secara terpusat.


Selesai!
Sekarang semua tracking iklanmu sudah aktif dan bisa dipantau langsung lewat dashboard bosOnline. Dengan data yang akurat, kamu bisa ambil keputusan promosi dengan lebih tepat 🎯

(Fb tracking ads)
(Tiktok pixel id)
(GTM ID)

Apakah pertanyaan Anda terjawab?

😞
😐
😃