Cara Membuat Fitur Mengambil Nomor Kontak Via HTML di BukaOlshop
Halo teman-teman pengguna BukaOlshop! Kali ini, blog.prytr.com akan menjelaskan fitur baru di BukaOlshop yang memungkinkan Anda untuk mendapatkan nomor telepon yang tersimpan di kontak menggunakan kode HTML. Di versi sebelumnya, Anda perlu menggunakan widget produk digital dari BukaOlshop untuk memperoleh nomor telepon dari kontak. Sekarang, BukaOlshop menyediakan fitur baru yang memungkinkan Anda untuk mendapatkan nomor telepon dari kontak melalui HTML yang dapat diterapkan di halaman kustom.
Sebelum memulai, pastikan beberapa syarat berikut terpenuhi agar fitur ini dapat berfungsi dengan baik:
1. APK olshop harus versi build 57 atau lebih baru.
2. Fitur ini hanya bisa digunakan jika ditempatkan di halaman kustom.
3. Fitur ini memerlukan widget HTML dengan opsi `MATCH_PARENT` (jika menggunakan opsi `WRAP_CONTENT`, fitur ini tidak akan berfungsi).
Pastikan Anda memperhatikan detail saat menerapkan fitur ini untuk menghindari kesalahan sintaks atau masalah lainnya. Memahami dasar HTML sangat dianjurkan.
1. Menambahkan Tombol untuk Mengambil Kontak
Langkah pertama adalah menambahkan tombol di HTML yang akan memunculkan pilihan kontak. Gunakan tag link atau `<a href>` dengan URL yang mengarah ke `https://link_olshop/ambil_kontak`.
Berikut contoh kodenya:
<a href="https://olshopgue.bukaolshop.site/ambil_kontak">
<button type="button">Ambil Nomor HP</button>
</a>
Ganti `olshopgue.bukaolshop.site` dengan URL website olshop Anda. Ketika tombol ini diklik, akan muncul dialog baru dengan daftar kontak dari HP Anda.
2. Menambahkan Class pada Tag Input untuk Menyimpan Hasil Kontak
Setelah dialog kontak muncul, langkah berikutnya adalah menambahkan nomor HP yang dipilih ke dalam input di HTML. Untuk ini, tambahkan `{{hasil_kontak}}` pada atribut class di tag input Anda. Berikut contohnya:
<input class="{{hasil_kontak}}" type="text" name="catatan" placeholder="Masukkan catatan di sini"/>
Nomor HP yang dipilih akan dimasukkan ke dalam komponen dengan class `{{hasil_kontak}}`.
Contoh Kode HTML Lengkap
Setelah kedua langkah di atas diterapkan, berikut adalah contoh kode HTML lengkapnya:
<html>
<form method="GET" action="https://olshopgue.bukaolshop.site/produk/ini-judul-produk-828128">
<input type="text" name="catatan" placeholder="Masukkan catatan di sini" class="{{hasil_kontak}}"/>
<button type="submit">Beli</button>
</form>
<a href="https://olshopgue.bukaolshop.site/ambil_kontak">
<button type="button">Ambil Nomor HP</button>
</a>
</html>
Kode di atas digunakan untuk melakukan pemesanan melalui HTML. Untuk tutorial lebih lanjut, Anda bisa mengikuti panduan di link yang disediakan.
Hasil akhir dapat dilihat pada video di bawah ini:
Posting Komentar untuk "Cara Membuat Fitur Mengambil Nomor Kontak Via HTML di BukaOlshop"
Peringatan: Sebelum mengirimkan komentar, harap pastikan bahwa:
- Komentar Anda relevan dengan topik.
- Tidak mengandung kata-kata kasar atau menyinggung.
- Tidak mengandung spam atau tautan yang tidak relevan.
- Anda mematuhi kebijakan privasi dan ketentuan penggunaan situs ini.
Terima kasih atas pengertiannya.