Pembina borang pendaftaran: Reka borang

Diterbitkan: 16 Julai 2026 · Kemas kini terakhir: 12 September 2026 · Oleh Marcus Biel

Pembina borang pendaftaran ialah editor visual untuk semua borang pendaftaran dan halaman pendaratan Maildroppa.

Gunakannya untuk menyusun reka letak, menambah teks dan imej, menetapkan medan pelanggan, menukar warna dan fon, menetapkan teg serta menentukan perkara yang berlaku selepas seseorang menghantar borang. Kanvas memaparkan hasilnya semasa anda bekerja, jadi anda boleh mereka bentuk keseluruhan pengalaman pendaftaran tanpa menulis sebarang kod.

Maildroppa menggunakan pembina yang sama untuk empat jenis borang:

• Halaman pendaratan ialah halaman kendiri lengkap yang anda terbitkan dan kongsikan melalui pautan.
• Borang terbenam diletakkan terus dalam halaman di laman web anda.
• Popup muncul di atas kandungan laman web anda dan juga boleh dibuka melalui elemen halaman.
• Slide-in muncul di tepi atau pada kedudukan yang dipilih dalam tetingkap pelayar.

Panduan ini menerangkan semua fungsi yang dikongsi oleh jenis borang ini. Panduan yang dipautkan hanya menerangkan tetapan dan langkah khusus bagi setiap jenis.

Membuka pembina borang pendaftaran

Buka “Signup Forms” dalam Maildroppa. Kemudian, klik “Create Form” untuk mencipta halaman pendaratan, borang terbenam, popup atau slide-in baharu.

Untuk meneruskan kerja pada borang sedia ada, klik namanya atau pilih “Edit Form” daripada menu tindakan tiga titik dalam Gambaran keseluruhan borang pendaftaran.

Berikan nama dalaman yang jelas kepada borang. Nama seperti “Buletin e-mel halaman utama”, “Popup webinar” atau “Insentif pendaftaran musim panas” lebih mudah dikenal pasti kemudian berbanding nama umum seperti “Borang 1”. Nama ini membantu anda mengurus borang dalam Maildroppa dan tidak dipaparkan secara automatik kepada pelawat.

Memahami pembina

Pembina dibahagikan kepada empat bahagian utama.

Bar atas mengandungi nama borang dan tindakan utama. Di sini anda boleh kembali ke gambaran keseluruhan, melihat pratonton hasil kerja dan menyimpannya. Bagi halaman pendaratan, bar ini turut memaparkan kawalan draf dan penerbitan.

Bar sisi kiri mengandungi “Layout”, “Content” dan “Layers”. Gunakannya untuk membina struktur, menambah elemen baharu dan mengurus semua elemen yang telah diletakkan pada kanvas.

Kanvas ialah ruang kerja utama yang memaparkan halaman atau borang semasa. Klik elemen untuk memilihnya. Anda juga boleh menyeret elemen ke lokasi lain atau menambah elemen baharu daripada bar sisi kiri.

Bar sisi kanan mengandungi “Settings” dan “Page settings”. “Settings” mengubah elemen yang dipilih, manakala “Page settings” mengubah latar belakang keseluruhan dan tetapan reka bentuk lalai.

Pada skrin yang lebih kecil, bar sisi dibuka sebagai panel melalui butang “Content” dan “Settings”. Fungsi yang tersedia tetap sama.

Bermula dengan templat

Apabila anda mencipta borang, pembina menawarkan reka bentuk permulaan untuk jenis borang yang dipilih. Anda boleh bermula dengan reka bentuk kosong, menggunakan borang standard atau memilih templat siap guna.

Templat menyediakan reka letak permulaan, warna, tipografi dan kandungan contoh tanpa mengehadkan perubahan yang boleh anda buat kemudian. Selepas memilih templat, anda masih boleh mengedit, mengalihkan, menduplikasi, mengubah gaya atau membuang setiap elemen.

Setiap jenis borang mempunyai templat yang sesuai dengan tujuannya. Contohnya, halaman pendaratan merangkumi reka bentuk halaman lengkap untuk buletin e-mel, insentif pendaftaran, webinar dan senarai menunggu. Borang terbenam, popup dan slide-in pula mempunyai reka bentuk permulaan yang padat untuk setiap jenis.

Jika anda tidak pasti templat yang hendak dipilih, pilih templat dengan struktur yang paling hampir dengan matlamat anda. Menukar teks, warna dan imej biasanya lebih pantas daripada membina struktur yang sama daripada kanvas kosong.

Mencipta reka letak

Buka “Layout” pada bar sisi kiri untuk menambah baris sel baharu. Reka letak yang tersedia termasuk:

• Satu sel
• Dua, tiga atau empat sel yang sama saiz
• Dua sel dengan nisbah 2:1
• Dua sel dengan nisbah 1:2

Klik reka letak untuk menambahkannya pada kedudukan sisipan semasa atau seretnya ke kanvas. Kemudian, letakkan kandungan dalam setiap sel.

Pilih kotak atau lajur untuk melaraskan saiz, jarak, penjajaran, latar belakang, sempadan dan ruang dalamnya (padding) pada bar sisi kanan. Untuk reka letak berbilang lajur, anda juga boleh mengubah lebar relatif lajur.

Gunakan reka letak untuk mewujudkan urutan bacaan yang jelas. Satu lajur sesuai untuk borang pendaftaran yang padat. Reka letak dua lajur pula berguna apabila imej, senarai manfaat atau maklumat acara perlu dipaparkan di sebelah borang pendaftaran.

Menambah kandungan

Buka “Content” pada bar sisi kiri untuk menambah blok kandungan individu. Klik blok untuk memasukkannya atau seretnya ke kedudukan yang dikehendaki pada kanvas.

Pembina menyediakan blok kandungan berikut:

Signup form — Mengandungi medan pelanggan dan butang hantar. Reka bentuk memerlukan satu blok borang pendaftaran sebelum boleh disimpan sebagai borang yang berfungsi. Setelah blok itu ditambah, ia tidak lagi ditawarkan sebagai blok kandungan tambahan.

Text — Menambah tajuk, perenggan atau teks berformat lain.

Image — Menambah imej daripada URL, fail yang dimuat naik atau pustaka media Maildroppa. Anda boleh memberikan teks alternatif, menambah pautan serta mengawal dimensi, nisbah aspek, pemangkasan, titik fokus, putaran dan pembalikan imej.

Video — Menambah video YouTube atau Vimeo, URL benaman atau fail video secara terus. Anda juga boleh menetapkan imej pratonton dan penampilan butang main.

List — Menambah senarai berbulet atau bernombor. Edit entri serta kawal warna penanda, jarak, tipografi dan penjajaran.

Button — Menambah butang pautan dengan teks, URL, saiz, lebar, warna, sempadan, tipografi dan penjajaran yang boleh ditetapkan.

Social links — Menambah ikon berpautan untuk perkhidmatan seperti Facebook, Instagram, LinkedIn, TikTok, YouTube atau laman web anda.

Subscriber counter — Memaparkan jumlah semasa pelanggan yang telah mengesahkan langganan. Anda boleh menetapkan nilai tambahan (offset), menukar label serta mengubah gaya nombor dan teks.

Spacer — Menambah ruang kosong yang boleh dilaraskan. Jarak untuk desktop dan peranti mudah alih boleh ditetapkan secara berasingan.

Divider — Menambah garisan mendatar dengan warna, ketebalan, lebar, gaya, penjajaran dan jarak yang boleh ditetapkan.

Halaman pendaratan juga menyediakan bahagian lengkap yang boleh digunakan semula. Bahagian ini diterangkan dalam Panduan halaman pendaratan.

Memilih dan menyusun elemen

Klik elemen pada kanvas untuk memilihnya. Tetapannya akan dipaparkan pada bar sisi kanan.

Kawalan pada atau berhampiran elemen yang dipilih membolehkan anda mengalihkan, menduplikasi atau memadamkannya. Anda juga boleh menyeret elemen ke sel atau kedudukan lain. Penunjuk penempatan menunjukkan tempat elemen itu akan disisipkan.

Buka “Layers” apabila halaman mengandungi banyak kotak, lajur dan blok kandungan yang tersarang. Panel “Layers” memaparkan struktur lengkap dalam bentuk senarai. Dari situ, anda boleh:

• Memilih elemen
• Menamakannya semula supaya lebih mudah dikenal pasti
• Mengalihkannya ke atas atau ke bawah
• Menyeretnya ke kedudukan lain
• Mengunci atau membuka kuncinya
• Menduplikasikannya
• Memadamkannya

Penguncian berguna untuk mengelakkan latar belakang, imej atau bahagian yang telah siap daripada teralih secara tidak sengaja. Buka kunci lapisan apabila anda mahu mengedit atau mengubah kedudukannya semula.

Gunakan “Undo” dan “Redo” pada bar alat pembina untuk mengundur atau mengulang perubahan reka bentuk terkini.

Mengedit teks

Klik dalam elemen teks untuk mengedit kandungannya terus pada kanvas. Bar alat teks menyediakan gaya perenggan dan tajuk berserta pilihan pemformatan biasa.

Bergantung pada teks yang dipilih, anda boleh menggunakan huruf tebal, italik, garis bawah, garis potong, subskrip, superskrip, penjajaran, senarai berbulet atau bernombor, pautan dan emoji. Tetapan teks yang dipilih juga membolehkan anda melaraskan tipografi dan warna tanpa mengubah semua elemen teks lain.

Gunakan tetapan tipografi global di bawah “Page settings” apabila semua tajuk, teks isi, pautan atau butang perlu menggunakan gaya yang konsisten. Gunakan tetapan elemen yang dipilih apabila hanya satu blok perlu kelihatan berbeza.

Menetapkan borang pendaftaran

Pilih blok borang pendaftaran pada kanvas untuk membuka tetapannya. Bahagian yang tersedia merangkumi bar kemajuan, kaunter pelanggan, medan, teg tersembunyi, bekas borang, medan input dan butang hantar.

Medan pelanggan

Alamat e-mel ialah medan utama borang pendaftaran. Anda juga boleh menambah medan pelanggan yang sedia ada dalam akaun Maildroppa anda.

Bagi setiap medan, anda boleh menukar label dan teks pemegang tempat, menentukan sama ada medan itu wajib diisi serta memilih sama ada labelnya dipaparkan. Medan boleh disusun semula dengan menyeretnya atau menggunakan kawalan pergerakan.

Minta maklumat yang benar-benar diperlukan sahaja. Borang yang lebih ringkas lebih pantas diisi, manakala medan tambahan berguna jika maklumat itu akan digunakan untuk segmentasi atau pemperibadian.

Teg tersembunyi

Teg tersembunyi tidak dipaparkan kepada pelawat. Apabila seseorang mendaftar melalui borang, Maildroppa menetapkan teg yang dipilih kepada pelanggan tersebut secara automatik.

Ini berguna untuk mengenal pasti sumber pendaftaran atau minat yang mendorongnya. Contohnya, borang webinar boleh menetapkan teg “Webinar”, manakala borang insentif pendaftaran boleh menetapkan teg berdasarkan topik bahan yang dimuat turun.

Bar kemajuan

Bar kemajuan boleh dinyahdayakan atau dipaparkan sebagai peratusan atau penunjuk dua langkah.

Untuk penunjuk peratusan, anda boleh menukar teks, warna, saiz dan ketebalan fon serta penjajaran. Untuk penunjuk dua langkah, anda boleh mengedit label bagi kedua-dua langkah serta memilih warna bagi keadaan aktif dan tidak aktif.

Penunjuk kemajuan boleh membantu menjelaskan bahawa menghantar borang ialah langkah pertama, manakala mengesahkan langganan melalui e-mel (double opt-in) ialah langkah kedua.

Kaunter pelanggan dalam borang

Borang pendaftaran boleh memaparkan jumlah semasa pelanggan yang telah mengesahkan langganan sebelum atau selepas butang hantar.

Anda boleh menetapkan nilai tambahan (offset), menulis label, memilih kedudukan serta melaraskan tipografi dan penjajaran. Nilai tambahan ini ditambahkan pada jumlah pelanggan yang telah mengesahkan langganan yang dipaparkan oleh Maildroppa.

Kaunter dalam borang ini berbeza daripada blok kandungan “Subscriber counter” kendiri. Gunakan tetapan borang apabila nombor itu perlu dikaitkan secara langsung dengan bahagian penghantaran borang. Gunakan blok kandungan apabila kaunter perlu dipaparkan di tempat lain dalam reka bentuk.

Reka bentuk borang, input dan butang

Tetapan “Signup Form Block” mengawal bekas yang mengelilingi medan, termasuk latar belakang, sempadan, jejari sudut dan jaraknya.

Tetapan input mengawal latar belakang medan, label, teks, teks pemegang tempat, sempadan dan jarak. Butang hantar mempunyai tetapan berasingan untuk teks, tipografi, warna, sempadan, dimensi dan penjajarannya.

Anda boleh mengklik bar kemajuan atau butang hantar terus pada kanvas untuk segera membuka tetapan bahagian tersebut.

Menukar penampilan keseluruhan

Buka “Page settings” pada bar sisi kanan untuk menukar reka bentuk keseluruhan. Bagi borang terbenam, popup dan slide-in, tetapan ini digunakan pada kanvas borang, bukannya halaman lengkap yang dihoskan.

Anda boleh menetapkan latar belakang utama, imej latar belakang, lebar maksimum dan jarak pada peranti mudah alih. Tetapan penampilan menentukan tetapan lalai untuk:

• Fon teks isi dan warna teks
• Warna pautan, garis bawah dan warna apabila penuding berada di atas pautan
• Fon tajuk, warna, ketebalan, saiz dan ketinggian baris
• Butang
• Kotak, sempadan, jejari sudut, sela dan ruang dalam
• Ruang dalam halaman pada peranti mudah alih serta titik apabila lajur mula disusun bertindan

Tetapan lalai ini memastikan reka bentuk kekal konsisten. Blok individu masih boleh menggunakan tetapan yang berbeza apabila diperlukan.

Menghubungkan aliran pendaftaran

Setiap borang dihubungkan kepada Aliran pendaftaran. Aliran ini mengawal proses yang dilalui pelanggan selepas borang dihantar:

• Perkara yang dilihat pelawat sejurus selepas menghantar borang
• E-mel pengesahan langganan (double opt-in) yang dihantar
• Perkara yang berlaku selepas pelanggan mengesahkan alamat e-mel

Buka kawalan aliran pendaftaran pada pengepala pembina untuk melihat aliran yang sedang ditetapkan. Anda boleh memilih aliran sedia ada yang lain, mengedit aliran yang dipilih atau mencipta aliran baharu.

Satu aliran pendaftaran boleh digunakan oleh beberapa borang. Jika anda mengedit aliran yang dikongsi, perubahan itu akan mempengaruhi setiap borang yang menggunakannya. Oleh itu, Maildroppa membolehkan anda memilih sama ada untuk mengedit aliran yang dikongsi atau mencipta salinan berasingan bagi borang semasa.

Melihat pratonton dan menyimpan

Klik “Preview” untuk menyemak reka bentuk lengkap dan pengalaman pendaftaran sebelum membukanya kepada umum. Pratonton berguna untuk menyemak teks panjang, perkadaran imej, susunan medan, label butang dan keseimbangan keseluruhan borang.

Bagi borang terbenam, popup dan slide-in, klik “Save changes” apabila anda bersedia untuk menyimpan versi semasa.

Halaman pendaratan menggunakan kawalan draf dan penerbitan pada bar atas. Halaman ini boleh disimpan tanpa diterbitkan. Perubahan pada halaman yang sudah diterbitkan pula tidak akan diterbitkan sehingga anda menerbitkan perubahan tersebut. Aliran kerja lengkap diterangkan dalam Membina dan menerbitkan halaman pendaratan.

Selepas menyimpan, kembali ke Gambaran keseluruhan borang pendaftaran untuk mengaktifkan dan membenamkan borang laman web atau mengurus halaman pendaratan yang telah diterbitkan.

Teruskan mengikut jenis borang anda

Kerja reka bentuk yang dikongsi oleh semua jenis borang kini selesai. Teruskan dengan panduan untuk borang yang anda cipta:

• Bina dan terbitkan halaman pendaratan
• Bina dan benamkan borang terbenam
• Tetapkan dan paparkan popup
• Tetapkan slide-in dan kedudukannya