Ditt webbformulär fungerar. Uppföljningen gör det inte. Någon måste fortfarande kopiera svaren till en PDF-mall, dubbelkolla stavningen, ladda ner filen, bifoga den och trycka på skicka. Missar du ett fält är du fast med att göra om hela processen.
Det här är den typen av automatisering av PDF-formulär som räddar marketing ops-team, småföretagare och upptagna personer inom customer success från den värsta sortens adminarbete. Du slutar skriva in samma saker igen. Du slutar tveka. Du börjar svara samma dag.
Det här arbetsflödet gör en inskickning från en landningssida till en ifylld PDF och mejlar den automatiskt. Du får se hur det fungerar, vad du behöver och de vanliga ställena där team brukar snubbla.
Så fungerar automatiseringen
Hela n8n-flödet, från trigger till slutlig output:
n8n Workflow Template: CustomJS + e-post: ifyllda PDF:er från formulär
flowchart LR
subgraph sg0["Flow 1"]
direction LR
n0["<div style='background:#f5f5f5;padding:10px;border-radius:8px;display:inline-block;border:1px solid #e0e0e0'><img src='https://flowpast.com/wp-content/uploads/n8n-workflow-icons/httprequest.dark.svg' width='40' height='40' /></div><br/>HTTP Request"]
n1@{ icon: "mdi:cog", form: "rounded", label: "PDF Form Fill (Fill PDF Fiel..", pos: "b", h: 48 }
n2@{ icon: "mdi:cog", form: "rounded", label: "Get PDF Form Fields", pos: "b", h: 48 }
n3@{ icon: "mdi:message-outline", form: "rounded", label: "Send email", pos: "b", h: 48 }
n4["<div style='background:#f5f5f5;padding:10px;border-radius:8px;display:inline-block;border:1px solid #e0e0e0'><img src='https://flowpast.com/wp-content/uploads/n8n-workflow-icons/webhook.dark.svg' width='40' height='40' /></div><br/>FormData Endpoint"]
n0 --> n1
n0 --> n2
n4 --> n0
n1 --> n3
end
subgraph sg1["Flow 2"]
direction LR
n5["<div style='background:#f5f5f5;padding:10px;border-radius:8px;display:inline-block;border:1px solid #e0e0e0'><img src='https://flowpast.com/wp-content/uploads/n8n-workflow-icons/html.dark.svg' width='40' height='40' /></div><br/>HTML for Landingpage"]
n6["<div style='background:#f5f5f5;padding:10px;border-radius:8px;display:inline-block;border:1px solid #e0e0e0'><img src='https://flowpast.com/wp-content/uploads/n8n-workflow-icons/webhook.dark.svg' width='40' height='40' /></div><br/>Landingpage Endpoint"]
n7["<div style='background:#f5f5f5;padding:10px;border-radius:8px;display:inline-block;border:1px solid #e0e0e0'><img src='https://flowpast.com/wp-content/uploads/n8n-workflow-icons/webhook.dark.svg' width='40' height='40' /></div><br/>Respond to Webhook"]
n8@{ icon: "mdi:swap-vertical", form: "rounded", label: "Set Form Endpoint", pos: "b", h: 48 }
n8 --> n5
n5 --> n7
n6 --> n8
end
%% Styling
classDef trigger fill:#e8f5e9,stroke:#388e3c,stroke-width:2px
classDef ai fill:#e3f2fd,stroke:#1976d2,stroke-width:2px
classDef aiModel fill:#e8eaf6,stroke:#3f51b5,stroke-width:2px
classDef decision fill:#fff8e1,stroke:#f9a825,stroke-width:2px
classDef database fill:#fce4ec,stroke:#c2185b,stroke-width:2px
classDef api fill:#fff3e0,stroke:#e65100,stroke-width:2px
classDef code fill:#f3e5f5,stroke:#7b1fa2,stroke-width:2px
classDef disabled stroke-dasharray: 5 5,opacity: 0.5
class n0,n4,n6,n7 api
classDef customIcon fill:none,stroke:none
class n0,n4,n5,n6,n7 customIcon
Problemet: manuell ifyllning av PDF blir en flaskhals
När ett formulär kommer in börjar ofta ”det riktiga jobbet”: öppna PDF-mallen, hitta rätt fält, klistra in värden från formuläret och hoppas att formateringen inte skapar fel. Sedan sparar du en kopia, döper om den och skickar den till rätt person. Det låter snabbt tills du gör det 10 gånger i rad, med avbrott, och en kollega frågar: ”Skickade vi den uppdaterade versionen?” Tidskostnaden är dålig. Den mentala belastningen är värre. Och misstagen är det kunderna kommer ihåg.
Friktionen byggs på. Här är var det faller isär.
- Att kopiera och klistra in namn, adresser och datum i en PDF-mall tar cirka 10 minuter per ärende när du räknar in kontroll och sparande.
- Små misstag händer på förutsägbara ställen, som att blanda ihop stad- och landfält eller lämna kvar gamla uppgifter i mallen.
- Svarstiden glider från ”samma dag” till ”någon gång den här veckan” när inkorgen blir stressig.
- Ingen fyller i PDF:en på exakt samma sätt, så dina dokument ser inkonsekventa ut även när datan är korrekt.
Lösningen: webhook-till-PDF-ifyllning, sedan mejlutskick
Det här n8n-arbetsflödet serverar en enkel landningssida med ett formulär, tar emot inskickningen och förvandlar de inskickade fälten till en ifylld PDF automatiskt. Det börjar med en landningsside-webhook som visar HTML för besökare, och injicerar sedan rätt endpoint för formulärinskick så att du slipper hårdkoda URL:er. När användaren skickar in formuläret samlar en andra webhook in datan som JSON. n8n hämtar därefter din PDF-mall från en URL, fyller formulärfälten med CustomJS-noden PDF Toolkit och skickar den färdiga PDF:en som en mejlbilaga. Valfritt kan flödet först läsa ut PDF:ens fältnamn, vilket är praktiskt när du inte skapat mallen själv eller tar över ett stökigt upplägg.
Arbetsflödet startar i webbläsaren, men det tunga jobbet sker efter inskick. Datan kommer in, PDF-mallen hämtas, fälten fylls i och mottagaren får ett färdigt dokument i inkorgen. Inga nedladdningar. Ingen omskrivning.
Vad du får: automatisering vs. resultat
| Vad det här arbetsflödet automatiserar | Resultat du får |
|---|---|
|
|
Exempel: så här ser det ut i praktiken
Säg att ditt team får 20 formulärinskick i veckan för en PDF som ”begär offert” eller ”ny kundintagning”. Manuellt tar det kanske 10 minuter per inskick att fylla i mallen och skicka mejlet, alltså ungefär 3 timmar i veckan av ren administration. Med det här flödet blir ”arbetet” att hantera enstaka specialfall: en minut för att kasta ett öga på inkorgen, sedan hämtar n8n mallen, fyller den och mejlar iväg den i bakgrunden. Du får tillbaka merparten av de där 3 timmarna, och svaren går ut konsekvent.
Det här behöver du
- n8n-instans (prova n8n Cloud gratis)
- Alternativ för egen hosting om du föredrar det (Hostinger fungerar bra)
- CustomJS PDF Toolkit-node för att fylla PDF-formulärfält.
- E-postkonto (SMTP) för att skicka PDF-bilagor pålitligt.
- CustomJS API-nyckel (hämta den från din profilsida i CustomJS).
Kunskapsnivå: Medel. Du är bekväm med att redigera lite HTML, mappa fält och klistra in uppgifter i n8n.
Vill du inte sätta upp detta själv? Prata med en automatiseringsexpert (gratis 15-minuters konsultation).
Så fungerar det
En landningssida serveras från n8n. Den första webhooken fungerar som en liten webbserver: den returnerar ett HTML-formulär så att användare kan skicka in uppgifter (namn, adress, stad, land och liknande fält).
Formuläret pekar på rätt inskicknings-URL. n8n lägger in rätt endpoint i HTML:en (så att du inte råkar skicka till en gammal URL efter att du duplicerat flödet).
Inskicksdata kommer in som strukturerad JSON. Den andra webhooken tar emot formulärsvaret, och sedan hämtar en HTTP Request-node din PDF-mall från en länk du kontrollerar.
PDF:en fylls i och mejlas iväg. CustomJS fyller PDF-formulärfälten, och noden Send Email levererar den färdiga PDF:en som bilaga till vald mottagare.
Du kan enkelt ändra fälten på landningssidan så att de matchar din PDF-mall, eller byta URL till PDF-mallen när du uppdaterar dokumentet. Se hela implementationsguiden nedan för alternativ för anpassning.
Steg-för-steg-guide för implementering
Steg 1: konfigurera webhook-triggern
Sätt upp endpointen för den publika landningssidan och returnera HTML-formuläret till webbläsaren.
- Lägg till noden Landing Page Webhook och ställ in Path till
[YOUR_ID]. - Ställ in Response Mode till
responseNodeså att svaret kommer från Return Webhook Reply. - I Assign Form URL, lägg till en tilldelning med Name inställt på
FormEndpointoch Value inställt på={{ $json.webhookUrl }}. - I Landing Page HTML, behåll den medföljande HTML-koden och bekräfta att JavaScript:et postar till
{{ $json.FormEndpoint }}i fetch-anropet. - I Return Webhook Reply, ställ in Respond With till
textoch Response Body till={{ $json.html }}.
Steg 2: konfigurera webhook för formulärinskick och hämtning av PDF
Ta emot postade formulärdata och hämta PDF-mallen som ska fyllas i.
- Lägg till noden Form Data Webhook och ställ in Path till
[YOUR_ID]och HTTP Method tillPOST. - Koppla Form Data Webhook till External PDF Fetch.
- I External PDF Fetch, ställ in URL till
https://community.adobe.com/havfw69955/attachments/havfw69955/acrobat-reader/109709/1/EDIT%20OoPdfFormExample.pdf.
External PDF Fetch skickar utdata till både Populate PDF Fields och Retrieve PDF Field Names parallellt.
Steg 3: sätt upp noderna för PDF-bearbetning
Mappa formulärvärden till PDF-fälten och läs vid behov fältnamn för felsökning eller verifiering.
- Öppna Populate PDF Fields och mappa fält med uttryck som
={{ $json.body.firstName }},={{ $json.body.lastName }}och={{ $json.body.address }}. - Bekräfta att ytterligare fältmappningar som
={{ $json.body.houseNo }},={{ $json.body.postalCode }},={{ $json.body.city }}och={{ $json.body.country }}matchar PDF:ens fältnamn. - Credential Required: Anslut era customJsApi-credentials i Populate PDF Fields.
- I Retrieve PDF Field Names, behåll parametrarna som de är för att lista alla fältnamn från mallen.
- Credential Required: Anslut era customJsApi-credentials i Retrieve PDF Field Names.
Steg 4: konfigurera e-postleverans
E-posta den ifyllda PDF:en till mottagaren.
- Koppla Populate PDF Fields till Dispatch Email Notice.
- I Dispatch Email Notice, ställ in To Email och From Email till
[YOUR_EMAIL]. - Ställ in Subject till
Filled PDF Formoch Text tillHello, Here is the completed PDF form. Best Team. - Säkerställ att Attachments är aktiverat via Options med
dataså att den ifyllda PDF:en bifogas. - Credential Required: Anslut era smtp-credentials i Dispatch Email Notice.
Steg 5: testa och aktivera ert workflow
Validera landningssidan, formulärinskick, PDF-generering och e-postleverans från start till mål.
- Klicka på Test Workflow och öppna test-URL:en för Landing Page Webhook i en webbläsare.
- Skicka in formuläret och verifiera att Form Data Webhook tar emot JSON-payloaden och triggar External PDF Fetch.
- Bekräfta att Populate PDF Fields slutförs och att Dispatch Email Notice skickar ett e-postmeddelande med PDF-bilagan.
- När allt fungerar, växla workflowet till Active för produktionsanvändning.
Vanliga fallgropar
- CustomJS-inloggningsuppgifter kan löpa ut eller kräva specifika behörigheter. Om det slutar fungera, kontrollera först CustomJS-uppgifterna i n8n och bekräfta sedan att API-nyckeln fortfarande är giltig i din CustomJS-profil.
- Om du använder Wait-noder eller extern rendering varierar behandlingstiderna. Öka väntetiden om efterföljande noder misslyckas på grund av tomma svar.
- Standardprompter i AI-noder är generiska. Lägg in er tonalitet tidigt, annars kommer du att redigera output i all evighet.
Vanliga frågor
Cirka 30 minuter om din PDF-mall och dina SMTP-uppgifter är klara.
Nej. Du redigerar lite HTML-text och mappar fält, men du skriver ingen ”riktig kod”.
Ja. n8n har ett gratis alternativ för egen hosting och en gratis provperiod på n8n Cloud. Cloud-planer börjar på 20 USD/månad för högre volym. Du behöver också räkna in kostnader för CustomJS API-användning från din CustomJS-plan.
Två alternativ: n8n Cloud (hanterat, enklast att komma igång) eller egen hosting på en VPS. För egen hosting är Hostinger VPS prisvärd och hanterar n8n bra. Egen hosting ger obegränsat antal körningar men kräver grundläggande serveradministration.
Ja, men du bör validera e-postfältet först. I noden Send Email byter du den statiska ”Till”-adressen mot det inskickade e-postvärdet från webhooken Form Data. Vanliga anpassningar är att lägga till kontroller för obligatoriska fält med en If-node, ändra URL:en till PDF-mallen för olika dokumenttyper och skriva en rad till Google Sheets eller Airtable för uppföljning.
Oftast beror det på en ogiltig eller utgången API-nyckel som sparats i dina n8n-uppgifter. Skapa en ny nyckel i din CustomJS-profil, uppdatera uppgiften i n8n och kör sedan ett testinskick igen. Om det fortfarande misslyckas, kontrollera om din plan tillåter de PDF Toolkit-anrop du gör och bekräfta att noden är installerad (community-noder fungerar bara på egenhostad n8n).
Det beror på din hosting och dina API-gränser. På n8n Cloud är dina månadsvisa körningar kopplade till din plan, så formulär med hög volym kan kräva en högre nivå. Om du kör egen hosting finns ingen gräns för antal körningar, men din server och din SMTP-leverantör har fortfarande kapacitetsbegränsningar. I praktiken kör de flesta små team hundratals inskick i veckan utan att behöva tänka på det.
Ofta, ja. Den stora anledningen är CustomJS PDF Toolkit-noden: du kan hålla hela kedjan ”hämta mall → fyll PDF → skicka mejl” på ett ställe utan krångliga workaround-lösningar. n8n är också mer flexibelt när du behöver förgrenad logik, validering eller valfria steg som att läsa PDF-fältnamn först. Zapier eller Make kan däremot vara enklare för grundläggande ”formulär till mejl”-flöden. Om du är osäker, prata med en automatiseringsexpert och beskriv din exakta dokumentprocess.
När det här är live blir formulärinskick automatiskt färdiga dokument, vilket är så det borde ha varit hela tiden. Sätt upp det en gång och låt sedan n8n ta hand om de repetitiva delarna.
Kontakta oss
Hör av dig, så diskuterar vi hur just din verksamhet kan dra nytta av alla fantastiska möjligheter som AI skapar.