Chapters

Contents

the email tool that makes email marketing simple

Sign Up FreeNo credit card required.
maildroppa-promo-notebookmaildroppa-promo-spaceship

Creează și încorporează formulare de înscriere

Published: · Last updated: · By

In brief

Află cum să creezi, activezi și integrezi formulare de înscriere Maildroppa cu JavaScript sau HTML, apoi să le testezi pe site-ul tău și fluxul de confirmare.

Un formular încorporat este plasat direct într-o pagină existentă a site-ului tău. Acesta rămâne parte a conținutului din jur, în loc să apară deasupra acestuia.

Formularele încorporate funcționează bine în articole de blog, pagini de destinație de pe propriul site, secțiuni de newsletter, bare laterale și subsoluri. Locul în care adaugi codul formularului determină unde apare formularul.

Acest ghid acoperă pașii specifici formularelor încorporate. Funcțiile comune de editare vizuală sunt explicate în ghidul principal Crearea formularelor de înscriere.

Embedded Form Builder: complete builder

Crearea unui formular încorporat

Deschide „Signup Forms”, fă clic pe „Create Form” și selectează „Embedded Form”. Introdu un nume intern clar și continuă în editor.

Poți edita și un formular existent făcând clic pe numele acestuia în Prezentarea generală a formularelor de înscriere.

Numele intern nu este afișat automat vizitatorilor. Denumește formularul în funcție de locația sau scopul său, de exemplu „Newsletter pe pagina principală”, „Subsolul blogului” sau „Actualizări despre produse”.

Alegerea unui design de pornire

Formularele încorporate oferă un formular gol, un formular standard și patru șabloane proiectate:

  • Notă calmă
  • Bandă pentru cupoane
  • Editorial întunecat
  • Albastru minimalist

Alege designul care se potrivește cel mai bine spațiului și tonului site-ului în care va apărea formularul. Orice design de pornire poate fi modificat complet după selectare.

Embedded Form Builder: starter templates

Proiectarea formularului încorporat

Folosește „Layout” și „Content” pentru a aranja formularul. Un formular încorporat poate conține formularul de înscriere împreună cu texte explicative, imagini, liste, butoane, linkuri sociale, un contor de abonați, spațieri sau separatoare.

Pentru o bară laterală sau un subsol îngust, un design cu o singură coloană este de obicei cel mai ușor de citit. Într-o secțiune mai lată a paginii, un aspect cu două coloane poate plasa o explicație scurtă sau o imagine lângă câmpuri.

Selectează blocul formularului de înscriere pentru a alege câmpurile abonatului, câmpurile obligatorii, etichetele, tagurile ascunse, un indicator de progres și un contor opțional de abonați. Apoi poți stiliza separat containerul formularului, câmpurile și butonul de trimitere.

Deschide „Page settings” pentru a modifica fundalul și setările implicite generale ale designului pentru suprafața formularului încorporat. Ține cont de site-ul din jur. Un fundal transparent sau simplu se integrează adesea mai natural, în timp ce un fundal contrastant ajută oferta de înscriere să iasă în evidență.

Instrucțiunile complete pentru aspecte, conținut, straturi, câmpuri, taguri, tipografie și aspect se găsesc în Utilizarea editorului de formulare de înscriere.

Conectarea fluxului de înscriere

Folosește controlul fluxului de înscriere din antetul editorului pentru a verifica ce se întâmplă după trimitere, ce e-mail de confirmare Double Opt-in este trimis și ce vede vizitatorul după confirmare.

Poți selecta un flux existent, edita fluxul atribuit sau crea unul nou. Dacă fluxul selectat este folosit și de alte formulare, reține că editarea acestuia poate afecta și acele formulare.

Previzualizarea și salvarea

Fă clic pe „Preview” pentru a verifica formularul complet înainte de a-l plasa pe site. Verifică ordinea câmpurilor, etichetele, spațiul pentru erori, textul butonului și cantitatea de conținut explicativ.

Fă clic pe „Save changes” pentru a salva versiunea curentă. Revino la Prezentarea generală a formularelor de înscriere când ești gata să îl încorporezi.

Activarea formularului

Formularul încorporat trebuie să fie activ înainte ca codul său public să poată fi utilizat.

Dacă formularul este inactiv, deschide meniul de acțiuni cu trei puncte din Prezentarea generală a formularelor de înscriere și alege „Activate”. Un formular activ afișează acțiunea „Show Code Snippet”.

Dezactivează formularul când nu mai trebuie să fie disponibil pe site. Dezactivarea scoate formularul offline fără a-i șterge designul sau datele anterioare din rapoarte.

Embedded Form Builder: active embedded form row

Copierea codului JavaScript

Fă clic pe „Show Code Snippet” și deschide fila „JavaScript”. Maildroppa oferă un script scurt care conține ID-ul unic al formularului.

Codul are următoarea structură:

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

Copiază codul complet fără a modifica adresa scriptului sau ID-ul formularului.

Opțiunea JavaScript încarcă formularul salvat curent prin sistemul de rulare a formularelor Maildroppa. Când editezi și salvezi ulterior același formular în Maildroppa, fragmentul de cod existent continuă să se refere la acel ID de formular. Nu trebuie să creezi un formular nou doar pentru a-i modifica textul sau designul.

Embedded Form Builder: embed form dialog

Adăugarea formularului pe site

Inserează scriptul în locația paginii în care dorești să apară formularul încorporat.

Pașii exacți depind de sistemul site-ului tău. Într-un editor de pagini sau sistem de gestionare a conținutului, folosește un bloc care acceptă HTML personalizat sau cod de script. Pe un site personalizat, adaugă scriptul în șablonul sau marcajul relevant al paginii.

Unele editoare de site elimină tagurile script din motive de securitate. Dacă formularul nu apare după publicarea paginii, verifică mai întâi dacă editorul a păstrat scriptul Maildroppa complet. Este posibil să fie necesar să folosești zona dedicată pentru cod personalizat a sistemului sau să ceri ajutorul persoanei care administrează site-ul.

Nu insera de mai multe ori același fragment de formular încorporat pe o pagină decât dacă dorești în mod intenționat același formular în mai multe locații și ai testat această configurare.

Utilizarea filei HTML

Fila „HTML” oferă marcajul generat al formularului. Această opțiune este destinată implementărilor personalizate în care dorești să lucrezi direct cu HTML-ul redat.

Copiază marcajul complet dacă alegi această metodă. Deoarece o integrare HTML personalizată poate fi afectată de stilurile și implementarea site-ului tău, testează cu atenție câmpurile, validarea, trimiterea și fluxul de confirmare.

Pentru formularul gestionat în mod normal de Maildroppa, fragmentul JavaScript este integrarea mai scurtă și încarcă configurația publică actuală a formularului folosind ID-ul acestuia.

Testarea formularului încorporat

Publică sau previzualizează pagina site-ului care conține codul. Apoi testează formularul așa cum ar face-o un vizitator:

  1. Verifică dacă formularul apare în poziția corectă.
  2. Vezi pagina pe un ecran lat și pe unul îngust.
  3. Completează fiecare câmp obligatoriu.
  4. Trimite formularul și verifică răspunsul.
  5. Deschide e-mailul Double Opt-in.
  6. Confirmă adresa și verifică răspunsul final.
  7. Verifică dacă abonatul și eventualele taguri ascunse apar corect în Maildroppa.

Dacă formularul este mai lat decât containerul site-ului, ajustează în editor lățimea formularului, aspectul coloanelor, spațierea interioară sau setările de aranjare pe mobil. Evită să rezolvi problemele de aspect modificând codul Maildroppa generat.

Actualizarea unui formular încorporat

Deschide același formular în Maildroppa, efectuează modificările, previzualizează-le și fă clic pe „Save changes”. Fragmentul JavaScript de pe site continuă să folosească același ID de formular și încarcă configurația publică salvată.

Dacă formularul trebuie eliminat temporar, dezactivează-l din Prezentarea generală a formularelor de înscriere. Dacă nu mai este necesar, elimină și fragmentul de pe site, astfel încât pagina să nu conțină cod neutilizat.

Ready to Send Better Emails?

Stop juggling bloated tools or overpriced plans. Maildroppa offers personal support, GDPR-level privacy, and powerful email marketing - starting free forever.

Sign Up For Free

No credit card required. No time limit.