Cara Menambahkan Form Mailchimp ke Situs Web Anda

Pelajari cara dengan mudah membuat dan menyematkan formulir pendaftaran Mailchimp atau formulir kontak di situs Anda. Tingkatkan langganan email dan kembangkan audiens Anda dalam beberapa langkah saja.
Lihat pendapat ChatGPT Buka Editor Widget Langsung
How to Add a Mailchimp Form to Your Website

Meletakkan formulir pendaftaran Mailchimp di situs web Anda adalah salah satu cara termudah dan paling efektif untuk menumbuhkan daftar email Anda, mengumpulkan prospek, dan tetap terhubung dengan pengunjung Anda. Ini memungkinkan Anda mengintegrasikan upaya pemasaran langsung ke kehadiran digital Anda tanpa memerlukan keterampilan teknis.

Jika Anda mencari cara yang andal untuk menangkap alamat email dan mengonversi pengunjung situs menjadi pelanggan yang berlangganan, ini tepat yang Anda perlukan. Widget formulir pendaftaran tidak sekadar blok kolom — ia alat pemasaran yang kuat yang meningkatkan keterlibatan dan menghasilkan hasil yang dapat diukur.

Sekarang Anda memahami betapa berharganya formulir pendaftaran, mari lanjutkan ke cara tercepat untuk membuat dan menempatkannya di situs Anda.

Cara Cepat Menyemat Form Mailchimp ke Website

Sekarang Anda tahu mengapa formulir pendaftaran itu penting, mari kita lihat bagaimana Anda bisa membangunnya menggunakan editor drag-and-drop yang sederhana. Tanpa coding sama sekali, Anda bisa membuat formulir yang sepenuhnya responsif yang pas dengan tata letak situs Anda dan sejalan dengan gaya merek Anda.

  1. Buka editor dan pilih template Form Mailchimp yang sesuai.
  2. Tambahkan bidang formulir, pilih tata letak, sesuaikan spasi, dan atur perataan untuk penempatan yang optimal.
  3. Pilih warna latar belakang, gaya huruf, dan aksen tombol agar sesuai dengan branding Anda.
  4. Klik “Tambahkan ke situs secara gratis”, salin kode semat, dan tempelkan ke backend situs Anda.

Pengaturan cepat ini memastikan formulir Anda terlihat bagus di semua perangkat dan mulai mengumpulkan pelanggan baru segera. Anda tidak memerlukan pengetahuan teknis — cukup beberapa klik, dan formulir Anda siap tayang.

Lihat caranya — buat formulir Mailchimp Anda sendiri dalam hitungan detik!

Fitur-Fitur Pembuat Form Elfsight

Setelah formulir Anda dibangun dan siap, saatnya melihat apa yang membuat solusi ini menonjol. Elfsight menawarkan rangkaian fitur lengkap yang dirancang untuk mempermudah pembuatan formulir dan memaksimalkan hasil dari setiap interaksi pengunjung.

  • Pilihan tata letak yang fleksibel. Tampilkan formulir Anda sebagai pop-up, sematkan secara inline, tampilkan di panel mengambang, atau aktifkan berdasarkan aksi pengguna seperti menggulir halaman atau niat keluar.
  • Kustomisasi bidang lanjutan. Tambahkan bidang tanpa batas, mulai dari input teks dasar hingga dropdown, kotak centang, penilaian, tanggal, dan lainnya — sempurna untuk konfigurasi formulir kontak yang rinci.
  • Integrasi Mailchimp yang mulus. Sinkronkan secara otomatis data yang terkirim dengan audiens Mailchimp Anda, sehingga pertumbuhan daftar dan segmentasi menjadi lebih mudah dari sebelumnya.
  • Tampilan ramah seluler. Setiap formulir sepenuhnya responsif, menyesuaikan dengan mulus ke semua ukuran layar dan tipe perangkat tanpa merusak tata letak atau kemudahan penggunaan.
  • Pengeditan desain visual. Sesuaikan formulir Anda dengan font, warna, bingkai, dan latar belakang kustom—tanpa coding.
  • Perlindungan anti-spam. Aktifkan CAPTCHA untuk menyaring kiriman dari bot dan menjaga daftar Anda tetap bersih serta relevan.
  • Notifikasi dan balasan otomatis. Kirim pemberitahuan waktu nyata ke email Anda dan atur pesan otomatis untuk pelanggan baru.
  • Panel Pengelolaan Kiriman Formulir. Lihat, ekspor, dan kelola data yang terkumpul langsung dari dashboard Anda untuk kendali yang lebih baik atas elemen pengumpulan data pengguna.

Dengan semua fitur ini digabungkan, formulir Mailchimp Anda menjadi lebih dari sekadar kotak langganan — ia berubah menjadi mesin penghasil lead yang kuat. Selanjutnya, mari kita telusuri seluruh proses membuatnya dan menambahkannya ke situs web Anda.

Buat dan Tambahkan Formulir Mailchimp: Langkah demi Langkah

Dengan mengikuti langkah-langkah ini, formulir Anda tidak hanya terlihat menarik secara visual, tetapi juga fungsional penuh dan dioptimalkan untuk konversi lead.

Anda bisa beralih antara tipe tata letak dan opsi gaya kapan saja—bahkan setelah publikasi—tanpa kehilangan data atau pengaturan Anda.

Ini menyelesaikan seluruh pengaturan formulir kontak Mailchimp yang disematkan. Dengan konfigurasi yang tepat, tata letak responsif, dan integrasi yang mulus, formulir Anda akan mulai mengumpulkan prospek dan memperluas daftar langganan buletin Anda dalam waktu singkat. Sekarang mari kita lihat cara lain untuk menambahkan formulir Mailchimp ke situs web.

Cara Lain Mengintegrasikan Form Mailchimp

Selain Elfsight, ada opsi manual untuk menampilkan formulir Mailchimp langsung di situs Anda. Metode bawaan ini tidak memerlukan platform pihak ketiga dan sangat cocok untuk pengguna yang nyaman bekerja dengan kode atau ingin tetap berada dalam ekosistem Mailchimp sendiri.

Berikut dua metode andal: menggunakan kode semat bawaan Mailchimp dan menulis formulir HTML kustom secara manual. Ikuti instruksi rinci untuk menerapkan masing-masing metode dengan benar.

Menggunakan Kode Sematkan Asli Mailchimp

Metode ini memungkinkan Anda menggunakan pembuat formulir bawaan Mailchimp dan menyalin blok kode siap pakai. Ini solusi cepat untuk integrasi dasar dan tidak memerlukan pengaturan teknis lain selain menempel HTML ke kode situs Anda.

  1. Masuk ke akun Mailchimp Anda. Dari dashboard Anda, pilih audiens tempat Anda ingin menambahkan pelanggan baru.
  2. Buka “Formulir Pendaftaran”. Di bilah navigasi, buka “Audiens” > “Formulir Pendaftaran”, lalu klik “Formulir Tertanam”.
  3. Pilih tata letak formulir. Pilih tipe formulir yang Anda inginkan: Classic (tata letak standar), Condensed (ringkas), Horizontal (sejajar dengan konten), atau Unstyled (untuk kustomisasi penuh).
  4. Atur pengaturan formulir. Aktifkan kotak centang untuk elemen seperti judul formulir, indikator kolom wajib, bidang GDPR, atau kelompok minat, sesuai preferensi audiens Anda.
  5. Salin kode semat yang dihasilkan. Gulir ke kotak “Salin/Tempel ke situs web Anda”, sorot potongan HTML-nya, dan salin.
  6. Tempel kode tersebut ke situs web Anda. Buka editor HTML Anda, navigasikan ke bagian tempat Anda ingin formulir ditempatkan, lalu tempelkan kodenya. Simpan dan publikasikan perubahan Anda.

Metode ini paling cocok untuk penempatan formulir yang sederhana di mana gaya bawaan sudah cukup, atau jika Anda nyaman mengubah kode sendiri.

Konsistensi tata letak dan gaya lanjutan harus ditangani melalui CSS kustom yang diterapkan secara eksternal, yang bisa memakan waktu bagi pemula.

Menulis Formulir HTML yang Kompatibel dengan Mailchimp Secara Manual

Pendekatan ini memberi Anda kendali penuh atas struktur dan perilaku formulir Anda. Diperlukan pengetahuan HTML dan protokol pengiriman Mailchimp. Metode ini cocok jika Anda ingin menuliskan formulir yang sepenuhnya disesuaikan secara manual tanpa memakai generator semat.

  1. Dapatkan URL aksi Mailchimp Anda. Di Mailchimp, buka “Formulir Pendaftaran” > “Formulir Tertanam“, klik opsi formulir “Unstyled”, dan temukan URL aksi formulir dalam HTML. Biasanya URL tersebut diawali dengan https:// dan berisi ID daftar Anda.
  2. Buat wadah formulir dasar. Di berkas HTML Anda, gunakan tag <form> dengan method=”POST” dan masukkan URL aksi pada atribut action.
  3. Tambahkan bidang input yang diperlukan. Setidaknya, sertakan bidang input email dengan name=”EMAIL”. Anda juga bisa menambahkan bidang seperti FNAME dan LNAME untuk nama depan dan nama belakang jika pengaturan daftar Anda membutuhkannya.
  4. Atur bidang tersembunyi dan identifikator. Tambahkan bidang input tersembunyi seperti u dan id (yang disediakan dalam kode semat Mailchimp) untuk memastikan formulir mengirim ke daftar audiens yang benar.
  5. Sisipkan tombol Kirim. Gunakan tombol bergaya dengan type=”submit” untuk memicu pengiriman formulir. Beri label “Berlangganan” atau “Daftar Sekarang” sesuai kebutuhan.
  6. Atur gaya formulir menggunakan CSS. Terapkan gaya inline atau tautkan ke file CSS terpisah untuk mendefinisikan tata letak, jarak, huruf, warna, dan responsivitas. Ini memastikan formulir cocok dengan desain situs Anda.
  7. Uji formulir. Kirim entri uji untuk memverifikasi bahwa data terkirim ke Mailchimp dengan sukses. Pastikan konfirmasi atau pengalihan berfungsi sebagaimana mestinya.

Metode ini kuat untuk proyek kustom, tetapi memerlukan ketelitian dan pemahaman terhadap struktur formulir HTML serta konvensi penamaan bidang Mailchimp.

Formulir tidak akan berfungsi jika nilai ID daftar tersembunyi atau nama bidangnya salah. Selalu periksa ulang kode semat Mailchimp untuk parameter yang diperlukan sebelum diterapkan.

Perbandingan: Elfsight vs Metode Lain

Berikut perbandingan rinci antara penggunaan Elfsight dengan metode Mailchimp bawaan, yang menyoroti kelebihan serta kompromi keduanya untuk membantu Anda memilih mana yang paling sesuai dengan alur kerja Anda:

MetodeKeunggulanKekurangan
Pembuat Formulir ElfsightAntarmuka drag-and-drop yang mudah digunakan dengan kendali desain penuh, otomasi, dan integrasi Mailchimp — semua tanpa menulis kode.Membutuhkan akun pihak ketiga untuk mengelola formulir dan mengakses antarmuka editor.
Kode Sematkan Mailchimp BawaanCepat diterapkan tanpa perlu instalasi — salin kode langsung dari dashboard Mailchimp Anda dan tempelkan ke situs Anda.Fleksibilitas desain terbatas dan memerlukan pengeditan CSS manual agar sesuai dengan branding situs Anda.
Formulir HTML ManualMemberikan kendali penuh atas struktur, desain, dan perilaku lanjutan melalui HTML dan CSS yang ditulis manual.Diperlukan pengetahuan teknis, dan kesalahan kecil bisa dengan mudah merusak fungsionalitas formulir atau menyebabkan pengiriman gagal.

Sekarang setelah Anda mengeksplor semua opsi utama untuk integrasi formulir Mailchimp, mari kita bahas tips praktis agar formulir Anda berfungsi dengan baik setelah tertanam di situs web Anda.

Tips Agar Formulir Anda Berfungsi Lebih Baik

Setelah formulir Mailchimp Anda disematkan, ada beberapa praktik terbaik yang membantu memastikan kinerjanya tetap baik, terlihat enak di semua perangkat, dan terintegrasi mulus dengan tata letak situs Anda secara keseluruhan. Berikut hal-hal yang perlu diingat sebelum dan sesudah pemasangan:

  • Letakkan formulir Anda di tempat yang mudah dilihat pengguna. Untuk formulir pendaftaran, penempatan terbaik biasanya di footer situs, sidebar, atau sebagai bilah lengket di bagian atas. Hindari menaruhnya terlalu dalam halaman.
  • Selalu gunakan tata letak responsif. Pilih tata letak yang secara otomatis menyesuaikan diri dengan ukuran layar ponsel, tablet, dan desktop. Hal ini mencegah bidang formulir dan tombol terpotong pada layar yang lebih kecil dan memastikan formulir tetap dapat diakses.
  • Pertahankan formulir singkat dan fokus. Minta hanya informasi esensial — biasanya nama dan email. Kolom tambahan menurunkan tingkat penyelesaian dan bisa membingungkan pengunjung pertama kali.
  • Gunakan teks ajakan bertindak yang jelas. Ganti tombol generik seperti “Submit” dengan frasa yang lebih menarik seperti “Berlangganan Sekarang” atau “Dapatkan Pembaruan”. Ini meningkatkan klik dan membantu membimbing pengguna melalui proses.
  • Tata bentuk formulir agar serasi dengan situs Anda. Sesuaikan jenis huruf, warna, dan desain tombol dengan identitas merek Anda. Penampilan yang konsisten membangun kepercayaan dan mengurangi gesekan visual.
  • Uji formulir di berbagai perangkat. Pratinjau situs web Anda di desktop, tablet, dan seluler setelah menyematkan formulir. Ini membantu mendeteksi masalah tata letak lebih awal dan memastikan Aksesibilitas penuh.
  • Aktifkan pesan konfirmasi otomatis. Selalu tetapkan pesan konfirmasi atau ucapan terima kasih yang terlihat untuk memberi tahu pengguna bahwa pengiriman mereka berhasil. Ini meningkatkan UX dan mengurangi kebingungan.
  • Gunakan filter spam dengan bijak. Jika Anda mengaktifkan CAPTCHA atau bidang honeypot, uji terlebih dahulu untuk memastikan tidak memblokir pengguna asli atau mengganggu pengiriman formulir.
  • Integrasikan dengan rangkaian email otomatis. Hubungkan formulir Anda dengan email selamat datang atau alur kerja pelanggan untuk menarik pengguna begitu mereka mendaftar.
  • Lacak kinerja dengan analitik. Gunakan alat analitik situs Anda untuk memantau tampilan formulir, tingkat pengiriman formulir, dan interaksi pengguna untuk mengoptimalkan penempatan dan desainnya lebih lanjut.
Jika ragu, selalu uji formulir yang disematkan dengan kiriman nyata sebelum dipublikasikan — ini membantu mengidentifikasi kesalahan integrasi, bug styling, atau entri yang salah arah.

Praktik-praktik ini akan membantu formulir pendaftaran Mailchimp Anda berfungsi mulus dan mengonversi lebih banyak pengunjung menjadi pelanggan. Di bagian selanjutnya, kita akan melihat siapa yang paling diuntungkan dari penggunaan formulir tertanam dan mengeksplorasi kasus penggunaan umum di berbagai industri.

Siapa yang Paling Diuntungkan dari Formulir Website

Formulir kontak Mailchimp tertanam sangat serbaguna dan dapat disesuaikan untuk berbagai industri. Baik Anda mengumpulkan email untuk bagian pendaftaran newsletter maupun mengumpulkan data pengguna untuk menghasilkan lead, formulir ini menjadi alat penting di berbagai jenis bisnis. Di bawah ini ada tiga industri utama di mana formulir tertanam memberikan nilai nyata.

Aplikasi di eCommerce 📦

Toko online mengandalkan formulir tertanam untuk mengembangkan daftar email, mempromosikan penawaran eksklusif, dan memulihkan keranjang belanja yang ditinggalkan. Menempatkan formulir pendaftaran Mailchimp di titik kontak utama — seperti halaman produk, popup niat keluar, dan alur checkout — membantu pedagang membangun saluran komunikasi langsung dengan pelanggan mereka.

Memberikan diskon untuk pelanggan yang berlangganan pertama kali dapat secara signifikan meningkatkan konversi formulir dan kualitas lead dalam lingkungan eCommerce.

Aplikasi di Pendidikan dan Kursus Online 🎓

Institusi pendidikan dan platform kursus menggunakan formulir untuk menangkap pertanyaan, membagikan materi kursus, atau mendaftarkan siswa untuk webinar dan pembaruan. Formulir yang ditempatkan dalam blok konten atau di halaman arahan memastikan calon siswa dapat berlangganan tanpa hambatan.

Menambahkan kotak centang minat seperti “Pelatihan Karier” atau “Info Beasiswa” dapat membantu menyegmentasikan pengguna dan menyesuaikan email tindak lanjut secara efektif.

Aplikasi di Media dan Penerbitan 📝

Penerbit, blogger, dan pembuat konten menggunakan formulir kontak dan pendaftaran untuk mengumpulkan email pembaca guna buletin, ringkasan artikel, dan distribusi konten premium. Formulir yang diletakkan di akhir posting blog atau dalam overlay pembaca mengubah pembaca yang terlibat menjadi pelanggan setia.

Menggunakan pesan singkat yang berfokus pada manfaat seperti “Bergabunglah dengan 50.000+ pembaca” membantu membangun bukti sosial dan meningkatkan kepercayaan pengunjung baru.

Dari eCommerce hingga pendidikan dan penerbitan, formulir Mailchimp yang disematkan dapat disesuaikan untuk memenuhi strategi komunikasi mana pun. Sekarang mari kita lihat potensi masalah dan cara menyelesaikannya dengan cepat.

Mengatasi Masalah Umum

Meskipun mengintegrasikan formulir Mailchimp pada dasarnya cukup mudah, beberapa masalah umum bisa muncul selama penyiapan atau setelah publikasi. Di bawah ini adalah jawaban atas pertanyaan yang sering diajukan yang membahas batasan kustomisasi, bug tampilan, alur data, dan pemecahan masalah untuk metode pihak ketiga.

Mengapa formulir Mailchimp yang disematkan tidak cocok dengan desain situs Anda?

Kode sematkan bawaan Mailchimp menggunakan gaya minimal, yang mungkin tidak cocok dengan branding Anda secara langsung. Anda perlu menerapkan CSS khusus langsung pada potongan formulir HTML atau menggunakan solusi berdesain yang menawarkan opsi kustomisasi visual.

Mengapa formulir tidak tampil di perangkat seluler?

Jika tata letak formulir tidak responsif, ia mungkin melebar atau tersembunyi di layar yang lebih kecil. Gunakan pengaturan tata letak formulir responsif atau terapkan aturan CSS seperti max-width: 100% dan box-sizing: border-box untuk memastikan visibilitas di perangkat seluler.

Apa yang menyebabkan formulir rusak saat ditempel ke situs web?

Seringkali hal ini terjadi karena penempatan cuplikan formulir HTML di bagian template yang dibatasi atau di pembuat halaman yang tidak kompatibel. Selalu masukkan kode tersebut di dalam blok HTML kustom atau area editor HTML mentah.

Mengapa kiriman formulir tidak tersinkron dengan daftar Mailchimp saya?

Ini biasanya disebabkan oleh nilai bidang tersembunyi yang tidak benar atau hilang seperti parameter u dan id dalam URL aksi. Periksa kembali kode semat Mailchimp dan pastikan semua nama bidang cocok dengan pengaturan audiens Anda.

Bagaimana cara menyesuaikan formulir di luar apa yang diizinkan Mailchimp?

Mailchimp membatasi kustomisasi yang disematkan pada visibilitas bidang dasar dan tipe tata letak. Untuk melampaui itu, Anda perlu menulis ulang HTML formulir secara manual atau menggunakan metode semat formulir pihak ketiga yang mencakup styling visual dan konfigurasi tingkat lanjut.

Mengapa pesan sukses tidak ditampilkan setelah pengiriman formulir?

Ini biasanya terjadi ketika URL pengalihan formulir kosong atau salah konfigurasi. Pastikan formulir Anda memiliki tindakan pasca-kirim yang valid (baik pesan konfirmasi atau pengalihan ke halaman terima kasih).

Bagaimana cara mencegah kiriman spam tanpa CAPTCHA?

Form Mailchimp tidak mendukung CAPTCHA secara bawaan dalam kode sisip. Sebagai alternatif, gunakan bidang honeypot tersembunyi atau andalkan solusi pihak ketiga yang menyediakan pengaturan perlindungan spam terintegrasi.

Dengan memahami dan mengatasi hambatan umum ini, Anda dapat memastikan formulir Mailchimp Anda stabil, fungsional, dan dioptimalkan untuk pengalaman pengguna situs Anda.

Kesimpulan

Menambahkan formulir Mailchimp ke situs Anda adalah langkah kuat untuk membangun hubungan yang lebih erat dengan audiens Anda. Baik Anda menanamkan formulir kontak dasar, mengintegrasikan bagian pendaftaran buletin, maupun menggunakan editor formulir drag-and-drop, fleksibilitas alat Mailchimp membuatnya mudah diakses untuk hampir semua kebutuhan. Dari metode bawaan hingga integrasi pihak ketiga yang canggih, proses penyiapan dapat disesuaikan dengan tingkat keahlian teknis Anda dan kebutuhan merek Anda.

Sepanjang panduan ini, Anda telah belajar bagaimana memilih metode yang tepat, menerapkannya dengan benar, dan memecahkan masalah umum. Dengan praktik terbaik dalam penempatan formulir, konfigurasi tata letak, dan penanganan pengiriman, Anda kini siap membuat integrasi formulir langganan yang mulus yang bekerja di semua perangkat dan industri.

Ingin Panduan Lanjutan?

Bergabunglah dengan Komunitas kami yang terus berkembang untuk berbagi ide, mendapatkan inspirasi, dan tetap selangkah lebih maju dari tren. Punya saran untuk fitur di masa mendatang? Tambahkan ke Wishlist kami — kami mendengarkan!

Artikel oleh
Manajer Konten
Saya seorang manajer konten di Elfsight, membuat panduan praktis tentang solusi situs web pintar untuk membantu pengguna meningkatkan proyek online mereka. Artikel-artikel saya ditulis dengan bahasa yang sederhana, menunjukkan bagaimana widget dapat meningkatkan situs web dan membuatnya lebih efektif.