Formulärredigeraren är ett användarvänligt verktyg som låter dig skapa olika typer av webbformulär för att interagera med webbplatsens besökare eller samla in användarinformation. Med det intuitiva gränssnittet, som liknar text- och bildredigeraren men med extra anpassningsalternativ, kan du designa och konfigurera formulär som feedbackformulär, prenumerationsformulär, undersökningar med mera.
Lägga till ett formulär på din webbplats
1. Gå till fliken Bygg från den vänstra menyn och välj kategorin Formulär.
2. Dra och släpp formulärelementet på önskad plats på sidan. Blå platshållare visar den närmaste tillgängliga släpplatsen.
Formulärkomponenter
1. Element: Konfigurera innehållet, inklusive formulärfält, kryssrutor, alternativknappar och uppmaningsknappen.
2. Inställningar: Definiera vad som händer när formuläret skickas, t.ex. att data skickas till ett e-postmeddelande eller en databas.
1. Textfält
Textfältet låter användarna mata in korta, enradiga textposter i formuläret.
Fälttyper
Typinställningen avgör vilken typ av data användarna kan ange:
- Text - Visar inmatningen exakt som den skrivits.
- Lösenord - Döljer inmatade tecken genom att visa dem som *** (t.ex. för lösenord).
- Dold - Lagrar systemrelaterad information (t.ex. hänvisnings- eller webbläsarinformation) eller förifyllda data som användarna inte ska se.
- Fil* - Låter besökarna ladda upp bilder, ljud, video eller andra filer. Inskickade filer genererar ett e-postmeddelande med en klickbar nedladdningslänk.
Anpassningsalternativ
- Namn - En unik identifierare för att hänvisa till fältet i formulärredigeraren och i e-postmeddelanden eller blogginlägg som genereras av formuläret.
- Bredd - Justera fältets bredd genom att ange ett värde eller dra i handtagen för att ändra storlek.
- Maxlängd - Ställer in det maximala antalet tecken som fältet kan acceptera.
- Validera som - Definierar den innehållstyp som krävs (t.ex. ett e-postfält måste innehålla en korrekt formaterad e-postadress). Om inmatningen är ogiltig kommer användarna att se en uppmaning om att korrigera den.
- Tips - Visar hjälptext när användarna klickar i fältet med vägledning eller exempel.
- Standardvärde - Fyller i fältet i förväg med ett fördefinierat värde som användarna kan ändra.
Filuppladdningar*
- För att lagra uppladdade filer måste formuläret vara länkat till en databas.
- Filer som lagras i databasen förblir tillgängliga och räknas in i kontots lagringsgräns.
- Fillänkar som skickas via e-post använder inte lagring utan upphör att gälla efter 30 dagar.
2. Textområde
Formulärfältet Textområde liknar textfältet, men det tillåter längre textinmatning med flera rader.
Anpassningsalternativ
Förutom de identiska alternativen för textfältet (Namn, Etikett, Bredd, Tips, Validera som och Standardvärde) finns det följande alternativ för textområdet:
- Höjd - Justera höjden på textområdet genom att ändra siffran i höjdfältet eller genom att dra i storlekskontrollerna i textområdet.
- Radbrytning - Definierar hur texten visas när den skickas in i e-postmeddelanden eller visas i forum/bloggar.
- Standard - Använder webbläsarens eller e-postklientens standardinställningar för radbrytning.
- Av - Inaktiverar radbrytning så att texten inte bryts upp på nya rader när den skrivs.
- Fysisk - Visar textens radbrytning exakt som i textområdet.
- Virtuell - Låter e-postklienten bestämma hur texten ska radbrytas.
3. Välj fält
Med hjälp av fältet Välj kan användarna välja från en fördefinierad lista med alternativ. Den kan visas som en rullgardinsmeny eller en lista beroende på den valda konfigurationen.
Anpassningsalternativ
- Typ - Definierar hur alternativen visas:
- Meny - Visar en rullgardinsmeny där användarna kan välja ett alternativ.
- Lista - Visar alla tillgängliga alternativ i en vertikal lista.
- Alternativ - Representerar de valbara alternativen i fältet.
- Alternativnamn - Texten som visas i rullgardinsmenyn eller listan.
- Alternativvärde - De faktiska data som skickas i e-postmeddelanden när alternativet väljs.
- Beställning och hantering - Använd uppåt-/nedåtpilarna för att ordna om alternativ, ta bort oönskade alternativ eller ställa in ett standardalternativ som visas när formuläret laddas.
4. Kryssrutor
Kryssrutor låter användarna välja flera alternativ från en lista eller slå på eller av ett enda alternativ. De är användbara för att presentera flervalslistrutor där mer än ett alternativ kan väljas.
Anpassningsalternativ
- Namn - Den unika identifieraren för kryssrutan som används i formulärmallsredigeraren, e-postmeddelanden och blogginlägg. Föreställ det som den fråga som användarna besvarar genom att markera eller avmarkera kryssrutor.
- Värde - Representerar det valda svaret. Om kryssrutan t.ex. är inställd på ”Ja” innebär detta att användaren svarar ja när hen markerar kryssrutan.
- Vald som standard - Om detta är aktiverat kommer kryssrutan att vara förmarkerad när formuläret laddas.
- Obligatoriskt - Kräver att användarna markerar rutan innan de skickar in formuläret. Detta är användbart för kryssrutor för avtal, t.ex. att användarna måste godkänna villkoren innan de skickas.
5. Alternativknappar
Alternativknappar används när endast ett alternativ kan väljas från en fördefinierad lista. Till skillnad från kryssrutor avmarkeras automatiskt alla andra alternativ i samma grupp om du markerar en alternativknapp.
Anpassningsalternativ
- Gruppnamn - Alla alternativknappar som representerar val för samma fråga måste tillhöra samma grupp. Det går bara att välja en knapp per grupp åt gången.
- Värde - Representerar svarsalternativet. Om frågan t.ex. är ”Gillar du min webbplats?” kan gruppnamnet vara ”LikeMySite”, med värdealternativen ”Ja”, ”Nej” och ”Behöver mer arbete”. Om en användare väljer Ja visas det skickade svaret som: LikeMySite: Ja.
- Standardläge - Gör det möjligt att välja en alternativknapp i förväg när formuläret laddas.
- Obligatoriskt - Kräver att användaren väljer ett alternativ innan formuläret skickas.
6. Feedbackformulär
Formulärredigeraren innehåller en inbyggd guide för feedbackformulär som enkelt kan läggas till genom att välja F-ikonen.
Det här formuläret är förkonfigurerat med alla nödvändiga fält för att skicka feedback, inklusive en uppmaningsknapp. Fälten är inställda med standardalternativ, men du kan anpassa dem efter behov så att de passar dina behov bättre.
7. Meddelanden om lyckad åtgärd/felmeddelanden
När formuläret har skickats visas ett meddelande om att det lyckades eller ett felmeddelande. Du kan styra placeringen av dessa meddelanden genom att ange deras plats i redigeraren.
Använd infoikonen för att välja var meddelandena ska visas. När Avancerade alternativ har aktiverats i Formuläregenskaper kan du också anpassa meddelandet om lyckad åtgärd. Om fältet lämnas tomt visas standardmeddelandet om lyckad åtgärd. Om du vill kan du ange ett anpassat meddelande i formuläregenskaperna som visas för besökarna när formuläret har skickats.
8. Uppmaningsknapp
Uppmaningsknappen är en viktig del av formuläret eftersom den låter användarna skicka in sina synpunkter och slutföra formulärets avsedda åtgärder. Utan den är det inte möjligt att skicka in formulär.
För att infoga en uppmaningsknapp letar du reda på dess ikon under avsnittet Radinbäddade element i verktygsfältet Formulärredigerare och klickar på den. När du har lagt till den klickar du på knappen för att konfigurera den som en inlämningsknapp. I rullgardinsmenyn Länk väljer du {Submit Form} för att aktivera inlämning av formulär.
Om du behöver en återställningsknapp kan du skapa en genom att följa samma steg och välja {Reset} i stället. Dessutom tillhandahåller den högra panelen ett redigerbart fält där du kan anpassa knappens bildtext för att matcha formulärets behov.
Uppmaningsknappens egenskaper och anpassning
- Bildtext och underbildtext för knapp: Ställ in huvudtexten och valfri undertext som visas på knappen.
- Storlek: Välj mellan små, medelstora eller stora knappstorlekar.
- Minsta bredd: Definiera en minsta knappbredd för enhetlighet i layouten.
- Bildtext vid överdragning och underbildtext: Ange alternativ text som visas när användarna för muspekaren över knappen.
- Textövergång: Om du har ställt in en bildtext för överdragning väljer du en övergångseffekt för en mjuk visuell förändring.
- Markeringseffekt: Lägg till en animeringseffekt som aktiveras tre sekunder efter att sidan har lästs in och upprepas var 30:e sekund.
- Färg: Välj mellan tre fördefinierade knappfärger.
- Justering: Justera knappen inom innehållet (vänster, mitten eller höger).
- Utfyllnad: Justera knappens utfyllnad i pixlar för optimalt avstånd.
- Knappikon: Välj en ikon från bildbiblioteket eller ladda upp en anpassad bild.
- Överdragningsikon: Du kan också lägga till en annan ikon som visas vid överdragning.
- Ikonens placering: Placera ikonen före eller efter knappens bildtext.
Formulärinställningar
1. Nästa sida
Ange den sida som ska öppnas när formuläret har skickats. Det kan vara en särskild tacksida eller någon annan relevant sida på din webbplats. Som standard är formuläret inställt på att hålla användarna på samma sida när formuläret har skickats. För att ändra det väljer du önskad sida via Länktyp.
2. Skicka till e-post
Aktivera Skicka till e-post för att ta emot formulärinlämningar via e-post från webbplatsens besökare. Detta kommer att utöka ytterligare alternativ:
| - Till e-post - Ange e-postadressen dit formulärinlämningar ska skickas, t.ex. orders@contactmywebsite.com. | |
| - Från e-post - För att säkerställa att formulärinlämningar kan skickas har vi inaktiverat alternativet att ange avsändarens e-postadress. | |
| - E-postämne - Definiera ämnesraden för e-postmeddelandet (t.ex. ”Begäran om ny information”). Du kan också använda $xxxxx$-jokertecken för att anpassa ämnet baserat på användarindata. |
3. E-postformat och mallredigeraren
Välj format på e-postmeddelandet:
- Vanligt - Skickar e-postmeddelanden med endast text, vilket tar bort all formatering.
- HTML - Skickar formaterade e-postmeddelanden förutsatt att din e-postklient stöder HTML.
För anpassade e-postlayouter väljer du Använd mall, vilket öppnar mallredigeraren:
- Mallredigeraren fungerar som en förenklad text- och bildredigerare.
- Använd rullgardinsmenyn Värde för att infoga platshållare som motsvarar formulärfält.
- När du har sparat formuläret genereras ett e-postmeddelande baserat på din mallstruktur.
4. Skicka e-postbekräftelse
Den här funktionen skickar ett automatiskt svar till besökarna som bekräftar att formuläret har skickats.
- Till e-post - Ange e-postadressen dit formulärinlämningar ska skickas, t.ex. orders@contactmywebsite.com.
- Från e-post - För att säkerställa att formulärinlämningar kan skickas har vi inaktiverat alternativet att ange avsändarens e-postadress.
- E-postämne - Definiera ämnesraden för e-postmeddelandet (t.ex. ”Begäran om ny information”).
- Meddelandeinnehåll - Aktivera via Använd mall > Redigera för att öppna textmallsredigeraren där du kan anpassa bekräftelsemeddelandet. Använd sammanfogningstaggar för att infoga formulärfältsdata (t.ex. $Email$).
5. Skicka till databas
Aktivera Skicka till databas om du vill lagra skickade formulärdata i en webbplatsförvaltad databas. Formuläret skapar automatiskt en dedikerad databas med obligatoriska kolumner som matchar formulärets fältnamn och datatyper. Du kan också använda en importerad databas, men se till att den har matchande kolumnnamn och typer.
Ytterligare inställningar:
- Kräver bekräftelse - Skickar ett e-postmeddelande med en bekräftelselänk som användarna måste klicka på för att validera sin inlämning.
- Kräv godkännande - Meddelar en moderator via e-post, vilket kräver att de godkänner eller avvisar bidraget innan det lagras. Detta hjälper till att förhindra skräppost eller oavsiktliga inlämningar.
Mer information finns i självstudiekursen för databasredigeraren.