Begini dampaknya jika opsi kontak di WordPress Anda tidak jelas atau sulit ditemukan: prospek potensial tidak bisa dengan mudah menghubungi Anda, mereka meninggalkan situs Anda, pesaing Anda mengonversi mereka. Kepercayaan menurun ketika prospek merasa hambatan. Waktu respons melambat karena pertanyaan terbenam dalam kekacauan email. Tim Anda menghabiskan berjam-jam mencari pesan pelanggan alih-alih menutup kesepakatan.
Widget Form Kontak memberi solusi praktis dan fleksibel. Ia mengkualifikasi leads, menangkap niat spesifik, dan terintegrasi dengan ekosistem penjualan Anda secara menyeluruh tanpa coding – semua ini sambil memastikan desain situs Anda selaras sempurna. Ketika prospek mengisi formulir, Anda segera memahami apa yang mereka butuhkan, mengkualifikasi tingkat anggaran mereka, dan mengarahkan mereka ke anggota tim yang tepat.
- Pengaturan cepat dalam 4 menit untuk menambahkan formulir kontak profesional tanpa coding.
- Integrasi alternatif khusus WordPress untuk menambahkan formulir kontak ke WordPress.
- Teknik optimasi widget untuk memaksimalkan formulir kontak Anda.
- Saran pemecahan masalah untuk mengatasi masalah umum pengaturan dan tampilan.
Menambahkan formulir kontak ke WordPress tidak memerlukan keahlian teknis atau plugin mahal. Di bawah ini adalah panduan implementasi cepat 4 langkah yang bisa Anda selesaikan dalam beberapa menit, diikuti dengan panduan rinci bagi tim yang ingin membangun solusi kustom.
Cara Menambahkan Formulir Kontak ke WordPress: Panduan Singkat
Berikut panduan cepat untuk menyematkan Formulir Kontak di situs WordPress Anda:
- Buka Elfsight’s editor dan pilih template.
- Sesuaikan widget Formulir Kontak Anda.
- Klik ‘Tambahkan ke situs web secara gratis’ dan salin kodenya.
- Tempelkan ke backend situs WordPress Anda.
Buat dan lihat pratinjau formulir kontak WordPress Anda secara langsung di editor kami!
Fitur Formulir Kontak yang Memperlancar Komunikasi
Anda telah melihat betapa cepatnya setup dasar. Sekarang mari kita jelajahi fitur-fitur kunci yang mengubah formulir sederhana menjadi aset penghasil prospek – dan mengapa masing-masing penting bagi bisnis Anda.
| Fitur Utama | Mengapa Ini Penting |
|---|---|
| Lebih dari 20 tipe field dengan urutan kustom dan bidang yang wajib diisi | Buat formulir kontak, umpan balik, atau permintaan untuk mengumpulkan detail yang Anda butuhkan secara tepat. |
| Tiga tata letak responsif dengan kolom yang fleksibel | Sesuaikan formulir Anda agar pas di area halaman mana pun, baik dalam kotak, mengambang, maupun gaya default. |
| Perlindungan Spam Tingkat Lanjut dan Pengiriman yang Andal | Jaga kotak masuk Anda tetap rapi dengan reCAPTCHA dan pastikan setiap pesan sampai ke Anda dengan aman. |
| Integrasi dengan Google Sheets, Mailchimp, dan Zapier | Sinkronkan data formulir secara otomatis untuk manajemen prospek yang mudah, kampanye email, dan alur kerja otomatis. |
| Kustomisasi gaya waktu nyata dengan pewarna satu-klik | Sesuaikan formulir Anda dengan merek Anda dalam sekejap, sehingga selalu terasa seperti bagian alami dari situs Anda. |
Untuk daftar lengkap fitur dan kemampuan integrasi, jelajahi Halaman Fitur formulir kontak Halaman Fitur.
Panduan Langkah-demi-Langkah Menambahkan Formulir Kontak Elfsight di WordPress
Dengan kemampuan ini, mari kita bahas setiap langkah pengaturan agar formulir bisa menyesuaikan dengan tujuan menghasilkan prospek Anda secara tepat.
1. Pilih templat
Saat Anda membuka editor widget Formulir Kontak, langkah pertama adalah memilih templat. Template menentukan tata letak awal dan tujuan formulir kontak Anda — apakah itu formulir kontak standar, formulir pengumpulan email, formulir permintaan dukungan, atau formulir callback.
Pilih tata letak yang paling cocok dengan tujuan komunikasi Anda dan klik “Lanjutkan dengan template ini” untuk melanjutkan ke langkah berikutnya.
2. Bangun Bidang Formulir Anda
Di tab Buat Formulir, Anda bisa menyesuaikan bidang yang akan muncul di formulir kontak Anda. Formulir Kontak Elfsight mendukung 15+ jenis bidang, memungkinkan Anda mengumpulkan informasi yang tepat yang Anda butuhkan tanpa membebani pengunjung:
- Bidang Teks – Input teks satu baris dan multi-baris
- Email & Phone – Input pra-isi untuk informasi kontak
- Dropdown & Pemilih – Pilihan ganda, tombol radio, kotak centang, dan pilihan gambar
- Pemilih Tanggal & Waktu – Kalender untuk penjadwalan atau informasi acara
- Unggah Berkas – Izinkan pengunjung melampirkan berkas hingga 100 MB
- Pemisah & Judul – Atur bagian formulir untuk kejelasan
Untuk setiap bidang yang Anda tambahkan, Anda bisa menyesuaikan labelnya, menambahkan teks placeholder yang membantu (seperti contoh apa yang perlu dimasukkan), tandai bidang sebagai wajib dengan mengaktifkan opsi “Wajib Diisi” — yang akan menampilkan tanda asteriks (*) di samping nama bidang, dan mengaktifkan Logika Kondisional untuk mengontrol visibilitas bidang.
Susun field-field Anda dalam urutan yang masuk akal sesuai alur kerja dengan menyeretnya ke posisi. Anda juga bisa menambahkan pemisah untuk mengelompokkan field terkait secara visual, sehingga formulir lebih mudah dipindai dan ramah pengguna.
3. Mengatur Notifikasi Email
Buka tab Surel untuk mengatur ke mana kiriman formulir harus dikirim dan bagaimana pengunjung Anda akan diberitahu:
- Beritahu Saya – Masukkan alamat email tempat Anda ingin menerima kiriman formulir. Anda bisa menambahkan beberapa alamat email untuk memberi tahu seluruh tim Anda.
- Notifikasi Responden – Aktifkan email konfirmasi otomatis yang dikirim kepada pengunjung setelah mereka mengisi formulir.
- Pengaturan Pengirim Surel – Sesuaikan detail pengirim dan perilaku pengiriman untuk komunikasi yang profesional.
4. Atur Tata Letak
Pindah ke tab Layout untuk menentukan bagaimana formulir Anda akan ditampilkan di situs Anda:
- Layout Inline – Formulir muncul langsung dalam konten halaman Anda. Sempurna untuk halaman kontak khusus atau halaman arahan.
- Tata Letak Panel Mengambang – Formulir meluncur dari tepi layar, tetap terlihat saat pengguna menggulir. Ideal untuk menarik perhatian tanpa mengganggu alur halaman.
- Lebar Formulir – Sesuaikan lebar (100px hingga 1200px) atau aktifkan Lebar Penuh untuk merentangkan ke seluruh kontainer.
- Tata Letak Bidang – Pilih antara tata letak bidang vertikal atau horizontal sesuai preferensi desain Anda.
5. Sesuaikan Tampilan
Di tab Tampilan, sesuaikan formulir dengan merek dan sistem desain situs web Anda. Anda dapat menyesuaikan:
- Skema Warna – Pilih terang, gelap, atau palet warna kustom
- Warna Aksen – Tetapkan warna utama untuk tombol, tautan, dan elemen yang aktif
- Jenis Huruf & Tipografi – Pilih keluarga huruf dan ukuran untuk judul dan teks isi
- Latar Belakang & Bingkai – Sesuaikan latar belakang formulir dan bidang-bidangnya
- Gaya Tombol – Sesuaikan tampilan tombol kirim dan keadaan hover-nya
Jika Anda memiliki pedoman merek spesifik atau membutuhkan gaya yang presisi per-piksel, Elfsight juga mendukung CSS Kustom untuk kustomisasi tingkat lanjut.
6. Tetapkan Tindakan & Pengaturan Pasca Pengiriman
Buka tab Pengaturan untuk menentukan apa yang terjadi setelah pengunjung mengirimkan formulir Anda dan menyesuaikan preferensi bahasa:
- Tindakan Pasca-Kirim – Pilih menampilkan pesan terima kasih, mengarahkan ke halaman tertentu, atau menyembunyikan formulir setelah pengiriman.
- Proteksi Spam – Aktifkan reCAPTCHA untuk mencegah pengiriman otomatis dan melindungi kotak masuk Anda dari spam bot.
- Bahasa – Pilih bahasa untuk label formulir dan elemen antarmuka dari menu dropdown.
- Opsi Lanjutan – Aktifkan parameter pra-isi atau tambahkan JavaScript Kustom untuk fungsionalitas tambahan.
7. Sambungkan Integrasi
Di tab Integrations, Anda bisa menghubungkan formulir kontak Anda dengan layanan eksternal untuk mengotomatiskan alur kerja Anda dan mengkonsolidasikan data prospek. Integrasi yang didukung meliputi:
- Google Sheets – Secara otomatis menyimpan semua pengiriman formulir ke spreadsheet untuk pemantauan dan analisis yang mudah.
- Mailchimp – Tambahkan responden formulir langsung ke daftar pemasaran email Anda
- Zapier – Connect to 3,000+ apps to automate actions like creating CRM records, sending Slack notifications, or scheduling follow-up tasks
8. Dapatkan Kode Instalasi
Setelah formulir Anda sepenuhnya dikonfigurasi, klik “Tambahkan ke Situs Web” (atau “Simpan” jika Anda sudah memiliki akun Elfsight) — sebuah pop-up akan menampilkan skrip pemasangan unik Anda. Salin seluruh cuplikan kode ini; Anda akan menggunakannya untuk menempatkan widget di situs Anda.
Jika Anda ingin lebih banyak opsi atau perlu menampilkan formulir kontak di lokasi yang berbeda, bagian berikutnya akan menjelajahi cara alternatif mengintegrasikan widget Elfsight ke situs WordPress Anda.
Alternatif Formulir Kontak WordPress
Ada beberapa cara resmi untuk menambahkan Formulir Kontak ke situs WordPress Anda, tetapi masing-masing memiliki beberapa kompromi yang jelas dibandingkan menggunakan Elfsight.
Menggunakan Form Kontak Editor Blok WordPress
Editor Blok WordPress (Gutenberg) mencakup blok formulir kontak bawaan untuk pertanyaan sederhana.
- Akses Editor. Buka dasbor WordPress Anda dan sunting halaman atau posting yang diinginkan.
- Tambahkan Blok Formulir. Klik ikon “+” dan pilih blok “Formulir” atau “Formulir Kontak”.
- Atur Bidang Formulir. Sesuaikan bidang seperti Nama, Email, dan Pesan sesuai kebutuhan Anda.
- Sesuaikan Pengaturan. Atur preferensi pemberitahuan dan kelola kiriman formulir.
- Publikasikan Perubahan. Perbarui atau publikasikan halaman Anda agar formulir menjadi aktif.
Detail lebih lanjut tersedia di halaman dokumentasi WordPress Block Editor.
Menginstal Plugin Contact Form 7
Contact Form 7 is WordPress’s oldest and most widely used free contact form plugin.
- Instal Plugin. Pergi ke Plugins, cari “Contact Form 7,” dan pasang.
- Aktifkan Plugin. Klik “Aktifkan” untuk mengaktifkan Contact Form 7.
- Buat Formulir Baru. Buka menu Kontak dan klik “Tambahkan Baru.”
- Ubah Bidang Form – Sesuaikan bidang menggunakan shortcode atau HTML dasar.
- Sematkan Formulir. Tempelkan shortcode yang disediakan ke halaman atau pos Anda.
Detail lebih lanjut tersedia di situs dokumentasi Contact Form 7.
Mengatur Plugin WPForms
WPForms adalah pembuat formulir drag-and-drop yang populer, tersedia di perpustakaan plugin WordPress.
- Pasang Plugin WPForms. Cari “WPForms” di Plugins dan pasang.
- Aktifkan WPForms. Aktifkan plugin untuk mulai membuat formulir.
- Buat Formulir. Gunakan pembuat drag-and-drop untuk menambahkan dan menyusun bidang.
- Atur Pengaturan. Sesuaikan pemberitahuan, konfirmasi, dan perlindungan spam.
- Sisipkan Formulir – Sematkan formulir menggunakan shortcode-nya atau blok.
Rincian lebih lanjut tersedia dalam dokumentasi plugin WPForms.
Bagaimana Perbandingan Metode-Metode Ini dalam Menambahkan Formulir Kontak?
| Metode | Pro Utama 👍 | Kendala Utama 👎 |
|---|---|---|
| Widget Elfsight | Penyiapan cepat dengan template yang fleksibel dan integrasi mendalam. | Rencana gratis menyertakan tautan branding dan memiliki batas tampilan. |
| Formulir Kontak Editor Blok | Langsung tersedia di editor WordPress, tidak perlu instalasi. | Kustomisasi dan integrasi sangat terbatas. |
| Contact Form 7 | Gratis dan andal, banyak dipakai oleh pengguna WordPress. | Penataan gaya dan pengaturan memerlukan pekerjaan manual dan sedikit HTML. |
| WPForms | Pembuat formulir drag-and-drop yang intuitif untuk pengaturan yang mudah. | Fitur-fitur terpenting dan integrasi yang paling berguna memerlukan upgrade berbayar. |
Jika Anda ingin tips praktis agar formulir kontak Anda bekerja secara mulus dan tampak profesional di situs WordPress Anda, lanjutkan membaca untuk saran praktis berikutnya.
📝 Daftar Periksa Praktis untuk Widget Form Kontak
- Petakan alur pertanyaan Anda sebelum menambahkan bidang. Tentukan informasi apa yang benar-benar Anda perlukan untuk menangani permintaan atau mengarahkan prospek, lalu pilih tipe bidang yang paling relevan dan urutan yang tepat untuk formulir Anda.
- Gunakan bidang wajib dengan bijak. Tandai hanya bidang yang benar-benar penting sebagai wajib, sehingga pengunjung tidak mudah meninggalkan formulir di tengah proses.
- Pilih tata letak yang tepat untuk halaman Anda. Uji tata letak Default, Boxed, dan Floating dalam pratinjau untuk melihat mana yang paling pas tanpa membuat konten sesak atau mengalihkan perhatian dari pesan utama Anda.
- Sesuaikan kolom untuk keterbacaan. Untuk formulir singkat, satu kolom biasanya paling cocok di ponsel. Untuk formulir lebih panjang, gunakan dua kolom di desktop agar pengguliran berkurang dan tampilannya tetap rapi.
- Aktifkan Google reCAPTCHA untuk mengurangi spam. Aktifkan perlindungan spam tingkat lanjut segera setelah Anda memublikasikannya, agar tidak membuang waktu lagi untuk menyaring kiriman sampah.
- Tautkan dengan Google Sheets atau Mailchimp jika Anda perlu tindak lanjut. Integrasikan dengan platform pilihan Anda untuk mengotomatiskan pelacakan prospek atau menambahkan kontak baru ke kampanye tanpa langkah manual tambahan.
- Sempurnakan desain agar selaras dengan merek Anda. Gunakan pemilih warna satu-klik, ikon, dan bilah progres untuk menciptakan pengalaman yang mulus dan konsisten dengan merek Anda yang membangun kepercayaan.
- Uji Autoresponder dan Pesan Keberhasilan. Personalisasikan konfirmasi Anda sehingga pengguna tahu pesan mereka telah terkirim dan memahami apa yang diharapkan berikutnya.
- Salin dan sematkan kode widget dari dasbor Anda setelah setiap perubahan. Pastikan Anda menempelkan kode terbaru ke situs web Anda sehingga pembaruan langsung terlihat bagi pengunjung.
Berikut contoh nyata bagaimana sebuah bisnis menambahkan widget Formulir Kontak untuk meningkatkan keterlibatan pelanggan dan mempermudah manajemen prospek.
Formulir Kontak yang Menghasilkan Hasil Nyata
Let’s Go Peak District, sebuah situs pariwisata yang menampilkan destinasi, pengalaman, dan akomodasi terbaik di Peak District, Inggris, menghadapi masalah umum: formulir kontak mereka yang generik tidak efektif menangkap pertanyaan, dan mereka memiliki kendali terbatas atas tampilannya serta bagaimana fungsinya.
Sebelum Elfsight
Tim menghadapi beberapa tantangan:
- Formulir Kontak bawaan tidak sesuai dengan estetika situs web Anda.
- Direktori layanan mandiri tidak memiliki opsi SEO yang memadai dan kontrol konten.
- Panel kontrol pengguna terasa berat dan tidak ramah bagi calon pelanggan.
- Penyesuaian kustom pada formulir bawaan sering rusak setelah pembaruan platform.
Solusi: Mengimplementasikan Elfsight Contact Form
Phil mengintegrasikan widget Formulir Kontak Elfsight di seluruh situs pariwisata miliknya dan menggabungkannya dengan alat Elfsight lainnya untuk menciptakan pengalaman pengguna yang komprehensif. Berikut cara dia menggunakannya:
“Kami telah banyak menggunakan Formulir Kontak, dan kami menjual widget Ulasan atau Umpan Instagram sebagai upsell atau dengan paket listing kami yang lebih tinggi. Ini bekerja sangat, sangat baik.”
Phil Sproson, pendiri Let’s Go Peak District
Phil menempatkan Formulir Kontak Elfsight secara strategis di halaman kontaknya dan berdampingan dengan penawaran pariwisata utama seperti:
- Daftar akomodasi (untuk permintaan pemesanan)
- Halaman pengalaman dan aktivitas (untuk pertanyaan acara)
- Halaman Harga (untuk informasi paket)
Penampilan profesional formulir dan fungsionalitas yang mulus memberi pengunjung kepercayaan bahwa pesan mereka akan ditanggapi dengan serius dan segera.
Hasil Nyata
Setelah menerapkan Elfsight Formulir Kontak:
- Peningkatan volume permintaan: Pengunjung yang sebelumnya ragu untuk menghubungi mereka kini mengajukan pertanyaan dengan percaya diri.
- Kualitas prospek yang lebih baik: Formulir ini menangkap informasi spesifik tentang apa yang menarik minat pengunjung (akomodasi, makanan, pengalaman, dll.)
- Beban dukungan berkurang: Tidak ada lagi formulir yang rusak setelah pembaruan platform — widget tetap andal.
- Keberhasilan Upselling: Bisnis pariwisata yang menggunakan platform ini kini beralih ke paket premium yang mencakup widget Elfsight seperti tampilan ulasan dan feed Instagram.
- Pengalaman pengguna yang lebih baik: Desain formulir yang modern dan responsif mendorong penyelesaian pada perangkat seluler
Gambaran Besar: Strategi Multi-Widget
Kisah sukses Phil tidak hanya pada formulir kontak. Ia memanfaatkan beberapa widget Elfsight yang bekerja bersama: Instagram Feed untuk menampilkan foto Peak District yang menakjubkan untuk menginspirasi para pelancong, All-in-One Reviews – untuk menampilkan testimoni dari pengunjung yang puas, serta Event Calendar, Store Locator dan Pricing Table widgets.
Dengan menggabungkan alat-alat ini, Let’s Go Peak District beralih dari direktori statis menjadi platform interaktif yang dinikmati pengunjung dan menarik bagi bisnis pariwisata untuk beriklan di dalamnya.
Terlepas dari Anda menjalankan situs pariwisata, toko e-commerce, atau bisnis berbasis layanan, pelajarannya jelas: formulir kontak yang dirancang dengan matang, yang menangkap informasi yang tepat, terlihat profesional, dan berjalan andal adalah investasi untuk pertumbuhan bisnis Anda.
Masalah Formulir Kontak & Solusi
Menambahkan formulir kontak ke situs WordPress umumnya mudah, tetapi banyak pengguna menghadapi kendala pada visibilitas widget, pengiriman email, dan kompatibilitas. Berikut adalah masalah yang paling umum dan cara mengatasinya:
Mengapa formulir kontak saya gagal mengirim email notifikasi?
Mengapa formulir kontak saya tidak terlihat atau hilang di halaman tertentu?
Bagaimana cara menangani spam atau kiriman palsu melalui formulir kontak saya?
Apa yang bisa saya lakukan jika formulir kontak saya menunjukkan kesalahan validasi meskipun bidang telah diisi?
Apakah mengganti tema akan memengaruhi widget Formulir Kontak saya?
Jika formulir kontak Anda masih tidak bekerja setelah mencoba langkah-langkah ini, Anda akan menemukan tautan dukungan Elfsight yang berguna serta panduan pemecahan masalah di bawah ini.
Butuh Detail Lebih Lanjut?
Kami berharap panduan ini memberi Anda titik awal yang kokoh untuk menambahkan formulir kontak ke situs WordPress Anda. Jika Anda menemukan masalah atau memiliki ide untuk dibagikan, kami di sini untuk membantu. Beri tahu kami pendapat atau pertanyaan Anda, dan tetap terhubung dengan tim Elfsight melalui X, Facebook, dan LinkedIn untuk pembaruan dan tips lebih lanjut.


