Cara Melengkapi Alamat Otomatis di WordPress
Diterbitkan: 2021-03-06Apakah Anda ingin melengkapi alamat di situs Anda secara otomatis? Anda telah datang ke tempat yang tepat. Dalam panduan ini, kami akan menunjukkan kepada Anda cara melengkapi alamat secara otomatis di WordPress (tidak perlu pengkodean).
Saat ini, sebagian besar toko eCommerce meminta pelanggan untuk mengisi formulir yang menyertakan alamat mereka saat membeli sesuatu. Anda dapat mengizinkan pengguna memasukkan alamat mereka secara manual atau membantu mereka dengan alat pelengkapan otomatis. Dengan melengkapi alamat secara otomatis, pengguna dapat memilih lokasi yang disarankan dari beberapa alamat yang akan muncul secara real-time saat mereka mengetik.
Menggunakan pelengkapan otomatis untuk bidang alamat sangat umum di toko eCommerce, terutama di bagian alamat penagihan dan pengiriman, di halaman checkout, atau di halaman Akun Saya.
Mengapa Alamat Autocomplete di WordPress?
Pelengkapan otomatis alamat di WordPress dapat membantu Anda meningkatkan pengalaman pengguna di situs web Anda . Pelanggan tidak hanya dapat memasukkan alamat mereka lebih cepat, tetapi Anda juga akan terhindar dari kesalahan dan kesalahan ketik.
Saat pembeli mengetik alamat mereka, alamat yang memungkinkan akan muncul di layar mereka sehingga mereka hanya perlu memilih yang benar. Ini akan membantu Anda mengurangi kesalahan karena opsi yang ditampilkan kepada pengguna terintegrasi dengan Google Places dan Google Maps API.
Ini adalah salah satu fungsi paling nyaman yang dapat Anda berikan kepada pengguna Anda. Dengan meningkatkan pengalaman pengguna di situs Anda, kemungkinan besar Anda akan meningkatkan penjualan dan mengubah pembeli sesekali itu menjadi pelanggan tetap.
Sekarang setelah kita lebih memahami manfaat menambahkan fitur alamat pelengkapan otomatis di WordPress, mari kita lihat cara menambahkannya ke situs Anda.
Cara Melengkapi Alamat Otomatis di WordPress
Cara termudah dan paling efektif untuk menambahkan alamat autocomplete di WordPress adalah dengan menggunakan plugin. Untuk tutorial ini, kita akan menggunakan Autocomplete Google Address . Ini memiliki antarmuka yang ramah pengguna dan sangat mudah digunakan.
Untuk menggunakan plugin ini, Anda hanya memerlukan kunci API Google Places dan ID formulir bidang alamat. Kemudian, ada serangkaian langkah sederhana yang perlu Anda ikuti untuk menambahkan alamat pelengkapan otomatis ke situs web WordPress. Langkah-langkahnya adalah sebagai berikut:
1. Instal dan Aktifkan Plugin
Untuk menginstal dan mengaktifkan plugin Autocomplete Google Address, di admin WordPress Anda, buka Plugins > Add New . Kemudian, cari plugin di bilah pencarian. Setelah itu, klik Install Now lalu aktifkan.
2. Masukkan Kunci API Google Place
Setelah Anda mengaktifkan plugin, buka tab Autocomplete di dasbor Anda. Anda memerlukan Google Place API Key untuk situs web Anda.
Mari kita lihat bagaimana melakukannya.
2.1. Cara mengakses Kunci API Google Places
Untuk mengakses kunci API, masuk ke akun Google Anda dan buka Google Developer Console . Kemudian, tekan Select a project dan buat New Project .
Anda harus memasukkan nama proyek dan klik Buat . Kemudian, Anda akan diarahkan ke proyek baru Anda.
Langkah selanjutnya adalah mengaktifkan API. Untuk ini, buka bagian Perpustakaan di dasbor.
Di sini, Anda harus mencari Google Places API. Ini biasanya salah satu opsi pertama yang Anda lihat di layar ini, tetapi jika Anda tidak dapat menemukannya, gunakan bilah pencarian untuk mencarinya.
Sekarang, Anda akan menemukan diri Anda di halaman ikhtisar Places API. Klik Aktifkan untuk mengotorisasi API.
Sekarang, kembali ke dasbor Anda, buka tab Kredensial dan tekan Buat Kredensial . Anda akan melihat menu tarik-turun di mana Anda harus memilih opsi kunci API .
Itu dia! Anda telah berhasil membuat kunci API Anda. Cukup salin dan tempel di tab Pelengkapan Otomatis di dasbor WordPress Anda.
Untuk memastikan bahwa fitur alamat pelengkapan otomatis akan berfungsi dengan baik di WordPress, Anda harus mengaktifkan Google Maps JavaScript API . Mari kita lihat bagaimana melakukannya.
2.2. Aktifkan Google Maps JavaScript API
Untuk mengaktifkan Google Maps JavaScript API, pertama, buka tab Library dari dasbor Google Developer Console . Kemudian, cari Google Maps JavaScript API , pilih dan Aktifkan .
Itu dia! Sekarang kita siap untuk pindah ke langkah berikutnya dan menambahkan ID formulir.
3. Masukkan ID Formulir
Setelah Anda memasukkan Google Place API Key, Anda juga memerlukan ID formulir bidang alamat tempat Anda ingin menambahkan fitur alamat pelengkapan otomatis. Di dasbor WordPress Anda, buka Pelengkapan Otomatis . Tepat di bawah bidang kunci API, Anda akan menemukan bidang lain untuk memasukkan ID formulir .
Untuk menemukan ID formulir, cukup ikuti langkah-langkah ini.
3.1. Cara Menemukan ID Formulir
Untuk menemukan ID formulir untuk menambahkan fitur alamat pelengkapan otomatis, buka halaman tempat bidang berada. Kemudian, klik kanan pada bidang alamat dan pilih opsi Inspeksi . Atau, Anda dapat mengklik area teks bidang dan menggunakan pintasan keyboard Ctrl+Shift+i.
Sekarang, di tab Elemen , Anda melihat alat pengembang tempat Anda dapat memeriksa dan melihat semua elemen halaman web. Jika Anda tidak terbiasa dengan kode dan pemrograman, Anda tidak perlu khawatir. Kode untuk bidang akan disorot. Dalam kasus kami, ID formulir adalah alamat-form-1 seperti yang Anda lihat di bawah.
Seperti yang Anda lihat, dikatakan id = “address-form-1” tetapi ID formulir sebenarnya hanyalah address-form-1.
Cukup temukan ID formulir Anda dan salin di bidang ID formulir di dasbor admin WordPress Anda.
Sekarang, masukkan id formulir pada tab Pelengkapan otomatis di dasbor Anda dan simpan perubahannya, buka halaman dengan bidang alamat.
Terakhir, tempel ID formulir di bidang yang sesuai dan simpan perubahannya . Jika Anda ingin melengkapi lebih dari satu bidang alamat secara otomatis, tambahkan setiap ID formulir dan pisahkan dengan koma.
Itu dia! Anda baru saja menambahkan fitur alamat pelengkapan otomatis di WordPress. Mulai sekarang, ketika pengguna mulai mengetik alamat, menu tarik-turun akan muncul dengan semua saran untuk lokasi. Yang perlu mereka lakukan adalah memilih lokasi mereka dan alamat lengkap akan dimasukkan secara otomatis.
Pelengkapan otomatis alamat hanyalah langkah pertama. Jika Anda ingin melangkah lebih jauh dan meningkatkan pengalaman pelanggan Anda, terlebih lagi, Anda juga dapat melengkapi pesanan di toko Anda secara otomatis. Mari kita lihat bagaimana melakukannya.
Bonus: Cara Melengkapi Pesanan Secara Otomatis
Menambahkan fitur pesanan pelengkapan otomatis adalah cara terbaik lainnya untuk meningkatkan pengalaman pelanggan di situs Anda. Dengan melengkapi pesanan secara otomatis, Anda dapat memproses dan mengkonfirmasi pesanan secara instan sehingga pembeli tidak perlu menunggu untuk mendapatkan konfirmasi atas transaksi mereka yang mungkin memakan waktu berjam-jam. Selain itu, karena pengguna dapat mengakses produk atau layanan yang mereka beli secara instan, Anda tidak perlu memeriksa pesanan mereka secara manual. Ini bekerja sangat baik untuk produk virtual dan yang dapat diunduh.
Cara termudah dan tercepat untuk melengkapi pesanan di situs Anda secara otomatis adalah dengan menggunakan plugin. Ada beberapa alat di luar sana tetapi untuk demo ini, kami akan menggunakan Pesanan WooCommerce Pelengkapan Otomatis. Alat gratis ini adalah salah satu plugin terbaik di luar sana dan terintegrasi dengan mulus dengan WooCommerce dan gateway pembayaran seperti PayPal untuk melengkapi pesanan secara otomatis dan mengonfirmasi pembelian dalam waktu singkat.
Mari kita lanjutkan dan lihat cara menggunakan plugin ini. Sebelum kita mulai, pastikan Anda telah mengatur WooCommerce dengan benar di situs web Anda.
1. Instal dan Siapkan pesanan WooCommerce Autocomplete
Untuk menginstal plugin, di dasbor WordPress Anda, buka Plugins > Add new dan cari Autocomplete WooCommerce Orders . Kemudian, klik Instal Sekarang dan aktifkan.
Setelah itu, buka WooCommerce > Pengaturan dan buka tab Pesanan Pelengkapan Otomatis . Kemudian, pilih Pesanan produk virtual berbayar hanya di bawah Mode dan simpan perubahannya.
2. Akses Kunci Identitas Transfer Data PayPal
Sekarang, Anda harus mendapatkan kunci identitas transfer data dari PayPal. Untuk ini, login ke PayPal Anda dan pergi ke pengaturan. Di bawah tab Alat Penjual , klik tombol Perbarui untuk preferensi Situs Web .
Anda akan diarahkan ke opsi preferensi situs web di mana Anda harus menemukan bagian Pengembalian otomatis dan memilih tombol radio Aktif untuk mengaktifkan pengembalian otomatis. Kemudian, masukkan URL pengembalian Anda dan simpan.
Setelah itu, gulir ke bawah ke bagian Transfer data pembayaran dan pilih tombol radio On untuk mengaktifkannya. Token identitas Anda untuk transfer data pembayaran akan ditampilkan. Anda akan memerlukan kunci identitas ini, jadi salin dan letakkan di tempat yang praktis.
3. Masukkan Kunci Identitas PayPal ke WooCommerce
Untuk memasukkan kunci identitas PayPal di WooCommerce, buka WooCommerce > Pengaturan dan buka tab Pembayaran . Kemudian, tekan tombol Kelola untuk PayPal.
Di sini, temukan opsi kunci identitas PayPal dan masukkan kunci identitas transfer data PayPal yang baru saja Anda salin di area teks. Terakhir, siapkan detail lain untuk akun PayPal Anda dan simpan perubahannya.
Ini adalah bagaimana Anda dapat menambahkan fitur pesanan pelengkapan otomatis untuk WooCommerce. Untuk detail lebih lanjut tentang cara mengaturnya, kami sarankan Anda melihat panduan langkah demi langkah ini. Selain itu, Anda dapat melihat dokumentasi Autocomplete WooCommerce Orders yang memiliki banyak informasi berguna.
Kesimpulan
Singkatnya, alamat pelengkapan otomatis adalah cara yang bagus untuk meningkatkan pengalaman pengguna di situs Anda. Ini memungkinkan pembeli menghemat waktu saat mengetik alamat mereka dan membantu Anda menghindari kesalahan dan kesalahan ketik.
Dalam panduan ini, kami telah melihat cara memasukkan fitur alamat pelengkapan otomatis di situs WordPress Anda tanpa pengkodean apa pun. Kami telah melihat cara:
- Aktifkan dan atur plugin Autocomplete Google Address
- Dapatkan Kunci API Google Place
- Temukan ID Formulir dari bidang alamat untuk menambahkan pelengkapan otomatis
Selain itu, kami telah melihat cara melengkapi pesanan secara otomatis menggunakan plugin Autocomplete WooCommerce Orders . Ini akan membantu Anda mengkonfirmasi pesanan secara instan dan meningkatkan penjualan Anda.
Jika Anda merasa artikel ini bermanfaat, berikut adalah beberapa panduan lain untuk memanfaatkan situs Anda secara maksimal:
- Cara Mengedit Bidang Pembayaran WooCommerce
- Cara Mengintegrasikan Google Maps di WordPress
- Optimasi Checkout: Panduan Lengkap
Sudahkah Anda mulai melengkapi alamat secara otomatis di situs WordPress Anda? Metode apa yang Anda gunakan? Beri tahu kami di bagian komentar di bawah!