Chapters

Contents

the email tool that makes email marketing simple

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

Formulärbyggare för registrering: Designa formulär

Published: · Last updated: · By

In brief

Lär dig använda Maildroppas visuella byggverktyg för registreringsformulär: välj mallar, ordna innehåll, utforma fält, koppla flöden och spara.

Formulärbyggaren för registrering är den visuella redigeraren för alla registreringsformulär och landningssidor i Maildroppa.

Du kan använda den för att ordna layouter, lägga till text och bilder, konfigurera prenumerantfält, ändra färger och teckensnitt, tilldela taggar och bestämma vad som händer efter att någon skickar in formuläret. Arbetsytan visar resultatet medan du arbetar, så du behöver inte skriva någon kod för att skapa en komplett registreringsupplevelse.

Maildroppa använder samma byggare för fyra formulärtyper:

Den här guiden förklarar alla funktioner som delas av dessa formulärtyper. De länkade guiderna förklarar endast de inställningar och steg som är unika för varje typ.

Formulärbyggare för registrering: komplett formulärbyggare för registrering

Öppna formulärbyggaren för registrering

Öppna ”Signup Forms” i Maildroppa. Klicka sedan på ”Create Form” för att skapa en ny landningssida, ett inbäddat formulär, ett popup-fönster eller ett utfällbart formulär.

Om du vill fortsätta arbeta med ett befintligt formulär klickar du på dess namn eller väljer ”Edit Form” i åtgärdsmenyn med tre punkter i översikten över registreringsformulär.

Ge formuläret ett tydligt internt namn. Namn som ”Nyhetsbrev på startsidan”, ”Webbinarie-popup” eller ”Sommarens lead magnet” är lättare att känna igen senare än generiska namn som ”Formulär 1”. Formulärnamnet hjälper dig att hantera formuläret i Maildroppa och visas inte automatiskt för besökare.

Förstå byggaren

Byggaren är indelad i fyra huvudområden.

Det övre fältet innehåller formulärnamnet och huvudåtgärderna. Här kan du återgå till översikten, förhandsgranska arbetet och spara det. Landningssidor visar även sina kontroller för utkast och publicering i det här fältet.

Det vänstra sidofältet innehåller ”Layout”, ”Content” och ”Layers”. Använd det för att skapa strukturen, lägga till nya element och hantera allt som redan placerats på arbetsytan.

Arbetsytan är det centrala arbetsområdet. Den visar den aktuella sidan eller formuläret. Klicka på ett element för att välja det. Du kan också dra element till en annan plats eller lägga till nya element från det vänstra sidofältet.

Det högra sidofältet innehåller ”Settings” och ”Page settings”. ”Settings” ändrar det valda elementet. ”Page settings” ändrar den övergripande bakgrunden och designens standardinställningar.

På mindre skärmar öppnas sidofälten som paneler med knapparna ”Content” och ”Settings”. De tillgängliga funktionerna är desamma.

Börja med en mall

När du skapar ett formulär erbjuder byggaren startdesigner för den valda formulärtypen. Du kan börja med en tom design, använda standardformuläret eller välja en färdig mall.

Mallar ger dig en startlayout, färger, typografi och exempel på innehåll. De begränsar inte vad du kan ändra senare. När du har valt en mall kan varje element fortfarande redigeras, flyttas, dupliceras, formateras om eller tas bort.

Varje formulärtyp har mallar som passar dess syfte. Landningssidor innehåller till exempel kompletta designer för nyhetsbrev, lead magnets, webbinarier och väntelistor. Inbäddade formulär, popup-fönster och utfällbara formulär har egna kompakta startdesigner.

Om du är osäker på vilken mall du ska välja kan du välja den vars struktur ligger närmast ditt mål. Det går vanligtvis snabbare att ändra text, färger och bilder än att bygga samma struktur från en tom arbetsyta.

Formulärbyggare för registrering: val av startmall

Skapa layouten

Öppna ”Layout” i det vänstra sidofältet för att lägga till en ny rad med celler. De tillgängliga layouterna omfattar:

  • En cell
  • Två, tre eller fyra lika stora celler
  • Två celler med förhållandet 2:1
  • Två celler med förhållandet 1:2

Klicka på en layout för att lägga till den vid den aktuella insättningspositionen eller dra den till arbetsytan. Du kan sedan placera innehåll i varje cell.

Välj en ruta eller kolumn för att justera dess storlek, avstånd, justering, bakgrund, kantlinje och utfyllnad i det högra sidofältet. För layouter med flera kolumner kan du även ändra kolumnernas relativa bredder.

Använd layouter för att skapa en tydlig läsordning. En enda kolumn fungerar bra för kompakta registreringsformulär. En layout med två kolumner är användbar när en bild, en lista över fördelar eller information om ett evenemang ska visas bredvid registreringsformuläret.

Lägg till innehåll

Öppna ”Content” i det vänstra sidofältet för att lägga till enskilda innehållsblock. Du kan klicka på ett block för att infoga det eller dra det till önskad position på arbetsytan.

Byggaren innehåller följande innehållsblock:

Signup form — Innehåller prenumerantfälten och knappen för att skicka in formuläret. En design behöver ett registreringsformulärblock innan den kan sparas som ett fungerande formulär. När blocket finns på plats erbjuds det inte längre som ytterligare innehållsblock.

Text — Lägger till rubriker, stycken eller annan formaterad text.

Image — Lägger till en bild från en URL, en uppladdning eller Maildroppas mediebibliotek. Du kan ange alternativtext, lägga till en länk och styra mått, bildförhållande, beskärning, fokuspunkt, rotation och vändning.

Video — Lägger till en YouTube- eller Vimeo-video, en inbäddnings-URL eller en direkt videofil. Du kan även konfigurera en förhandsvisningsbild och utformningen av uppspelningsknappen.

List — Lägger till en punktlista eller numrerad lista. Redigera posterna och styr färg på markörer, avstånd, typografi och justering.

Button — Lägger till en länkknapp med konfigurerbar text, URL, storlek, bredd, färger, kantlinje, typografi och justering.

Social links — Lägger till länkade ikoner för tjänster som Facebook, Instagram, LinkedIn, TikTok, YouTube eller din webbplats.

Subscriber counter — Visar det aktuella antalet bekräftade prenumeranter. Du kan lägga till ett offsetvärde, ändra etiketten och formatera siffran och texten.

Spacer — Lägger till kontrollerat tomt utrymme. Avstånd för dator och mobil kan ställas in separat.

Divider — Lägger till en horisontell linje med konfigurerbar färg, tjocklek, bredd, stil, justering och avstånd.

Landningssidor erbjuder även kompletta återanvändbara sektioner. Dessa förklaras i guiden för landningssidor.

Formulärbyggare för registrering: innehållspanel

Välj och ordna element

Klicka på ett element på arbetsytan för att välja det. Dess inställningar visas i det högra sidofältet.

Kontrollerna på eller i närheten av det valda elementet låter dig flytta, duplicera eller ta bort det. Du kan också dra ett element till en annan cell eller position. En placeringsindikator visar var det kommer att infogas.

Öppna ”Layers” när sidan innehåller många kapslade rutor, kolumner och innehållsblock. Panelen Layers visar hela strukturen i en lista. Därifrån kan du:

  • Välja ett element
  • Byta namn på det för enklare identifiering
  • Flytta det upp eller ner
  • Dra det till en annan position
  • Låsa eller låsa upp det
  • Duplicera det
  • Ta bort det

Låsning är användbart när en färdig bakgrund, bild eller sektion inte ska flyttas av misstag. Lås upp lagret när du vill redigera eller flytta det igen.

Använd ”Undo” och ”Redo” i byggarens verktygsfält för att gå bakåt eller framåt genom de senaste designändringarna.

Redigera text

Klicka i ett textelement för att redigera innehållet direkt på arbetsytan. Textverktygsfältet innehåller stycke- och rubrikstilar samt vanliga formateringsalternativ.

Beroende på vilken text som valts kan du använda fetstil, kursiv stil, understrykning, genomstrykning, nedsänkt text, upphöjd text, justering, punktlistor eller numrerade listor, länkar och emojis. Med inställningarna för markerad text kan du även justera typografi och färger utan att ändra alla andra textelement.

Använd de globala typografiinställningarna under ”Page settings” när alla rubriker, all brödtext, alla länkar eller knappar ska ha en enhetlig stil. Använd inställningarna för det valda elementet när bara ett block ska se annorlunda ut.

Konfigurera registreringsformuläret

Välj registreringsformulärblocket på arbetsytan för att öppna dess inställningar. De tillgängliga avsnitten omfattar förloppsindikator, prenumeranträknare, fält, dolda taggar, formulärbehållare, inmatningsfält och skicka-knapp.

Prenumerantfält

E-postadressen är det centrala fältet i ett registreringsformulär. Du kan även lägga till prenumerantfält som finns i ditt Maildroppa-konto.

För varje fält kan du ändra etiketten och platshållaren, bestämma om det ska vara obligatoriskt och välja om fältetiketten ska visas. Fält kan sorteras om genom att dra dem eller använda flyttkontrollerna.

Be bara om information som du verkligen behöver. Kortare formulär går snabbare att fylla i, medan ytterligare fält är användbara när informationen ska användas för segmentering eller personalisering.

Dolda taggar

Dolda taggar visas inte för besökare. När någon registrerar sig via formuläret tilldelar Maildroppa automatiskt de valda taggarna till prenumeranten.

Detta är användbart för att identifiera källan eller intresset bakom en registrering. Ett formulär för ett webbinarium kan till exempel tilldela taggen ”Webinarium”, medan ett lead magnet-formulär kan tilldela en tagg för det nedladdade ämnet.

Förloppsindikator

Förloppsindikatorn kan inaktiveras eller visas som en procentandel eller en indikator i två steg.

För en procentindikator kan du ändra text, färger, teckenstorlek, tjocklek och justering. För en indikator i två steg kan du redigera etiketterna för båda stegen och välja aktiva och inaktiva färger.

En förloppsindikator kan hjälpa till att förklara att inskickandet av formuläret är det första steget och att bekräftelsen av e-postmeddelandet för Double Opt-in är det andra.

Prenumeranträknare i formuläret

Registreringsformuläret kan visa det aktuella antalet bekräftade prenumeranter före eller efter knappen för att skicka in formuläret.

Du kan lägga till ett offsetvärde, skriva en etikett, välja position och justera typografi och justering. Offsetvärdet läggs till i det bekräftade prenumerantantal som Maildroppa visar.

Den här formulärräknaren skiljer sig från det fristående innehållsblocket ”Subscriber counter”. Använd formulärinställningen när antalet ska vara direkt kopplat till området för att skicka in formuläret. Använd innehållsblocket när räknaren ska visas någon annanstans i designen.

Design av formulär, inmatningsfält och knapp

Inställningarna för ”Signup Form Block” styr behållaren runt fälten, inklusive bakgrund, kantlinje, hörnradie och avstånd.

Inställningarna för inmatningsfält styr fältbakgrunder, etiketter, text, platshållare, kantlinjer och avstånd. Skicka-knappen har separata inställningar för text, typografi, färger, kantlinje, mått och justering.

Du kan klicka direkt på förloppsindikatorn eller skicka-knappen på arbetsytan för att omedelbart öppna inställningarna för den delen.

Ändra det övergripande utseendet

Öppna ”Page settings” i det högra sidofältet för att ändra den övergripande designen. För inbäddade formulär, popup-fönster och utfällbara formulär gäller dessa inställningar för formulärets arbetsyta och inte för en komplett värdsida.

Du kan konfigurera huvudbakgrund, bakgrundsbild, maximal bredd och mobilavstånd. Utseendeinställningarna anger standardvärden för:

  • Brödtextens teckensnitt och textfärg
  • Länkfärg, understrykning och hovringsfärg
  • Rubrikens teckensnitt, färg, tjocklek, storlek och radhöjd
  • Knappar
  • Rutor, kantlinjer, hörnradier, mellanrum och utfyllnad
  • Sidutfyllnad på mobil och den punkt där kolumner staplas

Dessa standardvärden håller designen enhetlig. Enskilda block kan fortfarande åsidosätta dem vid behov.

Anslut ett registreringsflöde

Varje formulär är anslutet till ett registreringsflöde. Registreringsflödet styr prenumerantens resa efter att formuläret har skickats in:

  • Vad besökaren ser direkt efter att formuläret har skickats in
  • Vilket e-postmeddelande för Double Opt-in som skickas
  • Vad som händer efter att prenumeranten har bekräftat e-postadressen

Öppna kontrollen för registreringsflödet i byggarens sidhuvud för att se det aktuellt tilldelade flödet. Du kan välja ett annat befintligt flöde, redigera det valda flödet eller skapa ett nytt.

Ett registreringsflöde kan användas av flera formulär. Om du redigerar ett delat flöde påverkar ändringen alla formulär som använder det. Maildroppa låter dig därför välja om du vill redigera det delade flödet eller skapa en separat kopia för det aktuella formuläret.

Förhandsgranska och spara

Klicka på ”Preview” för att kontrollera den kompletta designen och registreringsupplevelsen innan du gör den offentlig. Förhandsgranskningen är användbar för att kontrollera lång text, bildproportioner, fältordning, knappetiketter och formulärets övergripande balans.

För inbäddade formulär, popup-fönster och utfällbara formulär klickar du på ”Save changes” när du vill spara den aktuella versionen.

Landningssidor använder kontroller för utkast och publicering i det övre fältet. De kan sparas utan att publiceras, och ändringar på en redan publicerad sida förblir opublicerade tills du publicerar dem. Det fullständiga arbetsflödet förklaras i Skapa och publicera en landningssida.

Efter att du har sparat återgår du till översikten över registreringsformulär för att aktivera och bädda in ett webbplatsformulär eller hantera en publicerad landningssida.

Fortsätt med din formulärtyp

Det gemensamma designarbetet är nu klart. Fortsätt med guiden för det formulär du skapar:

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.