Suatu saat, sebagian besar situs WordPress melewati dasar-dasarnya. Anda perlu menerima pemesanan, mengumpulkan brief proyek, memungkinkan orang mendaftar untuk acara, mengumpulkan masukan setelah pembelian, atau menerima permintaan pesanan dengan spesifikasi kustom. Masing-masing memerlukan jenis formulir yang berbeda—kolom formulir yang berbeda, logika yang berbeda, tata letak yang berbeda—dan WordPress tidak dilengkapi pembuat formulir bawaan yang mencakup semuanya.
Elfsight Form Builder – a no-code visual editor that works on any WordPress setup without plugin installation. We’ll cover the full process from picking a form type through embedding it on a live page, along with alternative methods and when each one makes more sense.”>Panduan ini membimbing Anda langkah demi langkah untuk menambahkan formulir di WordPress menggunakan Elfsight Form Builder – editor visual tanpa kode yang bekerja pada setiap pengaturan WordPress tanpa instalasi plugin. Kami akan membahas proses lengkap mulai dari memilih tipe formulir hingga menyematkannya pada halaman yang sudah online, beserta metode alternatif dan kapan masing-masing lebih masuk akal.
- Panduan menyeluruh dengan konteks pengambilan keputusan di setiap langkah
- Skenario bisnis umum — dan bagaimana mengonfigurasi formulir untuk masing-masing
- Perbandingan jujur Elfsight vs. metode formulir bawaan WordPress
- Tips optimasi dan FAQ dunia nyata dari pengguna WordPress
Penyiapan 5 Menit: Tambahkan Formulir di WordPress
Kalau Anda sudah tahu persis apa yang Anda perlukan dan ingin langsung live, berikut jalur kilat untuk menambahkan Formulir ke WordPress dalam beberapa langkah saja:
- Buka editor Pembuat Formulir dan pilih templat
- Atur dan sesuaikan widget formulir Anda
- Klik “Tambahkan ke Situs Web” dan salin kode sematan
- Tempel potongan kode ke backend WordPress Anda → Publikasikan
🚀 Buat formulir WordPress Anda sendiri sekarang juga di editor interaktif!
Kapan (dan Mengapa) Menambahkan Formulir ke Situs WordPress Anda
Anda mungkin tidak perlu kami menjelaskan mengapa formulir itu berguna — Anda di sini karena Anda memang membutuhkannya. Namun tipe formulir yang Anda buat dan di mana Anda menempatkannya sama pentingnya dengan langkah-langkah panduan. Berikut adalah situasi yang paling umum, dengan prioritas apa yang perlu Anda utamakan di masing-masing.
💬 Kontak dan Penangkapan Prospek
Titik awal yang paling umum — formulir kontak, pendaftaran buletin, atau formulir penghasil prospek di halaman arahan. Satu hal yang sering terlewat orang: menambahkan satu bidang terstruktur seperti dropdown “What’s this about?” menghemat berjam-jam penyortiran kotak masuk. Untuk penangkapan prospek tanpa halaman khusus, formulir popup dan panel mengambang bekerja dengan sangat baik — mereka muncul saat Anda mengklik tombol atau terletak di tepi layar tanpa mengambil banyak ruang halaman.
📅 Pemesanan, reservasi, dan janji temu
Restoran, salon, properti sewaan, konsultan — jika bisnis Anda berjalan dengan slot terjadwal, formulir pemesanan menggantikan telepon bolak-balik. Kumpulkan keperluan utama (tanggal, waktu, jenis layanan, info kontak) dan hindari menambah kolom yang melayani operasional internal tetapi mengganggu pengunjung.
💲 Pesanan dan Donasi
Formulir pesanan mencakup skenario di mana pembelian tidak sekadar tambahkan ke keranjang — cetak khusus, katering, grosir, paket layanan dengan opsi yang dapat dikonfigurasi. Padukan dengan bidang unggah file ketika pelanggan perlu melampirkan logo atau brief desain. Formulir donasi secara struktural sederhana, tetapi bidang bersyarat juga membantu di sini — tampilkan opsi frekuensi berulang hanya jika pendonor memilih untuk berlangganan.
📋 Umpan balik, ulasan, dan survei
Bidang Penilaian (bintang, skala angka, emotikon) ditambah kotak komentar opsional. Buat singkat — formulir umpan balik dengan 3 bidang akan mendapatkan respons jauh lebih banyak daripada yang 10 bidang. Jika Anda ingin testimoni terstruktur yang bisa Anda gunakan kembali di situs Anda, tambahkan nama, peran, dan penilaian bintang di samping komentar sehingga Anda mendapatkan kutipan yang bisa dipublikasikan, bukan satu kalimat samar.
📑 Pendaftaran, keanggotaan, dan aplikasi
Pendaftaran acara, formulir keanggotaan, lamaran kerja, dan penerimaan program — ini biasanya lebih panjang, dan di sinilah tata letak multi-tahap menunjukkan keampuhannya. Membagi formulir dengan 12 bidang menjadi tiga langkah dengan bilah kemajuan secara drastis mengurangi tingkat pengabaian. Formulir pendaftaran secara khusus diuntungkan oleh logika bersyarat (menampilkan pertanyaan yang berbeda berdasarkan peran atau program yang dipilih) dan bidang unggah berkas untuk resume atau portofolio.
Kompleksitasnya harus selaras dengan keputusan: pendaftaran newsletter terdiri dari satu bidang, formulir kontak tiga bidang, dan pengajuan hibah bisa mencapai lima belas bidang dalam empat langkah. Atur konfigurasi sesuai kebutuhan.
Sekarang, mari kita buat formulir yang sesungguhnya.
Langkah demi Langkah: Cara Menambahkan Formulir di WordPress
Panduan ini menggunakan Elfsight Form Builder, berjalan sepenuhnya di peramban Anda — tidak perlu menginstal apa pun pada WordPress. Anda mengonfigurasi semuanya melalui editor visual, mendapatkan kode sematan, dan menempelkannya ke halaman Anda.
Langkah 1: Pilih Titik Awal
Open the editor, and you’ll see 300+ template options for various use cases grouped into categories. The template you pick isn’t a locked-in commitment — it just pre-fills the editor with a relevant field set. You can add, remove, or rearrange any field afterward, so choose whichever is closest to what you need and customize from there.
Langkah 2: Bangun Sekumpulan Bidang Anda
Di sinilah formulir mulai terbentuk. Editor mendukung 15+ tipe bidang: input teks, info kontak, dropdown, kotak centang, tombol radio, pemilih tanggal, unggahan berkas, skala penilaian, dan lain-lain. Untuk setiap bidang, tetapkan label, teks placeholder, deskripsi, dan apakah itu wajib atau opsional.
Beberapa keputusan yang penting di sini:
Bidang Wajib vs. Opsional. Tandai hanya apa yang benar-benar Anda perlukan. Setiap bidang wajib meningkatkan gesekan. Jika Anda membuat formulir kontak, nama dan email diwajibkan — pesan mungkin juga. Nomor telepon? Jadikan opsional kecuali Anda benar-benar berencana menghubungi orang.
Logika bersyarat. Jika formulir Anda melayani beberapa tujuan, Anda bisa menampilkan kolom lanjutan yang berbeda berdasarkan pilihan pengunjung. Misalnya, formulir pemesanan studio foto bisa menampilkan “Jenis Acara” dan “Jumlah Tamu” hanya saat pengunjung memilih “Fotografi Acara” dari dropdown layanan, sementara menampilkan “Deskripsi Produk” untuk pertanyaan pemotretan produk. Aktifkan ini per-kolom di pengaturan editor.
Unggahan File Berguna untuk brief desain, resume, gambar referensi, atau skenario apa pun di mana pengunjung perlu melampirkan dokumen. Perlu diingat bahwa meminta unggahan file pada formulir kontak pertama dapat menimbulkan friksi — pertimbangkan menjadikannya opsional dengan catatan seperti Lampirkan file jika relevan.
Langkah 3: Tambah Navigasi Multi-Langkah (Jika Formulir Anda Panjang)
Jika formulir Anda memiliki lebih dari lima atau enam isian, bagi menjadi beberapa langkah. Buka tab Tata Letak jika Anda belum memilih templat multi-langkah, lalu kembali ke Buat Formulir untuk mengisi setiap halaman secara terpisah. Setiap halaman menjadi langkah terpisah dengan tombol Berikutnya dan Kembali, serta sebuah bilah kemajuan visual yang menunjukkan status penyelesaian.
Saat Anda tidak memerlukan multi-langkah: Form kontak sederhana (3-4 kolom), pendaftaran buletin, dan formulir umpan balik cepat bekerja lebih baik sebagai satu langkah. Menambahkan langkah pada formulir singkat hanya menambah klik yang tidak perlu.
Langkah 4: Mengatur Notifikasi Email
Pergi ke tab Email untuk mengontrol apa yang terjadi setelah pengunjung mengirimkan formulir. Di sinilah Anda mengatur email penerima (atau beberapa alamat — berguna jika tim penjualan dan dukungan perlu melihat beberapa pengiriman), subjek, dan nilai isian formulir mana yang dimasukkan ke dalam email pemberitahuan.
Dua hal yang perlu dikonfigurasi di sini yang sering diabaikan banyak orang:
Balasan otomatis untuk pengunjung. Aktifkan ini. Konfirmasi sederhana “Terima kasih, kami telah menerima pesan Anda dan akan menanggapi dalam 24 jam” membangun kepercayaan dan mengurangi kekhawatiran “apakah formulir saya sudah terkirim?”. Ini juga menyediakan tempat yang tepat untuk menetapkan ekspektasi waktu respons.
Judul subjek khusus dengan nilai bidang. Alih-alih “Pengiriman Formulir Baru” yang generik, sertakan nama pengunjung atau tipe pertanyaan di subjek: “Pertanyaan baru dari {Name} — {Service Type}.” Ketika Anda menerima 20 kiriman per hari, kotak masuk Anda akan mudah dipindai tanpa perlu membuka setiap email.
Langkah 5: Pilih Tata Letak dan Sesuaikan Desain
Di bawah Tata Letak, Anda akan melihat dua opsi penyematan, yang langsung memengaruhi bagaimana formulir Anda akan terlihat di situs Anda:
- Standar (inline) — Ditampilkan langsung di konten halaman tempat Anda meletakkan kode sematan. Terbaik untuk halaman formulir khusus atau bagian dalam halaman arahan.
- Panel Mengambang — Formulir lengket yang meluncur dari sisi layar. Cocok untuk formulir “minta panggilan balik” atau “dapatkan penawaran” yang bisa diakses dari posisi gulir mana pun tanpa mengorbankan ruang halaman.
Untuk opsi inline, Anda bisa memilih dari tiga gaya susunan bidang: vertikal, horizontal, dan multi-tahap (sesuai navigasi).
Setelah Anda menentukan posisi, beralih ke Tampilan untuk menyempurnakan warna, huruf, jarak antar bidang, gaya tombol, dan radius tepi agar selaras dengan tema WordPress Anda. Jika pedoman merek Anda mengharuskan gaya khusus di luar opsi bawaan, gunakan bidang CSS Kustom.
Langkah 6: Atur Apa yang Terjadi Setelah Pengiriman
Selain notifikasi email, tentukan apa yang dilihat pengunjung setelah menekan Kirim. Ada dua opsi:
- Pesan Terima Kasih Langsung — Konfirmasi muncul di dalam formulir itu sendiri. Sederhana dan tertata. Cocok untuk formulir di sidebar atau footer di mana mengarahkan ke halaman baru terasa mengganggu.
- Arahkan ke URL — Pengunjung akan diarahkan ke halaman ucapan terima kasih khusus setelah pengiriman.
Langkah 7: Sambungkan Integrasi (Opsional)
Jika pengiriman formulir Anda perlu mengalir ke alat lain, buka tab Integrations tab. Pembuat Formulir mendukung koneksi langsung ke:
- Google Sheets — Automatically push every submission into a spreadsheet. Useful if your team already tracks leads, orders, or registrations in Sheets and doesn’t want to export CSVs manually.
- Mailchimp — Alihkan pendaftaran email dan langganan buletin langsung ke daftar audiens Mailchimp Anda, dengan pemetaan bidang untuk segmen dan tag.
- Zapier / Make.com — Terhubung ke 5.000+ aplikasi. Kirim pengajuan ke CRM Anda, buat kartu Trello dari formulir intake proyek, aktifkan notifikasi Slack untuk pemesanan baru — sesuai kebutuhan alur kerja Anda.
- Webhooks — Untuk pengaturan khusus: kirim data formulir mentah ke endpoint mana pun yang Anda kendalikan.
Anda bisa melewati langkah ini sepenuhnya jika notifikasi email memenuhi kebutuhan Anda, dan nanti kembali untuk mengatur integrasi tanpa perlu menyematkan formulir lagi.
Langkah 8: Sematkan Formulir pada Halaman WordPress Anda
Setelah formulir Anda dikonfigurasi, klik “Tambahkan ke Situs” untuk menghasilkan kode pemasangan.
Berikut cara menyisipkan formulir di WordPress:
- Masuk ke backend WordPress dan buka Halaman, lalu buka halaman target untuk diedit.
- Di Editor Blok, klik ikon + untuk menambahkan blok baru.
- Cari dan pilih Custom HTML.
- Tempelkan kode instalasi Elfsight secara lengkap ke dalam blok.
- Publish or Update.
Formulir Anda akan langsung muncul di halaman yang dipublikasikan.
Untuk menambahkan formulir Anda di seluruh situs (mis. di sidebar atau footer), buka Penampilan → Widget, tambahkan sebuah HTML Kustom widget ke area yang diinginkan, tempelkan kode pemasangan, dan simpan.
Untuk situs WordPress yang menggunakan Elementor, seret elemen HTML (bukan “Custom HTML”) ke halaman, lalu tempelkan kodenya. Untuk panduan rinci berdasarkan platform, lihat panduan Pusat Bantuan kami.
Cara Lain Menambahkan Formulir di WordPress
Elfsight isn’t the only way to embed a form in WordPress, and depending on your situation, a different approach might be a better fit. Here’s an honest breakdown.
WPForms atau Contact Form 7 (Plugin WordPress)
Metode yang paling umum. WPForms memberi Anda builder drag-and-drop di dashboard WordPress; Contact Form 7 adalah alternatif ringan berbasis kode yang telah ada sejak 2007.
- Pergi ke Plugins → Add New di dasbor WordPress Anda.
- Cari “WPForms” (atau “Contact Form 7”) dan pasang/aktifkan.
- Buat formulir baru menggunakan editor bawaan plugin.
- Sisipkan formulir pada halaman menggunakan shortcode atau blok plugin.
Saat pilihan ini lebih tepat: Jika Anda ingin semua hal dikelola di dalam WordPress dan nyaman dengan pemeliharaan plugin, WPForms adalah alat yang andal dengan logika kondisional, formulir multi-langkah, dan integrasi pembayaran. Contact Form 7 sulit disaingi jika Anda seorang pengembang yang mencari solusi minimal dan gratis serta tidak keberatan menulis CSS.
Formulir HTML Manual
Bagi pengembang yang nyaman dengan kode, Anda bisa membuat formulir menggunakan HTML mentah dan menangani pengiriman melalui skrip PHP kustom atau endpoint pihak ketiga seperti Formspree.
- Tambahkan blok HTML Kustom ke halaman Anda di Editor Blok.
- Tulis markup HTML
<form>dengan bidang yang Anda inginkan. - Atur atribut
actionke berkas handler PHP Anda atau layanan eksternal. - Tata gaya dengan CSS di Penyesuaian Tema Anda atau stylesheet tema anak.
Kapan ini menjadi pilihan yang lebih tepat: Jika Anda membutuhkan kendali penuh atas markup dan perilaku, atau jika formulir Anda terintegrasi dengan backend kustom. Juga berguna untuk formulir yang sangat sederhana (satu atau dua bidang) di mana sebuah widget atau plugin penuh terasa berlebihan.
Google Forms (Sematkan melalui iframe)
Gratis, cepat, dan tidak memerlukan keahlian teknis sama sekali. Buat formulir di forms.google.com, salin kode sematan, dan tempelkan ke dalam blok HTML Kustom.
Saat pilihan ini lebih tepat: survei internal, jajak pendapat singkat, atau situasi apa pun di mana Anda tidak peduli dengan integrasi visual pada situs Anda. Google Forms juga opsi termudah jika Anda sudah bekerja di Google Workspace dan ingin respons masuk secara otomatis ke Google Sheets.
Bandingkan Alatnya
Singkatnya: jika Anda menginginkan fitur formulir lanjutan tanpa beban plugin atau pemrograman, Elfsight mencakup semuanya. Jika Anda ingin semuanya berada dalam ekosistem WordPress dan tidak keberatan membayar fitur Pro, WPForms cukup kuat. Jika formulir Anda sederhana dan internal, Google Forms atau formulir HTML manual mungkin cukup untuk Anda.
| Fitur | Elfsight Form Builder | WPForms / CF7 | HTML Manual | Google Forms |
|---|---|---|---|---|
| Tanpa Coding | ✓ | ✓ (WPForms) / (CF7) ⚠ | x | ✓ |
| Formulir Langkah demi Langkah | ✓ | ✓ (WPForms Pro) | (manual build) | x |
| Logika Bersyarat | ✓ | ✓ (WPForms Pro) | (manual build) | Dasar ⚠ |
| Kustomisasi desain penuh | ✓ | ⚠ Tergantung tema | ✓ (CSS Manual) | x |
| Tidak perlu instalasi plugin | ✓ | x | ✓ | ✓ |
| Notifikasi email bawaan | ✓ | ✓ | Pengaturan manual | ✓ (melalui Sheets) |
| Popup / tata letak mengambang | ✓ | x (butuh add-on) | x | x |
| Berfungsi di luar WordPress | ✓ | x | ✓ | ✓ |
Tips Optimasi untuk Formulir WordPress Anda
Formulir Anda sudah aktif — sekarang pastikan ia benar-benar berfungsi. Kebanyakan kegagalan pengisian formulir disebabkan beberapa kesalahan yang bisa diperbaiki.
- Hilangkan setiap bidang yang tidak akan Anda gunakan. Jika tim Anda tidak akan menggunakan satu informasi dalam 48 jam, jangan memintanya. Anda selalu bisa mengumpulkan lebih banyak lagi di tindak lanjut.
- Gunakan multi-langkah untuk 6+ kolom. Bagi formulir yang lebih panjang menjadi beberapa langkah dengan bilah progres. Letakkan terlebih dahulu bidang-bidang yang mudah (nama, email) di langkah pertama — biaya yang sudah dikeluarkan membuat pengunjung tetap lanjut.
- <strong>Test on mobile before publishing.</strong> Check that dropdowns, date pickers, and the submit button all work on real phones. Most WordPress traffic is mobile.
- Match your theme’s design. Pull exact hex codes and font names from your WordPress theme and apply them in the editor. Two minutes of effort, noticeable difference in trust.
- Redirect ke halaman terima kasih. Ini memungkinkan pelacakan konversi berbasis tujuan di Google Analytics — sesuatu yang pesan sukses inline tidak bisa dilakukan dengan rapi.
- Review submissions weekly. Cari pola: di mana pengunjung berhenti di formulir multi-langkah, bidang mana yang mendapatkan respons berkualitas rendah, dan formulir mana yang memiliki volume terbanyak.
Pertanyaan yang Sering Diajukan
Bagaimana cara menambahkan formulir ke halaman di WordPress tanpa plugin?
Bisakah saya menambahkan formulir di WordPress yang bisa bekerja di ponsel?
Bagaimana cara menyematkan formulir di WordPress jika Anda menggunakan Elementor?
Mengapa saya tidak menerima notifikasi email dari pengiriman formulir?
Penutup
Anda sekarang memiliki semua yang Anda butuhkan untuk menambahkan formulir ke situs WordPress Anda — mulai dari penyematan empat langkah hingga panduan lengkap konfigurasi bidang, tata letak multi-langkah, notifikasi, dan desain. Yang lebih penting, Anda tahu keputusan mana yang penting di setiap langkah dan bagaimana mengonfigurasi untuk kasus penggunaan spesifik Anda, apakah itu formulir kontak sederhana atau pengisian proyek multi-langkah.
Jika Anda siap memulai, buka Elfsight Form Builder dan coba gratis. Pilih templat, konfigurasikan bidang Anda, dan miliki formulir yang berfungsi di halaman WordPress Anda dalam beberapa menit.
