Tidak setiap pengunjung situs web Anda ada di sana untuk tujuan yang sama. Kemungkinan besar Anda menyediakan berbagai item atau layanan kepada pelanggan dan klien, bukan hanya satu. Itulah sebabnya memiliki berbagai formulir kontak yang ditargetkan dapat membantu memperlancar UX situs Anda sehingga klien Anda (dan pelanggan masa depan) dapat menghubungi Anda dengan sesedikit mungkin gesekan mengenai apa yang mereka butuhkan. Kami akan memandu Anda dalam membangun jalur optimal antara Anda dan pengguna Anda menggunakan modul formulir kontak Divi dan fungsi logika kondisional kami.
Sekilas tentang Formulir Kontak Bersyarat
Ketika semua dikatakan dan dilakukan, Anda akan memiliki sesuatu yang mirip dengan ini di situs web Anda, siap untuk digunakan pengunjung Anda.
Apa sebenarnya Logika Bersyarat itu?
Untuk memulai, kami ingin mendefinisikan logika kondisional secara ringkas. Dalam pelajaran ini, kita akan menyiapkan rangkaian formulir kontak yang muncul tergantung pada pilihan yang dibuat atau tidak dibuat oleh pengguna.
Misalnya, Anda dapat memiliki satu formulir kontak yang berubah tergantung pada layanan atau produk apa yang dibutuhkan pengunjung. Dengan begitu, alih-alih mereka harus menuliskannya, Anda dapat memiliki informasi yang Anda butuhkan dalam format yang Anda butuhkan. Logika kondisional formulir kontak membantu meningkatkan komunikasi dan mempercepat kemampuan Anda memberi untuk pengguna Anda.
Buat Situs Web Luar Biasa
Dengan Elementor pembuat halaman gratis terbaik
Mulai sekarangDengan mengingat hal itu, mari kita mulai mengembangkan formulir kontak yang ditargetkan.
Cara Menggunakan Logika Bersyarat untuk Membuat Formulir Kontak
Buka Pembuat Divi.
Kita harus masuk ke Divi Builder karena kita menggunakan modul Divi Contact Form. Dalam tutorial ini, kita akan menggunakan paket layout Landscape Maintenance sebagai contoh. Anda dapat menggunakan tata letak atau desain apa pun yang Anda suka, tetapi Anda harus dapat menggunakan dan mendesain Modul Formulir Kontak Divi.
Untuk memulai, navigasikan ke Divi Builder di bagian belakang situs WordPress Anda. Di dalam Editor Halaman, Anda akan melihat tombol ungu berlabel "Gunakan Divi Builder" (atau Edit dengan Divi Builder jika Anda telah membuat Halaman).
Masukkan atau temukan Modul Formulir Kontak.
Kemudian, kenali Modul Formulir Kontak yang ada di halaman atau klik ikon Lingkaran Hitam + dan pilih Formulir Kontak dari menu tarik-turun.
Isi Pengaturan Formulir Kontak
Secara default, modul Formulir Kontak Divi mencakup tiga bidang: Nama, Email, dan Pesan. Kami akan membuat formulir kontak sehingga opsi tersebut tidak muncul sampai pengunjung memberikan informasi yang cukup kepada kami untuk mengarahkan pertanyaan mereka.
Menambahkan Pertanyaan Bersyarat pertama
Isilah bagian yang kosong dengan pertanyaan bersyarat pertama. Tombol " Tambahkan Bidang Baru " dapat ditemukan di bawah tab Konten , di bawah bidang apa pun yang ada dalam formulir. Cukup klik itu.
Ini menampilkan kotak Pengaturan Bidang , di mana Anda akan melihat bidang untuk ID Bidang dan Judul . ID Bidang ditujukan untuk Anda. Itulah yang muncul di pengaturan modul untuk Anda pantau. Judul adalah teks yang akan dilihat pengunjung Anda di bagian depan formulir. (Judul juga akan ditampilkan di email yang Anda terima setelah mengirimkan formulir.)
ID Bidang diberi tag "Bersyarat" karena ini adalah pertanyaan pertama yang akan dilihat pengunjung di formulir. Apa yang mereka lihat selanjutnya akan ditentukan oleh reaksi mereka terhadapnya. Ini adalah cara sederhana untuk melacak alur pertanyaan dan jawaban formulir.
Tambahkan Opsi Bidang
Gulir ke bawah ke bagian Opsi Bidang di bawah Tab Konten. Di sinilah Anda akan meletakkan opsi untuk dipilih pengguna. Masing-masing akan berfungsi sebagai prompt untuk pertanyaan tambahan. Kotak centang digunakan sebagai tipe input dalam contoh ini. Ini berarti bahwa konsumen memiliki pilihan untuk memilih sebanyak yang mereka inginkan.
Selain Kotak Centang, Divi mendukung fitur tambahan berikut: Bidang Input dan Area Teks untuk tanggapan yang diketik pengguna sendiri, Pilih Dropdown dan Tombol Radio untuk pilihan individual yang Anda berikan, dan Bidang Email untuk entri alamat email. Bidang Nama default adalah Bidang Input, sedangkan bidang Pesan default adalah Textarea.
Dengan mencentang Kotak centang, kami akan memasukkan opsi yang ingin kami picu setelahnya. Kemudian, untuk mencegah pengguna mengirimkan formulir sebelum waktunya, kami ingin menjadikan ini sebagai Bidang Wajib .
Perlu dicatat bahwa kami tidak menggunakan Logika Bersyarat pada tahap ini. Karena ini adalah pemicunya, itu akan muncul kepada pengguna apa pun.
Buat Bidang Respons Bersyarat Baru
Namun, untuk Fields baru yang kami tambahkan sebagai tanggapan tindak lanjut, kami akan menambahkan Logika Bersyarat berikutnya. Karena kami menyertakan tiga opsi untuk pertanyaan pertama, kami akan menambahkan tiga bidang baru yang setara ke formulir. Anda harus mengulangi langkah-langkah di bawah ini untuk masing-masing.
Beri nama tanggapan bersyarat pada bidang baru
Kami telah menggunakan praktik penamaan Bersyarat 1 (untuk menunjukkan pemicu bersyarat pertama) diikuti oleh 1a, 1b, dan 1c untuk tanggapan tindak lanjut. Kami juga telah memberi label dengan tepat sehingga kami tahu apa itu.
Sama halnya dengan pertanyaan pertama, kita akan memasukkan Judul sebagai pertanyaan yang akan dilihat pengunjung.
Menambahkan Logika Bersyarat ke Bidang Respons.
Setelah itu, turun ke bagian Logika Bersyarat dari tab Konten bidang itu. Nyalakan sakelar Logika Bersyarat . Kemudian, untuk yang ini, pilih Hubungan, yang berarti Anda dapat mengaturnya ke sembarang (jumlah respons berapa pun dapat menyebabkan pilihan ini ditampilkan) atau semua (hanya kombinasi respons tertentu yang membuat bidang ini muncul).
Jika Anda hanya menggunakan satu aturan pemicu, seperti kami, salah satu atau semuanya akan berfungsi.
Anda akan melihat bidang yang mengaktifkan yang ini di bawah Aturan, dan di sebelah kanan, Anda dapat memilih opsi mana yang akan memicunya. Kualifikasi, seperti sama, tidak sama, kurang dari, lebih dari, dan seterusnya, terletak di tengah. Untuk bidang ini, kami memilih pertanyaan Bersyarat 1 dan kemudian pilihan di dalamnya yang secara eksplisit menyebabkan bidang ini muncul.
Ulangi langkah itu untuk semua Respons Bersyarat.
Karena kami memperkenalkan tiga kemungkinan tanggapan untuk pertanyaan bersyarat tunggal kami, kami akan melakukan hal yang sama untuk bidang lainnya. Hanya balasan korelatif yang tepat untuk pilihan itu yang dibuat.
Setel ‘Nama/Email/Pesan' dari Bidang Formulir Kontak agar Muncul
Setelah Anda mengonfigurasi respons untuk logika bersyarat, kami ingin pengunjung dapat mengirimkan formulir. Untuk mencapai ini, kami akan memodifikasi logika Bersyarat di bidang Nama , Email , dan Pesan . Karena persiapan untuk masing-masingnya sama, Anda akan mengulanginya tiga kali.
Buka Logika Bersyarat di bawah pengaturan bidang Nama, Email, dan Pesan. Aktifkan dan masukkan sebanyak mungkin tanggapan akhir untuk pertanyaan tindak lanjut bersyarat Anda. Dalam contoh ini, kami memiliki tiga pertanyaan lanjutan, oleh karena itu kami menerapkan tiga aturan.
Pilih pertanyaan lanjutan sebagai pemicu untuk setiap aturan. Atur qualifier menjadi tidak kosong, artinya syarat terpenuhi selama pengunjung menjawab pertanyaan. Kotak terakhir akan berwarna abu-abu, menunjukkan bahwa jawaban apa pun sudah memadai.
Simpan perubahan Anda, lalu ulangi untuk bidang lain yang ingin Anda tampilkan untuk mengizinkan pengiriman formulir. Itu saja! Formulir Anda akan secara otomatis menyesuaikan dengan kebutuhan konsumen Anda.
Hasil Akhir
Anda dapat melihat cara kerja logika kondisional dalam praktiknya dalam video di bawah ini.
Pikiran Akhir
Salah satu bagian paling umum dari sebuah situs web adalah formulir kontak. Hampir setiap situs web memilikinya, dan hampir setiap situs web membutuhkannya. Namun, tidak setiap orang mengunjungi situs web Anda untuk alasan yang sama. Anda dapat mengubah formulir kontak Anda menjadi alat dinamis bagi pengguna Anda untuk berkomunikasi dengan menggunakan fungsi logika kondisional Divi.
