Skapa och designa formulär med Elementor Form-widget

Skapa och designa formulär med Elementor Form-widget

Varje webbplats måste innehålla ett kontaktformulär! Kontaktformulär är användbara för en mängd olika ändamål, oavsett vilken typ av webbplats du har. De kan generera leads, bygga kontakter och relationer, låta användare rapportera problem med din webbplats och allt däremellan.

Det är inte nödvändigt att vara teknisk expert för att skapa kontaktformulär i WordPress. Elementors sidbyggare gör det enklare än någonsin att skapa snygga webbplatser.

För att demonstrera hur man skapar kontaktformulär med Elementor går vi igenom de olika alternativen och allt som finns att veta om kontaktformulär i Elementor.

Elementor har inkluderat en formulärwidget under en längre tid nu, vilket innebär att du inte längre behöver gå någon annanstans för att skapa formulär för din WordPress-webbplats, vilket är en välsignelse!

Tidigare kan du ha stött på problem när du skapade formulär med vissa av de tillgängliga plugin. Processen att designa och konfigurera formulär kan vara tidskrävande och frustrerande. Som tur är för oss alla är Elementor Form-widgeten enkel att arbeta med.

Innan vi börjar med Elementors formulärbyggare, låt oss ta en snabb titt på några av dess viktigaste funktioner.

En av de mest utmärkande funktionerna, till att börja med, är att den är helt integrerad i Elementors gränssnitt, vilket innebär att du har tillgång till många design-/stil-/layoutalternativ som finns tillgängliga i Elementor. Jag tror inte att du hittar ett fristående plugin med ett designsystem som är lika robust som det här.

Därifrån kan du skapa upp till 18 olika typer av fält:

  • URL:en och telefonnumret är följande:
  • Radioknappar är en typ av radioknapp.
  • Välj från en lista (rullgardinsmeny)
  • Kryssrutor används i checklistor.
  • Det finns bara en kryssruta (godkännande)
  • reCAPTCHA
  • Honungsburkar är en typ av behållare som innehåller honung (förhindrar skräppost)

Du kan också dela upp dina formulär i flera sidor för att skapa formulär i flera steg, vilket är fördelaktigt för långa ansökningar.

Elementor Pro har över 12 integrationer med populära e-postmarknadsföringstjänster och system för kundrelationshantering (CRM) för att hjälpa dig att få ut det mesta av dina formulär. Det finns också en komplett Zapier-integration som låter dig ansluta till vilket som helst av de tusentals verktyg som finns tillgängliga på Zapier-plattformen om ditt verktyg inte finns med i listan.

Det finns också några andra spännande alternativ. Tillamp, när någon fyller i ditt formulär kan du få aviseringar via Slack eller Discord.

På tal om aviseringar kan du också anpassa de e-postaviseringar du får och de e-postaviseringar som formulärsändare får. När de har skickat in formuläret kan du omdirigera dem till en anpassad tacksida som du skapar.

Vilket är det bästa sättet att skapa ett formulär i Elementor?

Vi börjar med att öppna Elementor-redigeraren och sedan dra och släppa formulärwidgeten till den plats där vi vill skapa vårt formulär.

Hur man skapar ett Elementor-formulär

Precis som allt annat i Elementor sker processen att skapa formulär visuellt. Det är inte nödvändigt att använda ett extra plugin, och det är inte heller viktigt att det fungerar som backend för din webbplats.

Att bilda element eller element på ett strukturerat sätt

När ditt formulär är på plats är det första steget att organisera informationen i det. Vilka fält behöver du, och vilka typer av fält bör de vara? Vad letar du efter?

När du arbetar i Elementor-redigeraren läggs formulärfält till och redigeras från fliken Innehåll. Som du kan se iampnedan innehåller formulär några standardfält. Genom att välja Lägg till objekt från rullgardinsmenyn kan du skapa nya fält.

Det är också möjligt att duplicera ett fält genom att välja ikonen som ser ut som två dokument, det ena framför det andra, och klicka på den. 

Typer av fält i ett formulär

Många typer av formulärfält är tillgängliga, allt från enkla textfält till lösenord, ReCaptcha och honeypot-fält.

För att ändra beteendet för ett formulärfält, välj först fältet och sedan typ av rullgardinsmenyn Typ för att se de tillgängliga olika fälttyperna.

Typer av fält i ett Elementor-formulär

Bredd på en formulärkolumn

Den här funktionen låter dig använda två formulärfält på samma rad genom att justera inställningen för kolumnbredd. Ändra fönstrets bredd genom att välja det från rullgardinsmenyn och välja 50 procent. Det är värt att notera att om du gör detta med två formulärfält i följd kommer du att märka att de visas tillsammans på samma rad.

Formulär i Elementor för styling

Stilisera dina formulär i Elementor på samma sätt som du stilar andra widgetar genom att navigera till stilpanelen som finns i Elementors redigeringsgränssnitt.

Själva formuläret, fälten, knapparna, eventuella steg, felmeddelanden och bekräftelsemeddelanden kan alla anpassas.

För de som redan är bekanta med Elementor finns det inte mycket mer de behöver lära sig för att utforma Elementor Forms.

Åtgärder på ett formulär

Efter vår diskussion om att skapa ett formulär i Elementor, låt oss titta på hur man konfigurerar vad som händer efter att formuläret har skickats in. Detta görs genom formuläråtgärder, eller som de kallas i Elementor, Åtgärder efter inlämning.

När ett formulär skickas in är det vanligt att systemet skickar ett e-postmeddelande och omdirigerar användaren till en annan webbsida. Du kan naturligtvis inkludera så många åtgärder du vill i dina formulär och kombinera dem på valfritt sätt. Som du kanske förväntar dig finns det ett specifikt väljarfält utan någon kodning.

Varje åtgärd du lägger till kommer att visas som ett separat flikalternativ i huvudmenyn. Vi har för närvarande ett flikalternativ för E-post, men om jag skulle inkludera en omdirigering i fältet Lägg till åtgärd skulle jag också se Omdirigering i mina flikalternativ, som visas iampnedan.

Avslutningsvis ska jag visa hur man konfigurerar formuläret för att acceptera inlämningar via e-post, den vanligaste frågan om formulär.

När du väljer E-post från fliken Innehåll i redigeraren visas skärmen nedan. Här kan du anpassa e-postmeddelandet och svarsmeddelandet, och du kan också lägga till en kopia eller en hemlig kopia till alla som ska få en kopia av inskickade uppgifter från formuläret.

Skapa en kontaktformulärsmall i Elementor 

Många blir förvånade över att Elementors formulärredigerare är kraftfullare än den verkar vid första anblicken, och en av de mer avancerade funktionerna är möjligheten att anpassa meddelandet för varje formulär.

Det är möjligt att anpassa formulärmeddelandena för att ge en mer personlig feedbackprocess till slutanvändaren som har fyllt i ditt formulär, snarare än att låta som en tråkig robot. Men vilka meddelanden kan du anpassa för ditt Elementor-kontaktformulär är följande:

För att börja måste du först aktivera anpassade meddelanden genom att välja "Ytterligare alternativ" från rullgardinsmenyn och sedan växla omkopplaren för "Anpassade meddelanden" till "Ja"

Anpassning av Elementors kontaktformulärswidget genom att lägga till anpassade meddelanden

Som du kan se finns det fyra olika meddelanden som du kan anpassa, inklusive de som listas nedan:

Ett meddelande om att formuläret har skickats in visas för slutanvändaren efter att formuläret har skickats in och verifierats att det är korrekt ifyllt (t.ex. inga obligatoriska fält saknas osv.).

Felmeddelande — ett meddelande som visas för slutanvändaren när ett okänt fel uppstår när formuläret skickas in.

Obligatoriskt meddelande — visas när ett obligatoriskt formulärfält inte är ifyllt, formuläret har skickats in och formuläret inte är ifyllt.

När något i formuläret som skickas är felaktigt och inte kan skickas visas meddelandet Ogiltigt meddelande för slutanvändaren.

Att kunna redigera meddelandena gör att du kan vara kreativ och originell, eller mer formell och affärsmässig om du driver en företagswebbplats. Det bästa är att de är helt redigerbara, så du kan göra vad du vill!

Slutsats

Med Elementor-formulärwidgeten är det enkelt att skapa ett kontaktformulär. Den levereras med en intuitiv dra-och-släpp-kontaktformulärsbyggare och en mängd anpassningsalternativ som skiljer den från andra pluginsom finns på marknaden. Du kan enkelt anpassa dess stil och färgschema för att matcha ditt företags utseende och känsla. Dessutom ingår olika andra attraktiva widgets, mer än 300+ professionella mallar och en popup-byggare i ett bekvämt paket. Denna fullfjädrade WordPress-sidbyggare består av alla nödvändiga widgets och funktioner, så du behöver inte köpa ytterligare sidbyggare för att anpassa din webbplats ytterligare. Dessutom möjliggör den integration av mer än 30 marknadsföringstjänster, vilket är anledningen till att det är ett av de mest populära pluginpå marknaden idag.

Lämna en kommentar

Din e-postadress kommer inte att publiceras. Obligatoriska fält är markerade med *