Vad du bygger
Ett anmälningsformulär på din egen sajt som skickar adressen vidare till Kit, utan att du behöver klistra in en främmande ruta som förstör formgivningen.
Innan du börjar
- Ett Lovable-projekt med en sida där formuläret ska ligga.
- Ett konto hos Kit, gratisplanen räcker.
- Filen från förra lektionen och dess länk.
Steg för steg
1. Skapa formuläret i Kit
Logga in på Kit och gå till Grow, sedan Landing Pages & Forms. Skapa ett formulär av typen inbäddat. Ge det ett namn du känner igen, till exempel "Checklista besiktning". Spara.
2. Hämta identiteten
Öppna formuläret och titta i adressfältet. Sifferserien i slutet är formulärets identitet. Skriv ner den. Gå sedan till kontoinställningarna, välj Advanced och kopiera nyckeln under API.
3. Lägg in nyckeln i ditt projekt
I Lovable ber du om en hemlighet för nyckeln i stället för att skriva in den i koden. Skriv i chatten att du vill lägga till en hemlighet som heter KIT_API_KEY. Klistra in värdet i rutan som dyker upp.
4. Be Lovable bygga formuläret
Beskriv vad du vill ha: ett fält för e-post, en knapp med texten "Skicka mig checklistan", en kryssruta för samtycke som börjar tom, och en serverfunktion som skickar adressen till Kits formulär med hjälp av nyckeln. Be om att svaret ska visa en kort tackrad i stället för att ladda om sidan.
5. Testa med en riktig adress
Fyll i din egen adress och skicka. Gå till Kit, öppna Subscribers och kontrollera att adressen ligger där med rätt formulär angivet som källa.
6. Hantera fel synligt
Stäng av nätverket i webbläsaren och skicka igen. Formuläret ska visa ett vänligt felmeddelande, inte tystna. Ber du Lovable om det tar det en mening.
Byggloftets tips
- Be aldrig om namn och telefonnummer i första steget. Varje extra fält kostar dig anmälningar.
- Lägg samtyckestexten under knappen, inte ovanför. Den ska synas men inte stjäla uppmärksamheten.
- Spara nyckeln som hemlighet även i testprojekt. Ligger den i koden ligger den snart på nätet.
Vanliga fel
- "Adressen dyker inte upp i Kit": du har oftast använt formulärets namn i stället för dess sifferidentitet i anropet.
- "Det fungerar lokalt men inte publicerat": hemligheten är inte satt i den publicerade miljön. Lägg in den igen.
Du är klar när…
Du har skickat in din egen adress via din sajt och sett den dyka upp bland prenumeranterna i Kit.