Cara Mengizinkan Pengunjung Menggandakan Bidang Formulir

Diterbitkan: 2024-06-14

Ada kalanya pengguna formulir Anda mungkin berharap mereka dapat menduplikasi bidang di formulir Anda. Bidang untuk nama tambahan, detail kontak, jam kerja, dan sebagainya mudah ditambahkan ketika pengguna cukup mengulanginya.

Sekarang, dengan bidang WPForms Repeater, pengguna situs web Anda dapat melakukan hal itu! Dalam tutorial ini, saya akan menunjukkan cara memodifikasi formulir Anda untuk memungkinkan duplikat bidang hanya dalam 5 langkah.

Cara Mengizinkan Pengunjung Menggandakan Bidang Formulir

Dalam Artikel Ini

  • 1. Pilih atau Buat Formulir Anda
  • 2. Tambahkan Bidang Pengulang
  • 3. Menampilkan Baris atau Blok
  • 4. Pilih Tata Letak
  • 5. Sesuaikan Tampilan Tombol
  • Bonus: Bidang Pengulang Beraksi
  • Pertanyaan Umum

Pertama, Dapatkan WPForm

Oke, saya tahu saya mengatakan bahwa tutorial ini hanya membutuhkan 5 langkah, jadi ini sepertinya tambahan. Namun, sudah pasti Anda perlu menginstal dan mengaktifkan WPForms di situs WordPress Anda untuk menduplikasi bidang di formulir Anda.

WPForms home

Jadi, dapatkan plugin WPForms dulu!

1. Pilih atau Buat Formulir Anda

Bidang Repeater adalah fitur hebat yang disertakan dengan formulir yang Anda buat melalui WPForms. Dengan itu, pengguna formulir Anda bisa menambahkan lebih banyak entri atau menduplikasi seluruh blok formulir.

Namun Anda tidak perlu membuat formulir baru untuk mulai mengizinkan pengguna menduplikasi bidang.

Anda mungkin sudah menggunakan formulir di situs Anda yang ingin Anda modifikasi dengan bidang Repeater. Cukup klik Edit di bawah formulir yang pembuat formulirnya ingin Anda buka.

Editing a form

Namun, jika Anda perlu membuat formulir baru, Anda bisa mendapatkan langkah awal dengan memilih dari ribuan Templat formulir yang disediakan di galeri WPForms.

Kami menawarkan beragam pilihan Templat formulir yang dilengkapi dengan fungsionalitas bidang Repeater yang terpasang di dalamnya.

Browsing the Repeater field form templates

Atau, Anda bisa memilih Templat formulir yang berbeda dan dengan cepat menambahkan bidang Repeater dengan pembuat formulir.

Dan, seperti biasa, Anda dapat membuat sendiri formulir Anda dari awal dengan memulai dari formulir kosong.

Buat Formulir WordPress Anda Sekarang

2. Tambahkan Bidang Pengulang

Setelah formulir Anda dipilih dan dimuat di pembuat formulir, Anda dapat menambahkan bidang Pengulang .

Anda akan melihatnya di antara kolom di sisi kiri layar.

Adding the Repeater field to a form

Cukup klik pada bidang Repeater, seret ke formulir Anda, dan letakkan di tempat yang Anda inginkan.

Kemudian, seperti bidang Tata Letak, bidang Pengulang memungkinkan bidang lain di formulir Anda untuk ditambahkan ke dalamnya.

Adding fields to the Repeater field area

Jadi, bidang apa saja yang termasuk dalam bagian Bidang Pengulang? Bidang yang ingin Anda izinkan untuk diduplikasi oleh pengguna formulir Anda.

Pada formulir pendaftaran grup, misalnya, pengguna mungkin ingin memasukkan beberapa nama peserta untuk mendaftar pada waktu yang bersamaan.

Front-end view of the Repeater field

Sebelum WPForms menawarkan bidang Repeater, Anda mungkin telah memenuhi formulir Anda dengan beberapa bidang Nama yang * mungkin* dibutuhkan oleh pengguna Anda.

Atau Anda mungkin telah menggunakan pengaturan logika kondisional untuk menyertakan kolom Nama tambahan jika pengguna ingin menyertakan lebih banyak.

Applying conditional logic settings

Apapun masalahnya, bidang Repeater sekarang membuat duplikasi bidang jauh lebih mudah bagi Anda dan pengguna formulir Anda!

3. Menampilkan Baris atau Blok

Sekarang, sebelum kita melangkah lebih jauh, lihat opsi Tampilan yang diterapkan pada bidang Pengulang.

Selecting the Repeater field to display rows

Anda tidak hanya dapat menyesuaikan bidang dalam area bidang Pengulang untuk ditambahkan sebagai Baris tunggal, namun Anda juga dapat mengizinkan seluruh Blok bidang untuk diduplikasi.

Tip Pro : Navigasikan ke tab Advanced untuk menyembunyikan label bidang Repeater seperti yang saya lakukan.

Saat Anda memilih bidang di area Pengulang untuk ditampilkan sebagai Baris, pengguna formulir Anda akan menduplikasi setiap garis horizontal.

Front-end view of the Repeater field block

Seperti yang Anda lihat di atas, tombol + tambah atau hapus ada di akhir setiap Baris.

Blok, sebaliknya, bagus untuk menggabungkan bidang yang akan diulangi bersama-sama, yang tidak dapat ditampung hanya pada satu Baris.

Selecting the Repeater field display as Blocks

Dan dengan Blok, tombol + tambah atau – hapus berada di bawah seluruh bagian bidang. Lebih lanjut tentang tombol-tombol itu, nanti.

Dalam contoh saya di bawah ini, saya memilih Blok sebagai cara menampilkan bidang berulang saya. Saya kemudian memasukkan bidang-bidang di area bidang Pengulang yang saya ingin agar pengguna dapat menduplikasinya sebagai suatu bagian.

Front-end view of Repeater field blocks

Sekarang, ketika pengguna formulir menambahkan peserta lain, mereka dapat memberikan semua informasi yang saya perlukan pada formulir untuk setiap Blok.

Dengan cara ini, pengguna formulir bisa menduplikasi seluruh bagian formulir sekaligus.

4. Pilih Tata Letak

Selanjutnya, lihat berbagai cara untuk mengatur Tata Letak bidang berulang Anda.

Selecting the Repeater field layout

Anda dapat mengatur bidang Anda dalam satu baris, kolom dengan jarak yang sama, dan kolom tidak rata.

Jika Anda memiliki Baris nama dan usia peserta yang dapat diulang, misalnya, Anda dapat memilih Tata Letak yang menempatkan spasi lebih besar untuk nama dan spasi lebih kecil untuk usia.

Selecting the Repeater field 2 column layout

Jadi, contoh kolom Baris dan Tata Letak saya di pembuat formulir di atas akan terlihat seperti ini bagi pengguna formulir:

Atau, ingat Blok I yang ditunjukkan kepada Anda di akhir langkah 3 dengan Nama Peserta, Informasi Kontak Darurat, dan kolom lainnya?

Saya dapat menggunakan Tata Letak 2 kolom untuk menyesuaikan bagian formulir ini.

Selecting the Repeater field 2 column layout

Kemudian, bagi pengguna akan terlihat seperti ini:

Front-end view of the Repeater field 2 column layout

Kiat Pro : Gunakan bidang Nama satu baris yang sederhana untuk menjaga jarak kolom secara merata seperti yang saya lakukan di atas.

Memodifikasi aspek bidang Repeater ini hanya membantu menjaga semuanya tetap rapi dan teratur di seluruh formulir Anda.

5. Sesuaikan Tampilan Tombol

Hal terakhir yang perlu disesuaikan dalam bagian bidang pengulang Anda adalah tombol + dan – untuk menambah dan menghapus bidang berulang.

Ini adalah tombol yang akan diklik oleh pengguna formulir Anda untuk menambahkan nama, bagian pendaftaran, atau bidang lain apa pun yang Anda sediakan untuk diduplikasi.

Secara default, tombol-tombol ini menampilkan + atau – di akhir setiap Baris, namun Anda dapat menyesuaikan ikon-ikon ini saat menggunakan Blok.

Navigating to the Repeater field button settings

Karena tombol-tombolnya ditempatkan di bawah Blok, bukan di ujung Baris, memungkinkannya menjadi lebih panjang melalui penyesuaian tetap menjaga semuanya tetap rapi secara visual.

Pertama, pilih Jenis Tombol .

Selecting the Repeater field button type

Opsi di sini meliputi:

  • Tombol dengan ikon
  • Tombol
  • Ikon dengan teks
  • Ikon
  • Teks biasa

Jika tombol Anda menampilkan teks apa pun, Anda dapat menyesuaikannya di kotak berikutnya. Di sinilah Anda dapat mengubah apa yang dibaca Label Tombol .

Customizing the Repeater field button labels

Pada formulir pendaftaran grup, misalnya, Anda dapat menyesuaikan tombol untuk membaca “Tambahkan Peserta”.

Terakhir, Anda dapat memilih Batas minimum dan maksimum untuk bidang berulang Anda.

Setting the Repeater field button limit

Secara default, Limit ini diatur minimal 1 dan maksimal 10. Artinya pengguna formulir dapat mendaftarkan maksimal 10 peserta pada formulir ini.

Jadi, ketika menerapkan pengaturan yang ditunjukkan di atas, tombol pada formulir pendaftaran grup kami akan terlihat seperti ini untuk pengguna:

Front-end view of the Repeater field button

Seperti biasa, jika Anda puas dengan bidang yang disesuaikan dan dapat diulang, pastikan untuk menyimpannya formulir Anda untuk dipublikasikan saat Anda siap.

Dan hanya itu saja! Anda sekarang tahu cara mengizinkan pengunjung situs web untuk menduplikasi bidang di formulir Anda.

Bonus: Bidang Pengulang Beraksi

Saya telah menunjukkan kepada Anda cara menggunakan area bidang Repeater pada formulir pendaftaran grup, namun saya ingin berbagi beberapa contoh bagus lainnya dari penerapan fitur ini.

Formulir Absen Karyawan

Pertama, lihat lembar waktu karyawan yang kami tawarkan sebagai templat:

Full view of the employee timesheet form template

Detail karyawan dikumpulkan terlebih dahulu, termasuk nama, email karyawan, ID karyawan, ditambah total jam kerja mereka dalam seminggu.

The employee details section of the template

Karyawan kemudian dapat memasukkan hari dan jam kerja spesifik mereka dalam seminggu, yang pada dasarnya menggunakan formulir ini sebagai lembar waktu mingguan.

The weekly timesheet section of the form template

Ini menggunakan Blok dan kolom berulang yang memungkinkan pengguna menduplikasi bidang untuk hari kerja mereka, bersama dengan waktu masuk dan waktu keluar hari itu. Bidang-bidang ini dapat diulang hingga 14 kali, atau shift ganda selama seminggu.

Ingin menggunakan formulir ini di situs web Anda? Dapatkan templatnya!

Formulir Daftar Kelas

Sekarang, lihat daftar nama kelas yang juga kami tawarkan sebagai templat:

Full view of the class roster form template

Dimulai dengan mengumpulkan informasi guru untuk memudahkan pelacakan pada setiap pengiriman.

The teacher information section of the form template

Kemudian, dengan bidang Repeater, guru dapat dengan mudah menambahkan informasi untuk setiap siswa di daftar nama mereka — seperti tingkat kelas, tanggal lahir, atau data lain apa pun yang ingin mereka sertakan untuk pencatatan.

The class roster section of the form template

Guru dapat menggunakan daftar nama ini hingga 20 siswa. Atau, seperti biasa, Templat formulir ini sepenuhnya dapat dikustomisasi, sehingga jumlah maksimum entri yang diperbolehkan dapat diubah.

Suka formulir ini? Dapatkan templatnya!

Mengapa Saya Harus Mengizinkan Pengunjung Menggandakan Bidang Formulir?

Ini bagus untuk pengguna formulir Anda! Memungkinkan pengunjung untuk menduplikasi kolom formulir membuat proses pengisian formulir menjadi lebih mudah, terutama ketika pengguna perlu memasukkan informasi serupa atau berulang. Hal ini dapat menghemat waktu pengunjung situs Anda dan menjadikan pengalaman pengisian formulir mereka lebih nyaman dan efisien.

Dan itu juga baik untukmu! Ketika pengguna bisa menduplikasi bidang formulir, akan lebih mudah bagi Anda untuk mengumpulkan dan mengatur data untuk analisis, karena titik data serupa dikelompokkan dan lebih mudah dikelola.

Selain itu, ini membuat formulir Anda tetap teratur dan menarik secara visual. Pengunjung situs Anda tidak akan kewalahan dengan bagian kolom kosong yang panjang, dan Anda tidak perlu membuat rangkaian aturan logika kondisional yang berbelit-belit untuk menyembunyikan kolom tambahan.

Bidang Repeater adalah win-win solution bagi semua orang!

Pertanyaan Umum

Di WPForms, kami selalu senang memberikan panduan tentang fitur dan alat yang kami sediakan. Jadi, berikut adalah jawaban atas beberapa pertanyaan umum kami tentang menduplikasi kolom formulir:

Apa yang dimaksud dengan mengizinkan pengunjung menggandakan kolom formulir?

Mengizinkan pengunjung menduplikasi bidang formulir berarti memberi mereka opsi untuk membuat beberapa contoh bidang tertentu dalam formulir. Dengan cara ini, mereka dapat memasukkan informasi serupa atau berulang dengan lebih efisien.

Di WPForms, kami menyebut duplikat ini sebagai bidang Pengulang, karena pengguna formulir dapat mengulangi bidang ini untuk memasukkan informasi lebih lanjut.

Bagaimana cara menerapkan duplikasi bidang pada formulir situs web saya?

Metode penerapan mungkin berbeda-beda bergantung pada platform atau alat yang Anda gunakan.

Sedangkan untuk WPForms, kami mengaktifkan duplikasi bidang dengan tindakan klik atau drag-and-drop sederhana. Dalam kasus lain, Anda mungkin perlu menggunakan kode atau plugin khusus untuk menambahkan fungsi ini.

Haruskah saya menetapkan batas berapa kali bidang formulir dapat diduplikasi?

Menetapkan batas dapat membantu menjaga kegunaan formulir dan mencegah pengguna membuat kolom dalam jumlah berlebihan, yang mungkin berdampak pada performa formulir atau pengelolaan data.

Dengan bidang WPForms Repeater, Anda dapat menetapkan batas maksimum untuk entri duplikat, sehingga Anda mengontrol aspek formulir Anda ini.

Buat Formulir WordPress Anda Sekarang

Selanjutnya, Lihat Panduan Cepat dan Mudah Ini

Saya telah berbagi cukup banyak informasi tentang cara mengizinkan pengunjung untuk menduplikasi bidang, namun masih banyak lagi yang perlu dipelajari tentang penggunaan bidang Pengulang. Fitur ini menawarkan begitu banyak hal, ada banyak hal yang bisa dicakup.

Untuk mempelajari beberapa tip tambahan yang cepat dan mudah — termasuk ide penyesuaian yang tidak dibahas di sini — pastikan untuk melihat tutorial bidang Repeater kami.

Siap membuat formulir Anda? Mulailah hari ini dengan plugin pembuat formulir WordPress termudah. WPForms Pro menyertakan banyak templat gratis dan menawarkan jaminan uang kembali 14 hari.

Jika artikel ini membantu Anda, silakan ikuti kami di Facebook dan Twitter untuk tutorial dan panduan WordPress gratis lainnya.