Les 2 van 5
Les 2: Veldtypen en formulierinstellingen
Gravity Forms heeft tientallen veldtypen. Elke veld heeft eigen instellingen die je via het tandwiel-icoon bereikt als je op het veld klikt. In deze les lopen we de meest gebruikte typen door.
Standaard velden
- Tekst (enkelvoudig) â voor korte antwoorden zoals naam, bedrijf, onderwerp
- Paragraaf tekst â voor langere antwoorden zoals een bericht of omschrijving
- Dropdown â laat de gebruiker ÊÊn optie kiezen uit een lijst
- Selectievakjes (checkboxes) â meerdere opties aanselecteren
- Keuzerondjes (radio buttons) â ÊÊn optie uit een lijst kiezen
- Datum â met ingebouwde datumkiezer
- Tijd â uur- en minutenveld
- Bestandsupload â klanten kunnen bestanden bijvoegen (PDF, afbeelding)
- Handtekening â digitale handtekening in een tekenveld (Premium add-on)
Geavanceerde velden
- Naam â gecombineerd veld voor voor- en achternaam, met optionele tussenvoegsel
- E-mailadres â met ingebouwde formatvalidatie
- Adres â compleet adresveld met straat, postcode, stad en land
- Website â URL-veld met formatvalidatie
- Prijsveld â voor formulieren met betalingen
- Berekening â vul automatisch een waarde in op basis van andere velden
Veldinstellingen die je altijd controleert
Klik op een veld en bekijk de instellingen in de rechterzijbalk:
- Label: De zichtbare naam boven het veld
- Placeholder: De grijze voorbeeldtekst in het veld
- Verplicht: Of het veld ingevuld moet zijn voor verzenden
- Foutmelding: De tekst die verschijnt als het veld niet correct is ingevuld
- CSS-klassen: Voeg eigen CSS-klassen toe voor stijling
- Veld-ID: Het ID dat je gebruikt in merge-tags (bijv.
{Naam:1})
Meerstapsformulieren
Voor lange formulieren gebruik je secties. Voeg een Paginaeinde-veld toe om het formulier op te splitsen in stappen. Gravity Forms toont automatisch een voortgangsbalk en “Vorige/Volgende” knoppen. Ideaal voor offerteformulieren of uitgebreide aanvragen.
Opdracht
Bouw een offerteformulier in twee stappen. Stap 1: contactgegevens (naam, e-mail, telefoon). Stap 2: projectdetails (type project als dropdown, budget als keuzerondjes, omschrijving als paragraafveld). Gebruik een paginaeinde-veld tussen de twee stappen.