Skapa och redigera formulär med hjälp av den nya formulärredigeraren (BETA)

Skapa och använd formulär med den nya formulärredigeraren för att samla in information om dina besökare och lagra den i ditt HubSpot CRM. När du använder den nya formulärredigeraren kan du skapa formulär i flera steg. Sedan kan du utforma formuläret så att det återspeglar ditt företags identitet och varumärke.

När du har skapat ditt formulär kan du lägga till det på dina HubSpot-sidor med hjälp av HubSpot-formulärmodulen, på en extern webbplats med hjälp av formulärets inbäddningskod eller dela det som en fristående sida med en delningslänk.

Skapa ett nytt formulär

Så här skapar du ett nytt formulär:

• Klicka på Skapa formulär längst upp till höger.
• Om du vill koppla formuläret till en affärsenhet klickar du på rullgardinsmenyn Välj en affärsenhet och väljer den affärsenhet som du vill koppla formuläret till.
• Välj din New Form Editor.
• Klicka på Nästa längst upp till höger.
• Klicka på pennikonen edit högst upp för att redigera formulärnamnet. Du måste publicera formul äret för att tillämpa namnändringen.

Lägga till och redigera formulärfält

Lägg till formulärfält för att samla in information från dina webbplatsbesökare och kontakter. Varje formulärfält måste vara kopplat till en HubSpot-egenskap. Så här lägger du till ett formulärfält:

• I ditt HubSpot-konto navigerar du till Marknadsföring > Lead Capture > Formulär.
• Skapa ett nytt formul är eller håll muspekaren över ett befintligt formulär och klicka på Redigera .
• Klicka på + plus-ikonen längst upp till vänster.
• I den vänstra panelen klickar du på fälttypen och drar den till formulärförhandsgranskningen till höger för att inkludera dem i ditt formulär. Fält kan placeras ovanför, under eller bredvid andra fält.
• I den högra panelen klickar du på och anger fältetiketten. När du anger fältetiketten visas en lista med liknande befintliga egenskaper.
  • I dialogrutan Koppla fältet till en egenskap klickar du på en föreslagen egenskap.
  • Om du vill koppla ditt formulärfält till en annan egenskap klickar du på Sök egenskaper.

• Om du vill lägga till en ansluten egenskap klickar du på i den vänstra panelen för att expandera avsnittet Ansluten egenskap. Klicka på den egenskap som du vill ansluta till formulärfältet.
• Om du vill använda en befintlig egenskap som en ansluten egenskap med ett fält på ditt formulär använder du sökfältet för att söka efter en befintlig egenskap. Objekttypen för det tillagda fältet kan avgöra om formulärinlämningen visas på aktivitetstidslinjen för associerade poster.

• Om du vill skapa en ny egenskap och använda den som en kopplad egenskap till ett fält i formuläret klickar du på Create new.
  • Välj typ av formulärfält.
  • Konfigurera formulärfältet i den högra panelen.
  • Granska dina egenskapsregler och klicka sedan på Skapa. Som standard är alternativet Visa i formulär, popup-formulär och botar markerat . När du har skapat den nya egenskapen associeras den automatiskt med formulärfältet. Lär dig hur du hanterar dina egenskaper.

• När du har lagt till ditt formulärfält kan du redigera ett fälts alternativ:
  • Klicka på fältet i förhandsgranskningen av formuläret i den högra panelen.. 
  • Klicka på i den vänstra panelen för att expandera avsnittet Fältalternativ. Alternativen här kan variera beroende på fältets egenskapstyp, läs mer om de ytterligare alternativ för fältanpassning som finns tillgängliga.
    
    • Hjälptext: informationstext under fältets etikett som hjälper besökaren att fylla i fältet.
    • Platshållartext: text som visas i inmatningsrutan för fältet. Texten försvinner när besökaren skriver in ett värde i fältet och kommer inte att visas i inlämningen, även om fältet lämnas tomt.
    • Standardvärde: ett värde som kommer att skickas in för fältet som standard om det inte ändras av besökaren.
    • Dolt fält: när det här alternativet är aktiverat kommer fältet att få sitt värde angivet genom formulärinlämningen, men fältet kommer inte att visas för besökaren. När inställningen är aktiverad anger du det standardvärde som kommer att överföras till egenskapen när formuläret skickas in.
    • Obligatoriskt fält: när det här alternativet är aktiverat måste fältet fyllas i för att formuläret ska skickas in. Om ett formulärfält har ställts in som obligatoriskt kan det inte ställas in som dolt.

Lägga till ytterligare formulärelement

Lägg till ytterligare Text & Media eller Säkerhet & Sekretess i ditt formulär. På samma sätt som formulärfält kan dessa element placeras ovanför, under eller bredvid andra fält. Under betaversionen är det inte säkert att vissa element är tillgängliga för användning.

• Skapa ett nytt formul är eller håll muspekaren över ett befintligt formulär och klicka på Redigera .
• Klicka på + plus-symbolen längst upp till vänster.
• Klicka på Övrigt i den vänstra panelen.
• Klicka och dra elementen till formulärets förhandsgranskning till höger för att inkludera dem i ditt formulär.
  
  
  

Lägga till villkorlig logik i formulär (endastContent Hub eller Marketing Hub Professional och Enterprise )

När du har lagt till dina formulärfält kan du ställa in villkorlig logik för att dölja eller visa relevanta fält, eller omdirigera besökare till andra HubSpot-sidor baserat på deras tidigare svar.

För varje formulär kan du lägga till upp till 30 regler med 10 villkor per regel.

För att ställa in villkorlig logik på ditt formulär:

• Skapa ett nytt formul är eller håll muspekaren över ett befintligt formulär och klicka på Redigera .
• Klicka på logikikonen githubBranch längst upp till vänster.
• Klicka på Add logic i den vänstra panelen.
• I avsnittet Logik konfigurerar du dina villkorliga logikregler. Om du t.ex. filtrerar efter City och väljer is any of Dublin kommer den villkorliga logikregeln endast att gälla poster med värdet Dublin.
  
• Om du vill ta bort ett filter klickar du på ikonen deletee delete.
• Om du vill klona ett filter klickar du på ikonenduplicate clone.
• Om du vill lägga till ytterligare filter i regeln klickar du på add Lägg till filter i den här gruppen.
• Om du vill lägga till ytterligare en grupp i regeln klickar du på add Lägg till grupp.
• Om du har lagt till flera filter eller grupper i regeln klickar du på rullgardinsmenyn AND OR mellan filtren och grupperna för att tillämpa AND- eller OR-logik:
  • AND: Alla filter i regeln måste vara sanna för att regeln ska utlösas.
  • OR: Endast ett filter i gruppen måste vara sant för att regeln ska utlösas. Läs mer om AND- eller OR-logik.

• I avsnittet Then klickar du på rullgardinsmenyn för att välja åtgärder i formuläret. Du kan välja mellan följande:
  • Visa ett fält: om användarens svar matchar de kriterier som anges i dina regler, visa ett specifikt fält.
  • Dölj ett fält: om användarens svar motsvarar de kriterier som anges i dina regler, visa ett specifikt fält.
  • Hoppa till steg: om användarens svar motsvarar de kriterier som anges i dina regler, hoppa till ett visst steg. Om du vill använda det här alternativet måste formuläret ha minst tre steg. Läs mer om hur du lägger till formulärsteg.
  • Omdirigera till: om användarens svar matchar de kriterier som anges i dina regler, omdirigera dem till en HubSpot-sida eller en extern URL. Användare med ett Sales Hub Enterprise- eller Service Hub Enterprise-konto kan omdirigera formulär till en möteslänk på en schemaläggningssida.

• Fyll i de obligatoriska fälten beroende på vilken åtgärd du har valt.
• För att tillämpa den villkorliga logiken klickar du på Spara och aktivera.

Hantera regler för villkorlig logik

• Skapa ett nytt formul är eller håll muspekaren över ett befintligt formulär och klicka på Redigera .
• Klicka på logikikonen githubBranch längst upp till vänster.
• Om du vill lägga till en ny regel klickar du på Lägg till logik.
• Om du vill redigera en regel klickar du på rullgardinsmenyn Åtgärder och väljer Redigera.
• Om du vill ta bort en regel klickar du på rullgardinsmenyn Åtgärder och väljer Ta bort.

Lägga till och redigera formulärsteg

Observera: den här funktionen är endast tillgänglig för Marketing Hub, Sales Hub eller Service Hub Starter, Professional och Enterprise eller Content Hub Enterprise.

Skapa flerstegsformulär för att uppmuntra användare att fylla i flera formulärsegment i stället för ett enda långt formulär. Så här lägger du till ett formulärsteg i ett flerstegsformulär:

• I ditt HubSpot-konto navigerar du till Marknadsföring > Lead Capture > Formulär.
• Skapa ett nytt formul är eller håll muspekaren över ett befintligt formulär och klicka på Redigera .
• I den högra panelen håller du muspekaren över två befintliga steg och klickar på ikonen + add. En ny stegsektion visas. Sedan kan du ställa in formulärfält och ytterligare formulärelement i stegpanelen.
  

• Om du vill ändra ordningen på ett steg håller du muspekaren över steget. Klicka och dra sedan på Step [x] längst upp till vänster om steget för att flytta det.
• Om du vill ta bort ett steg håller du muspekaren över steget och klickar påikonen delete delete.
• En förloppsindikator visar visuellt hur stor del av formuläret som användaren har fyllt i, vilket förbättrar ifyllnadsgraden. Så här redigerar du förloppsindikatorn:
  • Håll muspekaren över förloppsindikatorn och klicka påpennikonen edit .

• • I den vänstra panelen kan du redigera förloppsindikatorn och slå på eller av den:

• • • Förloppsindikatorn läggs till i alla formulär som standard. Om du vill stänga av förloppsindikatorn växlar du till knappen Progress bar off. Detta tar bort förloppsindikatorn från alla formulärsteg.
    • I avsnittet Format väljer du hur du vill att texten ska visas i förloppsindikatorn. Du kan välja mellan följande alternativ: Visa procentandel vid slutförande, Visa antal steg eller Visa ingen text.

Redigera steglayouten och bakgrundsbannern

Välj bland fördefinierade steglayouter med hjälp av den snabba layoutväxlaren och anpassa formulärets bakgrundsbanner.

• Skapa ett nytt formul är eller håll muspekaren över ett befintligt formulär och klicka på Redigera .
• Håll muspekaren över formulärsteget och klicka på pennikonen edit längst upp till höger.
• I den vänstra panelen väljer du en steglayout.
• Om du vill ta bort layouten klickar du på Ta bort layout uppe till höger.

• Klicka på Banner background för att expandera avsnittet:
  
  • Slå på knappen Bakgrundsfärg för att anpassa formulärets bakgrundsbanner.

• • Välj en färg och opacitet.
  • Klicka på rullgardinsmenyn Gradient för att lägga till en gradient.
  • Använd en bild som bakgrund för bannern. Du kan ladda upp en bild från dina HubSpot-filer, bläddra bland bilder från din dators hårddisk eller använda AI-assistenter för att generera bilder.

Styla ditt formulär

Anpassa text, inmatningsfält, knappar och bakgrund för formuläret och formulärstegen. De stilalternativ som konfigureras på fliken Global styling tillämpas på alla formulärsteg. Du kan inte styla enskilda formulärsteg separat.

För att utforma ditt formulär:

• .
• Skapa ett nytt formul är eller håll muspekaren över ett befintligt formulär och klicka på Redigera .
• Klicka på stilikonen längst upp till vänster.

• När du anpassar text, inmatningsfält eller knappar kan du välja bland befintliga stilar med hjälp av Quick field input styles. Alternativt kan du manuellt anpassa stilen för varje komponent i ditt formulär:
  • Text: Anpassa teckensnitt, teckenstorlek och färg för rubrik och brödtext. Du kan välja att lägga till en skugga i rubriktexten eller en markering i brödtexten.

• • Inmatningsfält: anpassa fältet, inklusive bakgrund och kanter. Du kan också anpassa teckensnitt, teckenstorlek och färger för dina etiketter, liksom färgerna för din hjälptext, platshållare och feltext.
  • Knapp: Anpassa knappens höjd, hörnavrundning, bakgrund, gradient och lägg till en droppskugga till knappen. Du kan också anpassa teckensnitt, teckenstorlek och färg för knapptexten.
  • Bakgrund: anpassa bakgrunden för ditt formulär och dina formulärsteg. Du kan välja att ange en bakgrundsfärg eller använda en bild som bakgrund. Du kan använda AI-assistenter för att generera bilder. Du kan också välja att ange en kant för ditt formulär.

Anpassa formulärets inställningar

Konfigurera formulärets inställningar, inklusive vad som händer med motsvarande kontakt efter att ett formulär har skickats in, inställningar för användarnotiser och formulärets standardspråk. Du kan ställa in kontaktens marknadsföringsstatus, livscykelstadium med mera. Vissa alternativ kanske inte visas beroende på din HubSpot-prenumeration.

• Skapa ett nytt formul är eller håll muspekaren över ett befintligt formulär och klicka på Redigera .
• I den vänstra panelen klickar du på ikonen settings settings.
• På fliken Allmänt kan du konfigurera följande allmänna formulärinställningar:
  
  • Skapa alltid kontakt från okänd e-postadress: Välj det här alternativet för att skapa en ny kontaktpost för varje inskickad ansökan med en unik e-postadress. Om den e-postadress som skickas in matchar en befintlig kontaktpost i din databas kommer uppgifterna i den befintliga posten att uppdateras.
    • Om det här alternativet är avstängt kommer HubSpot först att försöka associera inlagan med en befintlig kontakt med den inskickade e-postadressen. Om det inte finns någon kontakt på den e-postadressen kommer HubSpot att känna igen och uppdatera dina kontakter baserat på kakorna i deras webbläsare. Detta kan leda till att kontakter skrivs över om samma formulär skickas in flera gånger från samma enhet.
    • Om det här alternativet är aktiverat, när en kontakt skickar in formuläret med ett annat e-postmeddelande i en webbläsare där det redan finns en cookie, kommer inte visningar att spåras för den här kontakten. Alternativet Förfylla kontaktfält med kända värden inaktiveras också automatiskt.
  • Ange kontakter som skapats som marknadsföringskontakter: Om ditt HubSpot-konto har tillgång till marknadsföringskontakter kan du automatiskt ange alla kontakter som har skickat in formuläret som marknadsföringskontakter. Detta inkluderar både nya och befintliga kontakter.
  • Fyll i fält för återkommande besökare: om en kontakt tidigare har besökt din webbplats och skickat in ett formulär, och HubSpot kunde lagra och spåra deras cookies, kan alla kända fältvärden fyllas i på formuläret. Det här alternativet är aktiverat som standard, läs mer om förifyllda formulärfält.
    
  • Lägg till i marknadsföringskampanj: om du har en Marketing Hub Professional eller Enterprise-prenumeration kan du associera formuläret med en kampanj:
    • Om du vill koppla formuläret till en befintlig kampanj klickar du på rullgardinsmenyn Kampanj och väljer en kampanj.
    • Om du vill koppla formuläret till en ny kampanj klickar du på rullgardinsmenyn Kampanj och sedan på Skapa kampanj. Fortsätt sedan att konfigurera din kampanj.

• • Uppdatera kontaktens och företagets livscykelstadium vid inlämning: klicka på rullgardinsmenyn Set lifecycle state to och välj ett livscykelstadium . Närbesökare skickar in formuläret kommer alla nya eller befintliga poster att ställas in på det valda livscykelstadiet.
    • Du kan inte flytta en posts livscykelstadium bakåt. Om en befintlig kontakt eller ett företag med ett senare livscykelstadium skickar in ett formulär uppdateras inte livscykelstadiet.
    • Det livscykelstadium som anges i ett formulär kommer att skriva över det standardlivscykelstadium som konfigurerats i dina HubSpot-inställningar.

• Om du vill anpassa inställningarna för inlämning klickar du påfliken Inställningar för inlämning i den vänstra panelen. Anpassa följande inställningar för inlämning av formulär:

  • E-postmeddelanden till besökare: markera kryssrutan Skicka e-postmeddelanden om inlämning till kontaktens ägare för att automatiskt skicka ett meddelande till kontaktens ägare. Om en kontakt inte har någon ägare skickas inga aviseringar. Läs mer om objektägande i HubSpot.

  • E-postmeddelanden om inlämning: klicka pårullgardinsmenyn Skicka e-postmeddelanden om inlämning till för att välja standardteam eller personer som ska skicka e-postmeddelanden om inlämning till, oavsett kontaktens ägare. Mottagare som anges här skrivs över av mottagare som anges i formuläralternativen på HubSpot-sidor.

• För att anpassa formulärets språkinställningar klickar du på fliken Lanugage & Region. Klicka på rullgardinsmenyn Primärt språk och välj sedan ett standardspråk för formuläret. Felmeddelanden, etiketter för standardegenskaper, hjälptext, platshållartext och standardvärden översätts till det här språket.
• För att skapa en AI-översättning av ditt formulär (endastMarketing Hub eller Content Hub Professional och Enterprise ):
  • Slå på knappen Aktiverade AI-översättningar för allt formulärinnehåll AI.
  • I rullgardinsmenyn Primary language väljer du det språk som du vill översätta formuläret till. Felmeddelanden, etiketter för standardegenskaper, hjälptext, platshållartext, standardvärden, anpassade etiketter, rik text och samtyckestext översätts automatiskt till det här språket.
  • Om du har uppdaterat formuläret sedan den förra översättningen klickar du på Retranslate now för att uppdatera översättningen.

Hantera validering i realtid för formulärfält

Om du har ställt in valideringsregler för en fastighet kommer dessa regler att gälla för formulärfält, och besökare måste uppfylla dessa krav för att skicka in formuläret. Livevalidering av formulärfält ger besökarna omedelbar feedback på deras inmatning, vilket gör det lättare att korrigera fel och fylla i formulären korrekt.

Om du t.ex. har ställt in en valideringsregel för egenskapen Ordernummer så att den endast innehåller numeriska värden, får besökarna feedback så att de kan korrigera icke-numeriska poster.

Som standard är livevalidering på formulär aktiverad. Så här slår du på/av livevalidering på formulärfält:

• Navigera till Marknadsföring > Formulär i menyn i vänster sidofält.

• Klicka på fliken Inställningar för inlämning.
• Aktivera/avaktivera alternativet Aktivera direktvalidering av formulärfält.
• Klicka på Spara längst ned till vänster.

Publicera eller dela ditt formulär

När du har skapat ett nytt formulär eller gjort dina formuläruppdateringar publicerar du ditt formulär för att göra ändringarna live. Lägg sedan till det i ditt HubSpot-innehåll, använd formulärets inbäddningskod för att lägga till det på en extern sida, eller dela det som en fristående sida med en delningslänk.

• I ditt HubSpot-konto navigerar du till Marknadsföring > Lead Capture > Formulär.
• Skapa ett nytt formul är eller håll muspekaren över ett befintligt formulär och klicka på Redigera .
• Klicka på Publicera längst upp till höger för att publicera dina formuläruppdateringar.
• För att bädda in ditt formulär på en HubSpot-sida, navigera till ditt innehåll , lägg sedan till formulärmodulen och välj formuläret.
• Om du vill dela ditt formulär eller bädda in det på en extern webbplats klickar du på Dela längst upp till höger och väljer sedan bland följande alternativ:
  • Hämta inbäddningskod: använd en inbäddning för att lägga till ditt formulär på en externt hostad sida. För att spåra analyser för ditt formulär på en extern sida måste din HubSpot-spårningskod installeras på sidan. Läs mer om hur du lägger till ett HubSpot-formulär på en extern webbplats.
    • Längst ner på sidan klickar du på Kopiera.
    • Klistra in inbäddningskoden i HTML-modulen på din sida.
  • Kopiera en delningslänk: använd en URL för att dela formuläret som en fristående sida.

• • • Klicka på Kopiera för att kopiera formulärsidans URL till ditt urklipp.
    • I webbläsaren öppnar du ett nytt fönster eller en ny flik och klistrar in formulärsidans URL i adressfältet för att ladda den. Du kan också dela formulärsidans URL direkt med andra för att ge dem tillgång till formuläret.