Pada artikel ini Anda akan mengetahui cara membuat formulir dengan Elementor gratis.
Padahal widget Formulir hanya tersedia di Elementor Pro, bukan berarti Anda tidak bisa menambahkan formulir dengan Elementor versi gratis.
Jika Anda ingin menyertakan formulir di halaman yang dibuat dengan Elementor versi gratis, ada dua metode yang akan kita bahas di artikel ini.
Elementor, dalam versi pro dan gratisnya, menawarkan dua widget yang memungkinkan Anda membuat formulir. Ini adalah widget HTML dan Kode Pendek. Widget HTML memungkinkan Anda menyematkan formulir menggunakan kode HTML, sedangkan widget Kode Pendek memungkinkan Anda menyematkan formulir dari plugin formulir menggunakan kode pendek, seperti Formulir Kontak 7.
Daftar isi
Buat Formulir dengan Elementor Versi Gratis Menggunakan Widget HTML dalam 7 Langkah
Membuat formulir dengan Elementor versi gratis sepenuhnya dimungkinkan, meskipun Anda tidak memiliki akses ke widget Formulir yang tersedia dalam versi Pro. Metode yang efektif adalah dengan menggunakan widget HTML, yang memungkinkan Anda menyematkan formulir menggunakan kode HTML.
Langkah 1: Buat halaman baru atau edit halaman yang sudah ada
Untuk memulai, buat halaman baru dan edit dengan Elementor (Halaman -> Tambah). Anda juga dapat mengedit halaman yang ada jika diinginkan.
Jika Anda memutuskan untuk membuat formulir di halaman baru, jangan lupa untuk mengonfigurasi tata letaknya dengan mengklik ikon roda gigi di atas halaman Anda.
Langkah 2: Siapkan kode HTML Formulir
Untuk memulai, Anda memerlukan kode HTML untuk formulir Anda. Jika Anda memiliki keterampilan HTML, Anda dapat menulis kodenya sendiri. Jika tidak, Anda bisa temukan banyak templat formulir HTML gratis secara online. Setelah kode HTML siap, salin dan lanjutkan ke langkah berikutnya.
Langkah 3: Tambahkan Bagian Baru di Elementor
Di editor Elementor Anda, mulailah dengan membuat bagian baru di halaman tempat Anda ingin menyisipkan formulir. Klik tombol “+” untuk menambahkan bagian.
Kemudian pilih tata letak yang paling sesuai dengan formulir Anda.
Langkah 4: Masukkan Widget HTML
Setelah menambahkan bagian tersebut, temukan widget “HTML” di panel widget di sebelah kiri. Seret dan lepas ke bagian yang Anda buat. Widget ini memungkinkan Anda memasukkan kode HTML langsung di halaman.
Langkah 5: Tempel Kode HTML Formulir
Setelah widget HTML terpasang, klik tab "Konten" widget di panel kiri. Tempelkan kode HTML formulir Anda di bidang yang disediakan untuk tujuan ini. Formulir akan langsung muncul di halaman.
Langkah 6: Sesuaikan dan Gaya Formulir
Formulir yang Anda integrasikan secara otomatis akan mengambil gaya dasar Anda tema WordPress. Namun, jika Anda ingin menyesuaikannya lebih lanjut, Anda dapat menambahkan CSS khusus untuk menyesuaikan warna, margin, font, dan lainnya. Untuk ini, Anda harus memiliki pengetahuan tentang CSS atau menyewa pengembang jika perlu.
Langkah 7: Pratinjau dan Publikasikan
Setelah formulir Anda terintegrasi dan ditata, luangkan waktu untuk melihat pratinjau halaman untuk memastikan semuanya ditampilkan dengan benar. Uji formulir untuk memverifikasi bahwa formulir berfungsi seperti yang diharapkan. Jika Anda puas dengan hasilnya, publikasikan halaman tersebut.
Lihat juga: Cara Menggunakan Widget/Templat Elementor sebagai Blok Gutenberg
Satu hal penting yang perlu diperhatikan: Jika formulir HTML Anda menggunakan CSS eksternal, gambar, atau JavaScript untuk penataan gaya, pastikan untuk mengunggah folder yang berisi file CSS, gambar, dan JavaScript ke direktori root situs web Anda.
Jadi, menggunakan widget HTML untuk membuat formulir di Elementor versi gratis adalah solusi sederhana dan fleksibel. Meskipun ini memerlukan lebih banyak pekerjaan dibandingkan dengan widget Formulir yang tersedia dalam versi Pro, ini adalah metode yang efektif untuk menambahkan formulir fungsional ke situs Anda tanpa biaya tambahan.
Dengan menggabungkan kemampuan Elementor dengan sedikit kode HTML, Anda dapat membuat formulir yang disesuaikan dengan kebutuhan Anda dengan tetap menjaga konsistensi visual situs Anda.
Buat formulir Elementor gratis menggunakan formulir kontak 7 dalam 7 langkah
Membuat formulir dengan Elementor versi gratis dapat dilakukan dengan mudah menggunakan plugin Formulir Kontak 7 yang populer. Plugin ini menawarkan metode sederhana dan efektif untuk menyematkan formulir ke halaman Elementor Anda tanpa memerlukan pengetahuan pengkodean apa pun.
Ada banyak plugin formulir lainnya, tapi kami merekomendasikannya Formulir Kontak 7 karena ini adalah plugin formulir paling populer untuk WordPress, dan sepenuhnya gratis.
Langkah 1: Instal dan aktifkan Formulir Kontak 7
Untuk memulai, Anda perlu menginstal dan mengaktifkan plugin Formulir Kontak 7 di situs WordPress Anda. Akses dashboard WordPress Anda, buka Ekstensi> Tambahkan, lalu cari “Formulir Kontak 7”. Setelah plugin ditemukan, klik install sekarangdan kemudian mengaktifkan une fois l'installation terminée.
Langkah 2: Buat Formulir baru
Setelah plugin diaktifkan, Anda dapat membuat formulir. Untuk melakukan ini, buka Kontak > Tambah baru di dasbor WordPress Anda. Beri nama pada formulir Anda agar mudah dikenali nanti.
Secara default, Formulir Kontak 7 menawarkan Anda a formulir kontak Dasar termasuk bidang untuk nama, email, subjek, dan pesan. Anda dapat menggunakan formulir ini apa adanya atau menyesuaikan bidang sesuai kebutuhan Anda.
Jika Anda ingin menambahkan bidang baru, tempatkan penunjuk di area tempat Anda ingin menambahkan bidang baru (Anda dapat menempatkannya di bawah atau di atas bidang yang sudah ada). Tambahkan label untuk bidang formulir baru dalam format <label> votre label préféré </label>.
Tempatkan penunjuk Anda tepat setelah label bidang yang ingin Anda ubah atau setelah bidang terakhir yang ada. Selanjutnya, pilih jenis bidang yang ingin Anda tambahkan dari tab Juara. Untuk meningkatkan keterbacaan dan pengorganisasian formulir, Anda bisa menyisipkan jeda baris setelah setiap bidang baru, yang akan membuat formulir lebih jelas dan selaras dengan bidang lain yang sudah ada.
Isi kolom dan klik Masukkan tag (Anda dapat membiarkan semuanya sebagai default).
Formulir Kontak 7 akan mengirimkan kiriman yang dikirimkan melalui formulir Anda ke email. Anda dapat mengatur email dari tab E-mail.
Anda dapat pergi ke tab Pesan jika Anda ingin mengganti pesan default. Anda dapat menyesuaikan pesan yang muncul setelah pengunjung Anda berhasil mengirimkan formulir atau pesan kesalahan saat formulir tidak dikirimkan, dll.
Klik pada tombol Register setelah Anda selesai mengedit formulir.
Langkah 3: Sesuaikan Formulir
Jika Anda ingin mengubah atau menambahkan kolom tambahan ke formulir Anda, Anda bisa melakukannya langsung di antarmuka Formulir Kontak 7. Anda bisa menambahkan kolom untuk nomor telepon, kotak centang, atau tipe data lainnya termasuk yang Anda perlukan. Setelah Anda selesai melakukan perubahan, simpan formulir.
Baca panduan kami di: Bagaimana untuk menyesuaikan bentuk Formulir Kontak 7
Langkah 4: Dapatkan Kode Pendek Formulir
Setelah membuat dan menyesuaikan formulir Anda, Formulir Kontak 7 akan memberi Anda kode pendek unik. Kode pendek ini penting untuk mengintegrasikan formulir ke halaman Elementor. Cukup salin kode pendek yang ditemukan di bawah nama formulir.
Langkah 5: Sematkan Formulir di Elementor
Sekarang Anda memiliki kode pendek, buka halaman tempat Anda ingin menambahkan formulir menggunakan editor Elementor. Tambahkan bagian baru atau pilih bagian yang sudah ada tempat formulir akan muncul.
Temukan widget “Shortcode” di panel widget Elementor, lalu seret ke bagian yang dipilih. Tempelkan kode pendek yang Anda salin sebelumnya ke kolom yang disediakan untuk tujuan ini.
Langkah 6: Sesuaikan dan beri gaya pada Formulir
Formulir Formulir Kontak 7 yang terintegrasi ke dalam Elementor akan mengikuti gaya Anda tema WordPress. Jika ingin lebih menyesuaikan tampilan form, hal ini dapat dilakukan dengan menambahkan CSS khusus. Anda dapat mengubah warna, margin, tipografi, dan lainnya untuk menyesuaikan formulir dengan tampilan situs Anda secara keseluruhan.
Baca juga: Cara Menonaktifkan Popup Elementor di Ponsel Cerdas
Langkah 7: Uji dan Rilis
Sebelum memublikasikan halaman Anda, pastikan untuk melihat pratinjau formulir untuk memverifikasi bahwa formulir berfungsi dengan benar. Kirim pesan percobaan untuk memastikan semua fitur berfungsi. Setelah puas, publikasikan halaman agar formulir dapat diakses oleh pengunjung Anda.
Jadi ! Menggunakan Formulir Kontak 7 dengan Elementor gratis, Anda dapat dengan mudah membuat formulir fungsional tanpa mengeluarkan uang sepeser pun. Metode ini ideal bagi pengguna yang menginginkan fungsionalitas dasar namun efektif, namun tetap menjaga fleksibilitas untuk menyesuaikan formulir mereka.
Formulir Kontak 7, dikombinasikan dengan Elementor, memberi Anda solusi tangguh untuk menangkap informasi penting dari pengunjung Anda.
Jika Anda ingin penyesuaian yang lebih mudah, Anda dapat membaca artikel tentang caranya sesuaikan formulir Formulir Kontak 7 menggunakan Addons dan Elementor Penting.
FAQ: Cara membuat formulir dengan Elementor versi gratis
Bisakah saya membuat formulir dengan Elementor versi gratis?
Ya, Anda dapat membuat formulir dengan Elementor versi gratis menggunakan widget HTML atau Kode Pendek. Meskipun widget Formulir disediakan untuk versi Pro, ada alternatif gratis yang efektif.
Apa saja cara membuat formulir di Elementor gratis?
Anda dapat menggunakan widget HTML untuk menyematkan formulir HTML secara langsung atau widget Kode Pendek untuk menyematkan formulir yang dibuat dengan plugin seperti Formulir Kontak 7.
Bagaimana cara menambahkan formulir HTML ke halaman Elementor?
Gunakan widget HTML di Elementor untuk memasukkan kode HTML untuk formulir Anda. Anda dapat menempelkan kode langsung ke kolom konten widget.
Apakah saya perlu mengetahui HTML untuk membuat formulir dengan Elementor gratis?
Meskipun membantu, Anda tidak memerlukan keahlian HTML jika Anda menggunakan plugin formulir seperti Formulir Kontak 7, yang menghasilkan kode pendek yang mudah disematkan.
Bagaimana cara menata formulir yang dibuat dengan Elementor gratis?
Jika Anda menggunakan formulir HTML, Anda harus menggunakan CSS untuk menatanya. Formulir yang dihasilkan oleh plugin seperti Formulir Kontak 7 mewarisi gaya Anda tema WordPress, namun Anda juga dapat menyesuaikan gayanya dengan CSS.
Apakah ada plugin gratis untuk membuat formulir dengan Elementor?
Ya, plugin seperti Contact Form 7, WPForms Lite, dan Ninja Forms adalah opsi gratis populer untuk membuat formulir yang dapat Anda sematkan di Elementor.
Bagaimana cara mengintegrasikan formulir Formulir Kontak 7 ke halaman Elementor?
Buat formulir Anda di Formulir Kontak 7, lalu salin kode pendek yang dihasilkan. Gunakan widget Kode Pendek Elementor untuk menyematkan formulir ini di halaman Anda.
Apa batasan Elementor versi gratis untuk membuat formulir?
Versi gratis Elementor tidak menawarkan widget Formulir khusus. Untuk membuat formulir, Anda perlu menggunakan solusi seperti HTML, Shortcode, atau plugin eksternal.
Bagaimana cara menguji formulir yang saya buat dengan Elementor?
Setelah menyematkan formulir Anda di halaman, pratinjau halaman dengan Elementor dan kirimkan tes untuk memastikan formulir berfungsi dengan benar.
Apakah mungkin menggunakan formulir lanjutan dengan Elementor versi gratis?
Untuk fitur lanjutan, seperti bidang bersyarat atau formulir multi-langkah, disarankan untuk meningkatkan ke Elementor versi Pro atau menggunakan plugin formulir dengan fitur lanjutan di versi gratisnya.
Sumber daya terkait lainnya
- Bagaimana mengintegrasikan ActiveCampaign dengan Elementor
- Bagaimana mengintegrasikan AWeber dengan Elementor
- Elementor : Bagaimana cara menambahkan animasi Lottie
- Elementor : Cara membuat pelacak kemajuan vertikalDapatkan Elementor Pro Sekarang!!!
Kesimpulan
Jadi ! Itu saja untuk artikel ini yang menunjukkan kepada Anda cara membuat formulir dengan Elementor versi gratis. Jika Anda mempunyai kekhawatiran tentang cara menuju ke sana, beri tahu kami di komentar.
Namun, Anda juga bisa berkonsultasi sumber daya kita, jika Anda memerlukan lebih banyak elemen untuk melaksanakan proyek pembuatan situs Internet Anda, dengan membaca panduan kami di Pembuatan blog WordPress atau yang di Divi: tema WordPress terbaik sepanjang masa.
Namun sementara itu, bagikan artikel ini di berbagai jejaring sosial Anda.
...
