Buat dan Sematkan Formulir Pendaftaran

Published: 16 Juli 2026 · Last updated: 21 Juli 2026 · By Marcus Biel

Formulir Tersemat ditempatkan langsung di dalam halaman yang sudah ada di situs web Anda. Formulir ini tetap menjadi bagian dari konten di sekitarnya, bukan muncul di atasnya.

Formulir Tersemat cocok digunakan dalam artikel blog, halaman landing di situs web Anda sendiri, bagian buletin, sidebar, dan footer. Lokasi tempat Anda menambahkan kode formulir menentukan lokasi kemunculan formulir.

Panduan ini membahas langkah-langkah yang khusus untuk Formulir Tersemat. Fungsi pengeditan visual umum dijelaskan dalam panduan Pembuat Formulir Pendaftaran.

Membuat Formulir Tersemat

Buka “Signup Forms”, klik “Create Form”, lalu pilih “Embedded Form”. Masukkan nama internal yang jelas dan lanjutkan ke pembuat.

Anda juga dapat mengedit formulir yang sudah ada dengan mengeklik namanya di Ringkasan Signup Forms.

Nama internal tidak otomatis ditampilkan kepada pengunjung. Beri nama formulir berdasarkan lokasi atau tujuannya, misalnya “Homepage Newsletter”, “Blog Footer”, atau “Product Updates”.

Memilih Desain Awal

Formulir Tersemat menyediakan formulir kosong, formulir standar, dan empat templat desain:

• Calm note
• Coupon strip
• Dark editorial
• Minimal blue

Pilih desain yang paling sesuai dengan ruang dan nuansa situs web tempat formulir akan ditampilkan. Setiap desain awal dapat diubah sepenuhnya setelah dipilih.

Mendesain Formulir Tersemat

Gunakan “Layout” dan “Content” untuk mengatur formulir. Formulir Tersemat dapat berisi formulir pendaftaran beserta teks pendukung, gambar, daftar, tombol, tautan sosial, penghitung subscriber, spasi, atau pemisah.

Untuk sidebar atau footer yang sempit, desain satu kolom biasanya paling mudah dibaca. Pada bagian halaman yang lebih lebar, tata letak dua kolom dapat menempatkan penjelasan singkat atau gambar di sebelah bidang.

Pilih blok formulir pendaftaran untuk menentukan bidang subscriber, bidang wajib, label, tag tersembunyi, indikator progres, dan penghitung subscriber opsional. Setelah itu, Anda dapat mengatur gaya wadah formulir, bidang, dan tombol kirim secara terpisah.

Buka “Page settings” untuk mengubah latar belakang dan default desain keseluruhan kanvas Formulir Tersemat. Perhatikan situs web di sekitarnya. Latar belakang transparan atau sederhana sering kali menyatu dengan lebih alami, sedangkan latar belakang yang kontras membantu penawaran pendaftaran lebih menonjol.

Petunjuk lengkap tentang tata letak, konten, layer, bidang, tag, tipografi, dan tampilan tersedia di Menggunakan Pembuat Formulir Pendaftaran.

Menghubungkan Alur Pendaftaran

Gunakan kontrol alur pendaftaran di header pembuat untuk meninjau tindakan setelah pengiriman, email Double Opt-in yang dikirim, dan tampilan yang dilihat pengunjung setelah konfirmasi.

Anda dapat memilih alur yang sudah ada, mengedit alur yang ditetapkan, atau membuat alur baru. Jika alur yang dipilih digunakan bersama oleh formulir lain, ingat bahwa pengeditannya juga dapat memengaruhi formulir tersebut.

Melihat Pratinjau dan Menyimpan

Klik “Preview” untuk meninjau formulir lengkap sebelum menempatkannya di situs web. Periksa urutan bidang, label, ruang pesan kesalahan, teks tombol, dan jumlah konten pendukung.

Klik “Save changes” untuk menyimpan versi saat ini. Kembali ke Ringkasan Signup Forms jika Anda sudah siap menyematkannya.

Mengaktifkan Formulir

Formulir Tersemat harus aktif sebelum kode publiknya dapat digunakan.

Jika formulir tidak aktif, buka menu tindakan tiga titiknya di Ringkasan Signup Forms, lalu pilih “Activate”. Formulir aktif menampilkan tindakan “Show Code Snippet”.

Nonaktifkan formulir jika formulir tersebut tidak lagi boleh tersedia di situs web Anda. Menonaktifkan formulir akan membuatnya offline tanpa menghapus desain atau data laporan sebelumnya.

Menyalin Kode JavaScript

Klik “Show Code Snippet”, lalu buka tab “JavaScript”. Maildroppa menyediakan skrip singkat yang berisi ID formulir unik.

Kode tersebut mengikuti struktur ini:

<script async src="https://form.maildroppa.com/md-form-loader.js" data-md-form="[form-id]"></script>

Salin kode lengkap tanpa mengubah alamat skrip atau ID formulir.

Opsi JavaScript memuat formulir tersimpan saat ini melalui runtime formulir Maildroppa. Saat nanti Anda mengedit dan menyimpan formulir yang sama di Maildroppa, snippet yang sudah ada tetap merujuk ke ID formulir tersebut. Anda tidak perlu membuat formulir baru hanya untuk mengubah teks atau desainnya.

Menambahkan Formulir ke Situs Web Anda

Tempelkan skrip di lokasi halaman tempat Formulir Tersemat ingin ditampilkan.

Langkah-langkahnya bergantung pada sistem situs web Anda. Dalam pembuat halaman atau sistem manajemen konten, gunakan blok yang menerima HTML khusus atau kode skrip. Dalam situs web khusus, tambahkan skrip ke templat atau markup halaman yang relevan.

Beberapa editor situs web menghapus tag skrip karena alasan keamanan. Jika formulir tidak muncul setelah halaman dipublikasikan, periksa terlebih dahulu apakah editor mempertahankan skrip Maildroppa secara lengkap. Anda mungkin perlu menggunakan area kode khusus yang disediakan sistem atau meminta bantuan orang yang mengelola situs web tersebut.

Jangan menempelkan snippet Formulir Tersemat yang sama beberapa kali pada satu halaman, kecuali Anda memang ingin menampilkan formulir yang sama di beberapa lokasi dan telah menguji konfigurasi tersebut.

Menggunakan Tab HTML

Tab “HTML” menyediakan markup formulir yang dihasilkan. Opsi ini ditujukan untuk implementasi khusus jika Anda ingin bekerja langsung dengan HTML yang dirender.

Salin markup lengkap jika memilih metode ini. Karena integrasi HTML khusus dapat dipengaruhi oleh gaya dan implementasi situs web Anda, uji bidang, validasi, pengiriman, dan alur konfirmasinya dengan cermat.

Untuk formulir yang dikelola Maildroppa secara normal, snippet JavaScript merupakan integrasi yang lebih singkat dan memuat konfigurasi formulir publik terbaru berdasarkan ID-nya.

Menguji Formulir Tersemat

Publikasikan atau lihat pratinjau halaman situs web yang berisi kode tersebut. Kemudian uji formulir seperti yang dilakukan pengunjung:

1. Pastikan formulir muncul di posisi yang benar.
2. Lihat halaman pada layar lebar dan sempit.
3. Isi setiap bidang wajib.
4. Kirim formulir dan periksa responsnya.
5. Buka email Double Opt-in.
6. Konfirmasikan alamat tersebut dan periksa respons akhir.
7. Pastikan subscriber dan tag tersembunyi apa pun muncul dengan benar di Maildroppa.

Jika formulir lebih lebar daripada wadah situs webnya, sesuaikan lebar formulir, tata letak kolom, padding, atau pengaturan tumpukan seluler di pembuat. Hindari memperbaiki masalah tata letak dengan mengubah kode Maildroppa yang dihasilkan.

Memperbarui Formulir Tersemat

Buka formulir yang sama di Maildroppa, lakukan perubahan, lihat pratinjaunya, lalu klik “Save changes”. Snippet JavaScript di situs web Anda tetap menggunakan ID formulir yang sama dan memuat konfigurasi publik yang tersimpan.

Jika formulir perlu dihapus sementara, nonaktifkan formulir tersebut dari Ringkasan Signup Forms. Jika formulir sudah tidak diperlukan, hapus juga snippet dari situs web agar halaman tidak berisi kode yang tidak digunakan.