Ikhtisar Formulir - Bantuan Webflow
Formulir adalah salah satu alat paling kuat di web, memungkinkan Anda untuk menangkap informasi secara efisien, baik saat mengumpulkan pendaftaran buletin email atau pertanyaan kerja dari calon klien. Dengan Webflow, Anda dapat sepenuhnya menyesuaikan dan mengoptimalkan formulir Anda agar sesuai dengan kebutuhan Anda. Anda dapat menambahkan blok formulir ke situs Anda dari Panel Tambah → Elemen → Formulir.
Anatomi Formulir
Blok Formulir mewarisi lebar penuh dari elemen induknya dan berisi tiga elemen anak:
- Formulir — berisi semua input dan elemen formulir Anda
- Pesan sukses — pesan yang dikembalikan ketika formulir berhasil dikirim
- Pesan kesalahan — pesan yang dikembalikan ketika ada masalah dengan pengiriman formulir
Struktur Formulir
Anda dapat menambahkan atau menghapus elemen formulir berikut dalam formulir untuk menyesuaikan formulir Anda sesuai kebutuhan:
| Elemen Formulir | Tujuan |
|---|---|
| Label bidang | Digunakan untuk menjelaskan fungsi atau tujuan dari bidang formulir. Label bidang penting untuk aksesibilitas. |
| Input | Digunakan untuk mengumpulkan data satu baris, seperti jawaban singkat untuk pertanyaan (misalnya, nama atau alamat email) |
| Unggah file | Memungkinkan pengunjung situs melampirkan file ke pengiriman formulir mereka |
| Area teks | Memungkinkan pengunjung situs memasukkan data multi-baris, seperti pesan panjang |
| Kotak centang | Digunakan untuk data input di mana pengunjung situs dapat memilih satu atau beberapa opsi |
| Tombol radio | Digunakan untuk data input di mana pengunjung situs dapat memilih hanya satu dari banyak opsi |
| Pilih | Digunakan untuk memungkinkan pengunjung situs memilih opsi dari daftar dropdown. Pilihan ganda diizinkan |
| reCAPTCHA | Layanan Google yang mencegah spam formulir |
| Tombol kirim | Mengirim semua data yang dikumpulkan dalam formulir. Tidak ada formulir yang lengkap tanpa Tombol kirim |
Cara mengonfigurasi elemen Formulir
Anda dapat mengklik dua kali elemen formulir (misalnya, Input, Tombol Kirim) untuk membuka pengaturannya. Setiap elemen formulir memiliki pengaturan input yang berbeda berdasarkan jenisnya:
| Pengaturan Input | Tujuan | Catatan tambahan |
|---|---|---|
| Nama | Mengidentifikasi bidang pada pengiriman formulir | n/a |
| Wajib | Memungkinkan Anda mewajibkan pengisian bidang formulir untuk mengirimkan formulir | Memblokir pengiriman kosong |
| Placeholder | Menampilkan teks di input yang menghilang saat mengetik; seharusnya TIDAK menggantikan label atau instruksi penting | Tidak tersedia untuk teknologi bantu atau alat terjemahan; dapat distil dari menu status |
| Jenis teks | Menentukan jenis input (misalnya email, telepon, kata sandi) | Telepon menerima karakter & menampilkan keypad; kata sandi menyembunyikan karakter yang diketik |
| Autofokus | Menentukan apakah bidang akan otomatis fokus saat halaman dimuat | Perhatikan masalah gulir/lompatan atau bidang tersembunyi yang memblokir pengiriman |
Tombol Kirim
Pengaturan Tombol Kirim memungkinkan Anda mengatur:
- Teks tombol: Apa yang muncul di tombol (default: “Kirim”)
- Teks menunggu: Apa yang menggantikan tombol setelah diklik & sebelum pengiriman selesai (default: “Harap tunggu…”)
Cara mengelola pengaturan formulir
Sesuaikan status sukses dan kesalahan
Pilih blok formulir dan buka Pengaturan blok formulir untuk:
- Normal: Status default
- Sukses: Pesan setelah pengiriman berhasil
- Kesalahan: Pesan setelah pengiriman gagal
Tetapkan nama formulir
Nama yang Anda tetapkan mengaitkan formulir dengan data pengirimannya. Jika Anda tidak menetapkan nama unik, semua data pengiriman muncul di bawah "Formulir Email." Beri nama deskriptif untuk membedakan formulir.
Kelola pengiriman formulir dan notifikasi
- Tentukan penerima di Pengaturan blok Formulir.
- Akses notifikasi lanjutan di Pengaturan situs → Formulir → Notifikasi Formulir.
- Untuk pemilik situs penuh: akses/kelola data formulir di Pengaturan situs → Formulir → Pengiriman Formulir.
Alihkan pengunjung situs saat pengiriman formulir
Tambahkan URL di bidang Redirect untuk mengirim pengguna ke tempat lain setelah pengiriman.
Tetapkan tindakan khusus
Tambahkan tindakan khusus untuk mengirim pengiriman ke tempat lain (misalnya HubSpot). Saat Anda menambahkan ini, Webflow tidak memproses atau mengirim notifikasi. Anda juga dapat menghubungkan Aplikasi untuk lebih banyak integrasi.
Lihat koneksi aplikasi
Aplikasi yang terhubung akan muncul di Koneksi. Catatan: Kirim data formulir ke Webflow selalu muncul kecuali Anda sepenuhnya melewati pemrosesan Webflow.
Data formulir dan GDPR
- Jika Anda mengumpulkan data pribadi dari penduduk UE (termasuk melalui formulir), Anda adalah pengendali data di bawah GDPR.
- Dapatkan persetujuan yang tepat untuk pengumpulan data.
- Jika membangun untuk klien, edukasi mereka tentang tanggung jawab mereka.
- Tinjau tanggung jawab jika menghubungkan data ke pihak ketiga (misalnya, Zapier).
Pelajari lebih lanjut:
Pemecahan masalah
Jika formulir Anda tidak dapat dikirim:
- Jika Anda telah mengaktifkan reCAPTCHA, pastikan semua formulir menyertakannya. Jika tidak, pengiriman akan gagal.
- Jika Anda memiliki bidang tersembunyi, pastikan Autofocus dimatikan untuk bidang tersebut.
- Situs gratis/tidak dihosting dibatasi hingga 50 total pengiriman formulir. Tingkatkan rencana situs Anda untuk menghapus batasan tersebut.
Jika masalah berlanjut, hubungi dukungan pelanggan.