Dokumentasi Fitur Dapatkan Nomor Kontak via HTML

Hai teman teman pengguna aplikasi bukaOlshop, kali ini admin akan membahas tentang fitur baru di aplikasi bukaOlshop yaitu fitur untuk mendapatkan nomor telepon yang tersimpan di kontak melalui kode HTML. Pada versi aplikasi sebelumnya, untuk mendapatkan nomor telepon dari kontak harus menggunakan widget produk digital yang sudah disediakan oleh bukaOlshop. Namun saat ini bukaOlshop memilki fitur baru yang memungkinkan pemilik olshop untuk mendapatkan nomor telepon dari kontak melalui kode HTML yang dapat diterapkan pada kostum halaman.

Sebelum menerapkan fitur ini, ada beberapa persyaratan yang harus dipenuhi agar fitur ini dapat berjalan sempurna, yaitu:

  1. APK olshop memiliki versi bulid  57 keatas.
  2. Fitur ini dapat berjalan jika diletakkan pada kostum halaman.
  3. Fitur ini dapat berjalan pada widget HTML dengan syarat widget HTML tersebut menggunakan opsi MATCH_PARENT (jadi jika teman-teman mencoba menggunakan fitur get contact ini melalui widget HTML dengan opsi WRAP_CONTENT, maka fitur ini tidak akan berjalan).

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.

1. Tambahkan tombol untuk mendapatkan kontak

Langkah pertama yaitu menambahkan tombol pada kode HTML yang digunakan untuk memunculkan daftar pilihan kontak. Tag yang digunakan yaitu tag link atau <a href  yang mengarah ke URL https://link_olshop/ambil_kontak

Silahkan lihat contoh dibawah:

<a href="https://olshopgue.bukaolshop.site/ambil_kontak">
	<button type="button">Ambil Nomor Hp</button>
</a>

Ganti olshopgue.bukaolshop.site dengan link website olshop anda. Ketika tombol diatas diklik, maka akan memunculkan dialog baru yang berisi kontak yang ada didalam hp anda.

2. Tambahakan class pada tag input untuk menerima hasil kontak

Setelah dialog pilih kontak muncul dari langkah pertama diatas, langkah selanjutnya yaitu memasukkan nomor hp yang sudah dipilih ke sebuah input yang ada di HTML. Untuk melakukan hal tersebut, maka anda harus menambahkan {{hasil_kontak}} di bagian class, pada komponen input anda. Silahkan lihat contoh dibawah:

<input class="{{hasil_kontak}}" type="text" name="catatan" placeholder="Masukkan catatan disini"/>

Nomor hp yang dipilih, akan di masukkan ke komponen yang memiliki class {{hasil_kontak}}.

 

Setelah kedua langkah diatas dilakukan, maka bentuk kode HTML full nya dapat dilihat pada contoh dibawah:

<html>

<form method="GET" action="https://olshopgue.bukaolshop.site/produk/ini-judul-produk-828128">

<input type="text" name="catatan" placeholder="Masukkan catatan disini" 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 diatas merupakan kode yang digunakan untuk melakukan pemesanan melalui HTML, tutorialnya bisa dilihat di link berikut.

Hasilnya bisa anda lihat divideo dibawah: