Contact Form 7: Tutorial Lengkap, Kelebihan, Dan Kekurangan

Jika Anda memiliki sebuah website, menampilkan formulir kontak merupakan hal yang wajib dimiliki. Dengan menambahkan formulir, pengguna dapat dengan mudah menghubungi dan meningkatkan interaksi. Jika Anda menggunakan WordPress, Anda dapat dengan mudah menambahkan fitur formulir menggunakan plugin Contact Form 7.

Plugin Contact Form 7 adalah salah satu plugin yang paling banyak digunakan untuk menambahkan fitur formulir kontak ke WordPress. Selain gratis, plugin ini juga sangat fleksibel dan mudah digunakan.

Dalam artikel kali ini, saya akan membahas tentang fitur-fitur unggulan yang dimiliki oleh plugin ini, cara penggunaannya, serta kelebihan dan kekurangan yang harus Anda pertimbangkan sebelum menggunakannya. Yuk simak hingga selesai!

Apa itu Contact Form 7 

Contact Form 7 adalah salah-satu plugin WordPress gratis yang paling populer dan telah didownload lebih dari 5 juta kali. Plugin ini bisa Anda gunakan untuk membuat fitur formulir kontak di halaman website WordPress. Contact Form 7 sangat mudah digunakan dan bisa dikustomisasi untuk berbagai macam kebutuhan.

Selain membuat formulir kontak, Anda juga dapat menggunakan plugin ini untuk membuat formulir konfirmasi pembayaran, pendaftaran, hingga formulir untuk langganan email.

Fitur-fitur Contact Form 7

Berikut ini merupakan fitur yang akan Anda dapatkan menggunakan plugin Contact Form 7:

1. Membuat Banyak Form Contact: Anda dapat dengan mudah membuat formulir kontak untuk berbagai macam kebutuhan.
2. Mengirimkan data ke email: Plugin ini mengirim email yang dimasukkan oleh pengguna ke email admin dan email pengguna untuk verifikasi.
3. Kustomisasi form: Tersedia editor yang bisa Anda gunakan untuk mengkustomisasi formulir sesuai kebutuhan, seperti menambahkan atau menghapus kolom, mengubah ukuran, dan lainnya.
4. Kode Shortcode: Dengan menggunakan shortcode, Anda dapat menampilkan formulir kontak di berbagai lokasi, seperti halaman, widget, popup, dll..

Cara Penggunaan Contact Form 7

1. Instalasi Plugin Contact Form 7

Untuk instalasi plugin Contact Form 7 di WordPress, ikuti langkah-langkah berikut:

1. Dari halaman admin navigasi ke Plugins > Add New.
2. pada kolom pencarian ketikan “contact “.
3. Kemudian klik Install Now dan aktifkan Contact Form 7.

2. Membuat Formulir Baru

Setelah proses instalasi, saatnya kita membuat sebuah formulir baru. Untuk membuat formulir baru dengan Contact Form 7, ikuti langkah-langkah berikut:

1. Dari halaman admin, navigasi ke Contact > Add New.
2. Tuliskan judul fomulir

3. Buat kolom formulir dengan menggunakan template tag, pilih format kolom seperti text, email, URL dll.

Saat membuat kolom baru, Anda harus mengisi detail kolom sesuai yang dibutuhkan. Detail masing-masing opsi dapat Anda lihat seperti berikut:

• Field Type: Centang jika kolom wajib diisi.
• Name: Tulis nama kolom, nama kolom akan digunakan untuk menampilkan data yang diinput pengguna.
• Klik Insert Tag, untuk menambahkan kolom pada formulir.

Buat kolom dengan format seperti dibawah ini, tambahkan teks untuk menampilkan label kolom dan kode ‘<br>‘ setelahnya. Kode ‘<br>‘ digunakan sebagai pengganti enter untuk membuat baris baru.

4. Setelah layout kolom formulir selesai ditambahakan, klik Save untuk menyimpan perubahan.

3. Mengatur Format Email

Setelah membuat layout kolom formulir, sekarang saatnya mengatur format email yang akan dikirimkan ke admin ketika pengguna berhasil mengisi formulir di website. Email ini dapat digunakan sebagai notifikasi dan akan berisi semua data yang dikirim oleh pengguna.

Untuk mengatur format email di Contact Form 7, ikuti langkah-langkah berikut:

1. Klik tab Mail, pada bagian formulir
2. To: Masukan email admin yang valid untuk mendapatkan notifikasi jika ada pengguna yang mengisi formulir.
3. From: Masukan email pengirim, alamat email harus sesuai dengan domain yang sama dengan website yang sedang digunakan. Jika tidak, Anda akan mendapatkan kesalahan konfigurasi.
4. Subject: Tuliskan subjek pesan. Anda dapat menggunakan mail-tags pada bagian ini.
5. Additional headers: Anda dapat menyisipkan tambahan informasi, seperti Reply-To, Cc dan Bcc.
6. Message Body: Tuliskan pesan yang Anda kirimkan ke email. Anda dapat menggunakan mail-tags pada bagian ini.
7. Klik Save untuk menyimpan perubahan.

4. Mengatur Format Email (2)

Mail (2) adalah email tambahan yang bisa Anda gunakan sebagai autoresponder atau memberikan informasi ke pengguna, email telah diterima dan menunggu balasan admin. Email ini akan dikirim saat saat pengguna berhasil mengisi formulir.

Untuk mengatur format Mail (2) di Contact Form 7, ikuti langkah-langkah berikut:

1. Centang pilihan Use Mail (2)
2. To: Masukkan mail-tags sesuai formulir kolom email, misalnya [contact-mail]. Bagian ini adalah kolom email yang diisi oleh pengguna.
3. From: Masukan email pengirim, alamat email harus sesuai dengan domain yang sama dengan website yang sedang digunakan. Jika tidak, Anda akan mendapatkan kesalahan konfigurasi.
4. Subject: Tuliskan subjek pesan. Anda dapat menggunakan mail-tags pada bagian ini.
5. Additional headers: Anda dapat menyisipkan tambahan informasi, seperti Reply-To, Cc dan Bcc.
6. Message Body: Tuliskan pesan yang Anda kirimkan ke email. Anda dapat menggunakan mail-tags pada bagian ini.
7. Klik Save untuk menyimpan perubahan.

5. Menambahkan Form ke Halaman Website

Untuk menampilkan formulir pada sebuah halaman, ikuti langkah-langkah berikut:

1. Dari halaman admin, navigasi ke menu Pages > All Pages.
2. Pilih halaman yang ingin menampilkan formulir.
3. Klik tambahkan element, kemudian pada kolom pencarian ketikan “contact”
4. Pilih elemen Contact Form 7, pilih nama formulir yang telah dibuat sebelumnya.
5. Klik Publish atau Update untuk menyimpan perubahan.

Jika Anda telah menambahkan formulir dengan benar, Anda akan melihat tampilan seperti gambar berikut. Desain kolom formulir dapat bervariasi tergantung pada tema yang Anda gunakan.

Uji Coba Formulir Kontak

Setelah membuat formulir menggunakan Contact Form 7, sekarang saatnya melakukan uji coba untuk memastikan formulir yang dibuat berfungsi seperti yang diharapkan.

Beberapa poin yang perlu Anda lihat sebagai berikut:

1. Pastikan formulir memberikan informasi pesan telah terkirim
2. Pastikan Admin menerima email yang sesuai dengan data yang dimasukan pengguna
3. Pastikan pengguna menerima email verifikasi bahwa pesan yang dimasukan telah diterima oleh admin.

Mengatasi Email Tidak Terkirim di Contact Form 7

Jika pesan tidak terkirim dan muncul notifikasi “There was an error trying to send your message. Please try again later.“, hal ini biasanya terjadi karena hosting Anda telah membatasi WordPress untuk mengirim email.

Solusinya adalah dengan menggunakan metode SMTP. Lihat tutorial untuk mengatasi email tidak terkirim menggunakan SMTP.

Kekurangan dan Kelebihan Contact Form 7

Sebuah plugin pasti memiliki kelebihan dan kekurangan. Berikut daftar kelebihan dan kekurangan Contact Form 7 yang perlu Anda ketahui sebelum menggunakannya.

Kelebihan Contact Form 7

Kelebihan Contact Form 7 dapat Anda lihat seperti berikut:

• Gratis dan open source: Plugin Contact Form 7 bisa didownload dan digunakan secara gratis.
• Mudah digunakan: Contact Form 7 sangat mudah digunakan dan bisa dikustomisasi sesuai kebutuhan.
• Integrasi dengan email: Plugin ini mengirimakan data yang dimasukan pengguna ke email admin dan email pengguna.

Kekurangan Contact Form 7

Kekurangan Contact Form 7 dapat Anda lihat seperti berikut:

• Tidak memiliki editor drag and drop: Contact Form 7 hanya menyediakan formulir generator, yang mungkin perlu penyesuaian untuk menggunakannya.
• Kode tampilan Contact Form 7 akan dimuat di semua halaman website, meskipun halaman tersebut tidak menampilkan formulir kontak. Ini akan membuat halaman website Anda membutuhkan waktu pemuatan ekstra.

Addons Contact Form 7

Dengan Contact Form 7, Anda dapat menambahkan add-on dari pengembang pihak ketiga untuk menyediakan fungsi tambahan pada formulir. Berikut adalah beberapa add-on Contact Form 7 yang bisa Anda gunakan beserta fungsinya.

1. Void Contact Form 7 Widget for Elementor Page Builder : Widget Contact Form 7 untuk Elementor, memudahkan membuat layout form contact dengan Elementor.
2. Contact Form 7 – Dynamic Text Extension: Add-on Contact Form 7 untuk menambahkan teks atau nilai dinamis.
3. Redirection for Contact Form 7: Add-on Contact Form 7 yang memungkinkan Anda mengarahkan pengguna ke halaman atau URL tertentu setelah mengisi formulir kontak.
4. Conditional Fields for Contact Form 7: Add-on Contact Form 7 yang memungkinkan pengguna untuk mengatur kolom yang akan ditampilkan atau disembunyikan berdasarkan jawaban dari kolom lain.
5. Contact Form 7 Database addon: Add-on Contact Form 7 untuk menyimpan, melihat dan mengelola data yang dikirimkan pengguna ke dalam database.
6. Drag and Drop Multiple File Upload – Contact Form 7: Add-on Contact Form 7 untuk menambahkan kolom untuk mengupload file gambar, dokumen, audio, dan video dengan cara Drag and Drop. 
7. Honeypot for Contact Form 7: Add-on Contact Form 7 yang gunakan untuk mencegah spam dan serangan otomatis yang dikirim melalui form.
8. Ultimate Addons for Contact Form 7: Add-on Contact Form 7 multifungsi yang menawarkan semua fitur yang mungkin Anda butuhkan seperti redirect, conditional field, dinamic text dll.

Alternatif Contact Form 7 di WordPress

Berikut beberapa alternatif plugin Contact Form 7 yang bisa Anda gunakan untuk membuat fitur contact form di WordPress:

• WPForms
• Ninja Forms
• WeForm
• Forminator
• Formidable Form

Kesimpulan

Dengan banyaknya fitur yang ditawarkan, tidak mengherankan jika Contact Form 7 menjadi salah satu plugin formulir paling populer di WordPress. Plugin ini memberikan kemudahan penggunaan dan fleksibel membuat Contact Form 7 dapat digunakan untuk berbagai macam kebutuhan mulai dari formulir kontak sederhana hingga formulir survei.

Selain itu, dengan tersedianya banyak pilihan addon dari pihak ketiga, Contact Form 7 memudahkan Anda untuk menambahkan fungsi extra website WordPress dengan mudah.

Demikian artikel tentang membuat formulir menggunakan Contact Form 7. Jika Anda memiliki pertanyaan yang terkait tentang artikel ini, silakan tuliskan pesan di kolom komentar.