9. Enkelt kontaktformulär

Här lär du dig att skapa ett enkelt kontaktformulär för din TYPO3-sajt, i likhet med exemplet till höger. Med detta formulär kan du lägga till fält samt sätta mottagare för det e-post som skickas.

Detta är ett inbyggt standardformulär, med begränsade funktioner. Om du önskar ett formulär med mer funktionalitet, rekommenderar vi pluginet Powermail.

NOTERA!!! För samtliga fält i formulärguiden, som nämns nedan, är det nödvändigt att slå Enter eller att klicka på den gröna ikonen till höger om fältet, för att den tillagda texten skall läggas till. Utan denna åtgärd kommer den ifyllda texten att försvinna när du sparar.

9.1 Skapa ett formulär

Skapa ett nytt element och gå till fliken "Formulär". Där väljer du "E-postformulär" (Fig 9.1.1). 

OBS! Innan du fortsätter, vänligen spara elementet.

Gå till fliken "Formulär" och klicka på ikonen till höger om fältet "Konfigurering", för att använda formulärguiden (Fig 9.1.2). 

9.2 Lägga till fält

För att lägga till fält i ditt formulär, är det lättast att använda sig av formulärguiden (Vänligen se sektion 9.1, bild 9.1.2). Gå till fliken "Elements". Här hittar du "Basic form elements" (1), "Predefined form elements" (2) samt "Content elements" (3) (Fig 9.2.1). Du lägger till fält genom att dra fälttypen, från listan till vänster, och in i sektionen till höger.

"Basic form elements" innehåller vanliga fält, som t ex textfält (Namn, E-post, Telefon etc.) och textarea (Meddelande). "Predefined form elements" innehåller fördefinierade grupper av fält, t ex checkboxar och radioknappar. "Content elements" ger dig möjligheten att lägga till rubriker och text i formuläret.

Efter att du dragit in och släppt fälttypen, hoppar systemet automatiskt till fliken "Options". Under avsnittet "Label properties" kan du redigera etiketten för fältet. Efter att du skrivit in titeln, är det viktigt att du slår Enter på tangentbordet eller klickar på den gröna checkboxen till höger om fältet, för att ändringen skall slå igenom (Fig 9.2.2). 

Fortsätt till sektionen "Attributes properties" och namnge fältet. Detta fält används av TYPO3 för att skilja de olika fälten åt.

OBS! Detta fält får EJ lov att ha versaler eller specialtecken. Användning av annat än gemener och understreck, kan göra att formuläret inte postar som det ska. 

Sektionen innehåller även alternativ för att lägga till en så kallad placeholder (1), vilket lägger till en text inuti fältet med förklarande text. Om du vill ändra till en annan typ av fält (2) är även detta möjligt. Autokomplettering (3) kan slås på, som då ger förslag på text som tidigare applicerats på liknande fält. Slutligen kan du ställa in om fältet skall vara obligatoriskt (4). (Img 9.2.3)

Sektionen "Validation" ger dig möjlighet att validera fältet, t ex om fältet är obligatoriskt (Required) (Fig 9.2.4). Efter att du valt en validering visas ett antal alternativ, ett meddelande som visas intill etiketten (1), felmeddelande som visas om fältet ej är korrekt ifyllt (2), om valideringen skall upphöra om fälltet ej ifyllts korrekt (3: skall alltid lämnas i checkad) samt om meddelandet (1) skall visas intill etiketten eller ej (4) (Fig 9.2.5).

På höger sida om flikarna, kan du se fälten allt eftersom du lägger till dem i formuläret.

OBS! För att kunna se formuläret i frontend, måste du först spara och stänga formulärguiden, och därefter spara själva formulärelementet.

9.3 Postningsalternativ

Fliken "Forms" innehåller all information kring formulärets beteende samt vart e-posten skall skickas. Den första sektionen är "Behaviour" och innehåller alternativ för att visa en summering av ifylld information innan det skickas. För ett enkelt kontaktformulär är detta inte nödvändigt, men kan vara bra om det handlar om ett beställningsformulär (Fig 9.3.1). 

Nästa sektion heter "Prefix" och innehåller formulärets individuella namn (för att TYPO3 ska kunna hålla isär om det finns fler formulär på sajten). Detta namn skall vara unikt. (Fig 9.3.2)

OBS! Detta fält får EJ lov att ha versaler eller specialtecken. Användning av annat än gemener och understreck, kan göra att formuläret inte postar som det ska. 

Gå vidare till sektionen "Post processors", för att redigera informationen om vem som skall ta emot mailet. Lägg till mottagaradressen (1), avsändarens namn (2) samt ämnesraden för e-posten (3) (Fig 12.3.3). 

9.4 Skicka vidare till 'Tack'-sida

För att skicka besökaren vidare till en 'Tack'-sida, efter att de skickat ett meddelande via formuläret, skapar du för själva sidan där tackmeddelandet skall stå, och denna sida sätt till att inte visas i menyn.

Inne i formulärguiden går du till fliken 'Form' samt öppnar sektionen 'Post processors'. I dropdown-menyn 'Add a Post Processor', väljer du 'Redirect'. Detta kommer att lägga till ett nytt fält. (Img 9.4.1). 

För att skapa länken till 'Tack'-sidan, kan du antingen använda sidans PID (Sidans ID-nummer, som du hittar genom att vila muspekaren över sidikonen i sidträdet, enligt blid nedan) eller genom att lägga in länkadressen till sidan (detta alternativ kan orsaka bruten länk, om du skulle flytta 'Tack'-sidan). (Fig 9.4.2)

9.5 Ta bort fält

För att ta bort fält, håller du din muspekare över fältet i den högra sektionen, så att en papperskorgoch pennikon visas. Klicka på papperskorgen för att ta bort fältet (Fig 9.5.1).