Chapters

Contents

the email tool that makes email marketing simple

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

Ustvarjanje in vdelava prijavnih obrazcev

Published: · Last updated: · By

In brief

Naučite se oblikovati, shraniti in aktivirati vdelani obrazec Maildroppa, dodati kodo JavaScript ali HTML na spletno mesto ter ga preizkusiti.

Vdelani obrazec je nameščen neposredno znotraj obstoječe strani na vašem spletnem mestu. Ostane del okoliške vsebine, namesto da bi se prikazal nad njo.

Vdelani obrazci so primerni za članke v spletnem dnevniku, pristajalne strani na vašem spletnem mestu, razdelke z novičniki, stranske vrstice in noge strani. Mesto, kamor dodate kodo obrazca, določa, kje se bo obrazec prikazal.

Ta vodnik zajema korake, značilne za vdelane obrazce. Skupne funkcije vizualnega urejanja so razložene v glavnem vodniku za ustvarjanje prijavnih obrazcev.

Urejevalnik vdelanega obrazca: celoten urejevalnik

Ustvarjanje vdelanega obrazca

Odprite »Signup Forms«, kliknite »Create Form« in izberite »Embedded Form«. Vnesite jasno interno ime in nadaljujte v urejevalnik.

Obstoječi obrazec lahko uredite tudi tako, da kliknete njegovo ime v pregledu prijavnih obrazcev.

Interno ime obiskovalcem ni samodejno prikazano. Obrazec poimenujte glede na njegovo mesto ali namen, na primer »Homepage Newsletter«, »Blog Footer« ali »Product Updates«.

Izbira začetnega dizajna

Vdelani obrazci ponujajo prazen obrazec, standardni obrazec in štiri oblikovane predloge:

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

Izberite dizajn, ki se najbolje ujema s prostorom in tonom spletnega mesta, na katerem bo obrazec prikazan. Vsak začetni dizajn lahko po izbiri popolnoma spremenite.

Urejevalnik vdelanega obrazca: začetne predloge

Oblikovanje vdelanega obrazca

Za razporeditev obrazca uporabite »Layout« in »Content«. Vdelani obrazec lahko vsebuje prijavni obrazec skupaj s spremljevalnim besedilom, slikami, seznami, gumbi, družabnimi povezavami, števcem naročnikov, praznimi elementi ali ločilniki.

Za ozko stransko vrstico ali nogo strani je enostolpčni dizajn običajno najlažje berljiv. V širšem razdelku strani lahko dvostolpčna postavitev kratko razlago ali sliko postavi ob polja.

Izberite blok prijavnega obrazca, da določite polja za naročnike, obvezna polja, oznake, skrite oznake, indikator napredka in izbirni števec naročnikov. Nato lahko ločeno oblikujete vsebnik obrazca, polja in gumb za pošiljanje.

Odprite »Page settings«, da spremenite ozadje in splošne privzete nastavitve dizajna platna vdelanega obrazca. Upoštevajte okoliško spletno mesto. Prosojno ali preprosto ozadje se pogosto bolj naravno zlije z okolico, kontrastno ozadje pa pomaga, da ponudba za prijavo izstopa.

Celotna navodila za postavitve, vsebino, plasti, polja, oznake, tipografijo in videz so v uporabi urejevalnika prijavnih obrazcev.

Povezovanje prijavnega toka

Z nadzorom prijavnega toka v glavi urejevalnika preverite, kaj se zgodi po pošiljanju, katero e-poštno sporočilo z dvojno potrditvijo je poslano in kaj obiskovalec vidi po potrditvi.

Izberete lahko obstoječi tok, uredite dodeljeni tok ali ustvarite novega. Če je izbrani tok v skupni rabi z drugimi obrazci, ne pozabite, da lahko njegovo urejanje vpliva tudi na te obrazce.

Predogled in shranjevanje

Kliknite »Preview«, da pregledate celoten obrazec, preden ga namestite na svoje spletno mesto. Preverite vrstni red polj, oznake, prostor za napake, besedilo gumba in količino spremljevalne vsebine.

Kliknite »Save changes«, da shranite trenutno različico. Ko ste pripravljeni, da ga vdelate, se vrnite v pregled prijavnih obrazcev.

Aktiviranje obrazca

Vdelani obrazec mora biti aktiven, preden lahko uporabite njegovo javno kodo.

Če je obrazec neaktiven, odprite meni dejanj s tremi pikami v pregledu prijavnih obrazcev in izberite »Activate«. Pri aktivnem obrazcu je na voljo dejanje »Show Code Snippet«.

Obrazec deaktivirajte, ko ne sme biti več na voljo na vašem spletnem mestu. Deaktivacija obrazec odstrani iz uporabe, ne da bi izbrisala njegov dizajn ali prejšnje podatke poročil.

Urejevalnik vdelanega obrazca: vrstica aktivnega vdelanega obrazca

Kopiranje kode JavaScript

Kliknite »Show Code Snippet« in odprite zavihek »JavaScript«. Maildroppa zagotavlja kratko skripto, ki vsebuje enolični ID obrazca.

Koda ima naslednjo strukturo:

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

Kopirajte celotno kodo, ne da bi spreminjali naslov skripte ali ID obrazca.

Možnost JavaScript naloži trenutno shranjeni obrazec prek izvajalnega okolja obrazcev Maildroppa. Ko pozneje v Maildroppi uredite in shranite isti obrazec, se obstoječi izsek še vedno sklicuje na ta ID obrazca. Novega obrazca vam ni treba ustvariti samo zato, da spremenite njegovo besedilo ali dizajn.

Urejevalnik vdelanega obrazca: pogovorno okno za vdelavo obrazca

Dodajanje obrazca na spletno mesto

Skripto prilepite na mesto strani, kjer naj se prikaže vdelani obrazec.

Natančni koraki so odvisni od sistema vašega spletnega mesta. V ustvarjalniku strani ali sistemu za upravljanje vsebine uporabite blok, ki sprejema HTML po meri ali kodo skripte. Na spletnem mestu po meri dodajte skripto v ustrezno predlogo ali oznako strani.

Nekateri urejevalniki spletnih mest zaradi varnostnih razlogov odstranijo oznake script. Če se obrazec po objavi strani ne prikaže, najprej preverite, ali je urejevalnik ohranil celotno skripto Maildroppa. Morda boste morali uporabiti namenski razdelek sistema za kodo po meri ali prositi osebo, ki upravlja spletno mesto.

Isti izsek vdelanega obrazca na eni strani ne prilepite večkrat, razen če namerno želite isti obrazec na več mestih in ste takšno nastavitev preizkusili.

Uporaba zavihka HTML

Zavihek »HTML« ponuja ustvarjeno oznako obrazca. Ta možnost je namenjena izvedbam po meri, pri katerih želite neposredno delati z upodobljenim HTML-jem.

Če izberete to metodo, kopirajte celotno oznako. Ker lahko na integracijo HTML po meri vplivata slog in izvedba vašega spletnega mesta, skrbno preizkusite polja, preverjanje, pošiljanje in potrditveni tok.

Za običajni obrazec, ki ga upravlja Maildroppa, je izsek JavaScript krajša integracija, ki naloži trenutno javno konfiguracijo obrazca glede na njegov ID.

Preizkušanje vdelanega obrazca

Objavite ali odprite predogled strani spletnega mesta, ki vsebuje kodo. Nato obrazec preizkusite tako, kot bi ga obiskovalec:

  1. Preverite, ali se obrazec prikaže na pravilnem mestu.
  2. Oglejte si stran na širokem in ozkem zaslonu.
  3. Izpolnite vsa obvezna polja.
  4. Pošljite obrazec in preglejte odziv.
  5. Odprite e-poštno sporočilo z dvojno potrditvijo.
  6. Potrdite naslov in preglejte končni odziv.
  7. Preverite, ali se naročnik in vse skrite oznake pravilno prikažejo v Maildroppi.

Če je obrazec širši od vsebnika spletnega mesta, v urejevalniku prilagodite širino obrazca, postavitev stolpcev, notranji odmik ali nastavitve zlaganja na mobilnih napravah. Težav s postavitvijo ne odpravljajte s spreminjanjem ustvarjene kode Maildroppa.

Posodabljanje vdelanega obrazca

V Maildroppi odprite isti obrazec, izvedite spremembe, si jih oglejte v predogledu in kliknite »Save changes«. Izsek JavaScript na vašem spletnem mestu še naprej uporablja isti ID obrazca in naloži shranjeno javno konfiguracijo.

Če je treba obrazec začasno odstraniti, ga deaktivirajte v pregledu prijavnih obrazcev. Če ga ne potrebujete več, odstranite izsek tudi s spletnega mesta, da stran ne bo vsebovala neuporabljene kode.

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.