Chapters
- Kreator obrazaca za prijavu: Dizajnirajte obrasce
- Kreirajte i objavite odredišne stranice
- Izradite i ugradite formulare za prijavu
- Креирајте и прикажите искачуће формуларе
- Kreirajte i pozicionirajte klizne obrasce
Contents
the email tool that makes email marketing simple
- Guides and Tutorials
- Izradite i ugradite formulare za prijavu
Izradite i ugradite formulare za prijavu
Published: · Last updated: · By Marcus Biel
In brief
Saznajte kako da dizajnirate, aktivirate i ugradite Maildroppa obrazac za prijavu pomoću JavaScript ili HTML koda, a zatim ga testirate na sajtu.
Ugrađeni formular se postavlja direktno unutar postojeće stranice na vašem veb-sajtu. Ostaje deo okolnog sadržaja, umesto da se prikazuje iznad njega.
Ugrađeni formulari su pogodni za članke na blogu, odredišne stranice na vašem veb-sajtu, odeljke za bilten, bočne trake i podnožja. Mesto na koje dodate kod formulara određuje gde će se formular prikazati.
Ovaj vodič obuhvata korake koji su specifični za ugrađene formulare. Uobičajene funkcije za vizuelno uređivanje objašnjene su u glavnom vodiču za izradu formulara za prijavu.
Kreiranje ugrađenog formulara
Otvorite „Signup Forms“, kliknite na „Create Form“ i izaberite „Embedded Form“. Unesite jasan interni naziv i nastavite do alata za izradu.
Postojeći formular možete urediti i tako što ćete kliknuti na njegovo ime u pregledu formulara za prijavu.
Interni naziv se posetiocima ne prikazuje automatski. Nazovite formular prema njegovoj lokaciji ili svrsi, na primer „Bilten početne stranice“, „Podnožje bloga“ ili „Ažuriranja proizvoda“.
Izbor početnog dizajna
Ugrađeni formulari nude prazan formular, standardni formular i četiri dizajnirana predloška:
- Smirena poruka
- Traka s kuponom
- Tamni editorijal
- Minimalistički plavi
Izaberite dizajn koji se najbolje uklapa u prostor i ton veb-sajta na kojem će se formular prikazivati. Svaki početni dizajn možete u potpunosti izmeniti nakon izbora.
Dizajniranje ugrađenog formulara
Koristite „Layout“ i „Content“ da rasporedite formular. Ugrađeni formular može da sadrži formular za prijavu zajedno sa pratećim tekstom, slikama, listama, dugmadima, društvenim vezama, brojačem pretplatnika, razmacima ili razdelnicima.
Za usku bočnu traku ili podnožje, dizajn sa jednom kolonom obično je najlakši za čitanje. U širem odeljku stranice, raspored sa dve kolone može postaviti kratko objašnjenje ili sliku pored polja.
Izaberite blok formulara za prijavu da biste odabrali polja pretplatnika, obavezna polja, oznake, skrivene tagove, indikator napretka i opcioni brojač pretplatnika. Zatim možete zasebno stilizovati kontejner formulara, polja i dugme za slanje.
Otvorite „Page settings“ da biste promenili pozadinu i podrazumevane postavke celokupnog dizajna platna ugrađenog formulara. Uzmite u obzir okolni veb-sajt. Providna ili jednostavna pozadina često se prirodnije uklapa, dok kontrastna pozadina pomaže da ponuda za prijavu bude uočljivija.
Kompletna uputstva za rasporede, sadržaj, slojeve, polja, tagove, tipografiju i izgled nalaze se u vodiču Korišćenje alata za izradu formulara za prijavu.
Povezivanje toka prijave
Koristite kontrolu toka prijave u zaglavlju alata za izradu da biste proverili šta se dešava nakon slanja, koji se imejl za dvostruku potvrdu prijave šalje i šta posetilac vidi nakon potvrde.
Možete izabrati postojeći tok, urediti dodeljeni tok ili kreirati novi. Ako se izabrani tok deli sa drugim formularima, imajte na umu da njegovo uređivanje može uticati i na te formulare.
Pregled i čuvanje
Kliknite na „Preview“ da biste pregledali kompletan formular pre nego što ga postavite na veb-sajt. Proverite redosled polja, oznake, prostor za greške, tekst dugmeta i količinu pratećeg sadržaja.
Kliknite na „Save changes“ da biste sačuvali trenutnu verziju. Vratite se na pregled formulara za prijavu kada budete spremni da ga ugradite.
Aktiviranje formulara
Ugrađeni formular mora biti aktivan pre nego što njegov javni kod može da se koristi.
Ako je formular neaktivan, otvorite meni sa radnjama označen sa tri tačke u pregledu formulara za prijavu i izaberite „Activate“. Aktivni formular prikazuje radnju „Show Code Snippet“.
Deaktivirajte formular kada više ne treba da bude dostupan na vašem veb-sajtu. Deaktiviranje uklanja formular sa mreže, bez brisanja njegovog dizajna ili prethodnih podataka iz izveštaja.
Kopiranje JavaScript koda
Kliknite na „Show Code Snippet“ i otvorite karticu „JavaScript“. Maildroppa obezbeđuje kratku skriptu koja sadrži jedinstveni ID formulara.
Kod prati ovu strukturu:
<script async src="https://form.maildroppa.com/md-form-loader.js" data-md-form="[form-id]"></script>
Kopirajte kompletan kod bez menjanja adrese skripte ili ID-ja formulara.
JavaScript opcija učitava trenutni sačuvani formular putem Maildroppa okruženja za izvršavanje formulara. Kada kasnije uredite i sačuvate isti formular u Maildroppi, postojeći isečak i dalje upućuje na taj ID formulara. Nije potrebno da kreirate novi formular samo da biste promenili njegov tekst ili dizajn.
Dodavanje formulara na vaš veb-sajt
Nalepite skriptu na mesto stranice na kojem treba da se pojavi ugrađeni formular.
Tačni koraci zavise od sistema vašeg veb-sajta. U alatu za izradu stranica ili sistemu za upravljanje sadržajem koristite blok koji prihvata prilagođeni HTML ili kod skripte. Na prilagođenom veb-sajtu dodajte skriptu u odgovarajući šablon ili oznake stranice.
Neki uređivači veb-sajtova uklanjaju oznake skripti iz bezbednosnih razloga. Ako se formular ne pojavi nakon objavljivanja stranice, prvo proverite da li je uređivač sačuvao kompletnu Maildroppa skriptu. Možda ćete morati da koristite namenski odeljak sistema za prilagođeni kod ili da pitate osobu koja upravlja veb-sajtom.
Nemojte lepiti isti isečak ugrađenog formulara više puta na jednoj stranici, osim ako namerno želite isti formular na više lokacija i testirali ste takvo podešavanje.
Korišćenje HTML kartice
Kartica „HTML“ pruža generisane oznake formulara. Ova opcija je namenjena prilagođenim implementacijama u kojima želite direktno da radite sa prikazanim HTML-om.
Ako izaberete ovaj metod, kopirajte kompletne oznake. Pošto na prilagođenu HTML integraciju mogu uticati stilovi i implementacija vašeg veb-sajta, pažljivo testirajte njena polja, validaciju, slanje i tok potvrde.
Za uobičajeni formular kojim upravlja Maildroppa, JavaScript isečak predstavlja kraću integraciju i učitava trenutnu javnu konfiguraciju formulara na osnovu njegovog ID-ja.
Testiranje ugrađenog formulara
Objavite ili pregledajte stranicu veb-sajta koja sadrži kod. Zatim testirajte formular kao posetilac:
- Proverite da li se formular pojavljuje na ispravnom mestu.
- Pregledajte stranicu na širokom i uskom ekranu.
- Popunite svako obavezno polje.
- Pošaljite formular i pregledajte odgovor.
- Otvorite imejl za dvostruku potvrdu prijave.
- Potvrdite adresu i pregledajte konačni odgovor.
- Proverite da li se pretplatnik i svi skriveni tagovi ispravno pojavljuju u Maildroppi.
Ako je formular širi od kontejnera veb-sajta, podesite širinu formulara, raspored kolona, unutrašnju marginu ili postavke slaganja na mobilnim uređajima u alatu za izradu. Izbegavajte rešavanje problema sa rasporedom menjanjem generisanog Maildroppa koda.
Ažuriranje ugrađenog formulara
Otvorite isti formular u Maildroppi, unesite izmene, pregledajte ih i kliknite na „Save changes“. JavaScript isečak na vašem veb-sajtu nastavlja da koristi isti ID formulara i učitava sačuvanu javnu konfiguraciju.
Ako formular treba privremeno ukloniti, deaktivirajte ga iz pregleda formulara za prijavu. Ako više nije potreban, uklonite isečak i sa veb-sajta kako stranica ne bi sadržala neiskorišćen kod.
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.
No credit card required. No time limit.