Hoe voeg je e-mailvelden toe aan WordPress-formulieren?

E-mail is de levensader van online communicatie. Elk contactformulier, nieuwsbriefaanmelding en registratie vereist een betrouwbare e-mail. e-mailveldMaar een simpel tekstinvoerveld is niet genoeg: je hebt validatie nodig om typefouten te voorkomen, optionele bevestiging om de juistheid te garanderen en een goede opmaak voor bruikbare gegevens. Zo voeg je e-mailvelden toe die goed werken.

Waarom een ​​apart e-mailveld gebruiken?

Problemen met tekstvelden voor e-mail

• Geen formaatvalidatie
• Typfouten blijven onopgemerkt.
• Ongeldige inzendingen worden geaccepteerd.
• Geen e-mailtoetsenbord op mobiel
• Vergeefse vervolgpogingen

Voordelen van e-mailvelden

• Ingebouwde formaatvalidatie
• Voorkomt veelvoorkomende fouten
• E-mailtoetsenbord op mobiele apparaten
• Gestandaardiseerde gegevensverzameling
• Betere leverbaarheid voor vervolgacties

Een e-mailveld toevoegen

Stap 1: Voeg het veld toe

1. Open uw formulier in AFB
2. Find E-mail in veldtypen
3. Sleep dit naar je formulier

Stap 2: Basisinstellingen configureren

• Etiket: “E-mailadres” of “Uw e-mailadres”
• Tijdelijke aanduiding: "[e-mail beveiligd]"
• Vereist: Meestal wel voor contactformulieren.
• Helptekst: Optionele instructies

Stap 3: Opslaan en testen

1. Sla je formulier op
2. Voorbeeldweergave op de frontend
3. Probeer een ongeldig e-mailadres in te dienen
4. Controleer of de validatie werkt.

E-mailvalidatie

Wat wordt gevalideerd?

Controleer of de e-mailvelden de juiste opmaak hebben:

Geldig: ✓ [e-mail beveiligd]
✓ [e-mail beveiligd]
✓ [e-mail beveiligd]

Ongeldig: ✗ userexample.com (ontbrekend @-teken) ✗ [e-mail beveiligd] (domein ontbreekt) ✗ user@example (TLD ontbreekt) ✗ @example.com (gebruikersnaam ontbreekt)

Validatiefoutmeldingen

Standaard: "Voer een geldig e-mailadres in" Aangepast: "Dit lijkt geen e-mailadres. Controleer uw gegevens en probeer het opnieuw."

Wat validatie niet controleert

• Of e-mail überhaupt bestaat.
• Of de mailbox actief is
• Deliverability

Formaatvalidatie controleert de juiste structuur, niet het bestaan ​​ervan.

E-mailbevestigingsveld

Wat is het?

Een tweede e-mailveld waar gebruikers hun adres opnieuw kunnen invoeren. Beide adressen moeten overeenkomen om het pakket te verzenden.

Email: [[e-mail beveiligd]    ] E-mailadres bevestigen: [[e-mail beveiligd]    ] ✓ Wedstrijden

Waarom bevestiging gebruiken?

• Detecteert typefouten (meest voorkomend: verkeerd domein)
• Dwingt gebruikers om alles nog eens te controleren.
• Vermindert mislukte e-mailcommunicatie
• Cruciaal voor belangrijke transacties

Wanneer te gebruiken

• Account registratie
• Aanmeldingen voor nieuwsbrieven
• Bestelbevestigingen
• Elk formulier waarbij de nauwkeurigheid van e-mailadressen cruciaal is.

Wanneer overslaan

• Eenvoudige contactformulieren
• Snelle vragen
• Wanneer het verminderen van wrijving prioriteit heeft

Bevestiging inschakelen

1. Selecteer uw e-mailveld
2. Zoek de optie "Bevestigingsveld".
3. Schakel AAN
4. Het tweede veld verschijnt automatisch.

Bevestigingsgedrag

E-mail: [e-mail beveiligd]
Bevestigen: [e-mail beveiligd]  ← Typfout! Fout: "E-mailadressen komen niet overeen"

Domeinbeperkingen

Wat zijn domeinbeperkingen?

Beperk welke e-maildomeinen worden geaccepteerd:

• Witte lijst: Sta alleen specifieke domeinen toe.
• Zwarte lijst: Blokkeer specifieke domeinen

Gebruiksscenario's voor de whitelist

Accepteer alleen e-mails van bepaalde domeinen:

Toegestaan: @company.com, @company.org Afgewezen: Al het andere Gebruik voor: - Interne bedrijfsformulieren - Werknemersregistratie - Toegang alleen voor de organisatie

Gebruiksscenario's voor de zwarte lijst

Bepaalde domeinen blokkeren:

Geblokkeerd: @mailinator.com, @tempmail.com, @guerrillamail.com Toegestaan: Alle overige adressen Gebruik voor: - Het voorkomen van tijdelijke e-mailadressen - Het verminderen van spam-aanmeldingen - Het garanderen van echte contactadressen

Domeinbeperkingen configureren

1. Selecteer het e-mailveld
2. Zoek de instellingen voor domeinbeperkingen
3. Kies de modus voor witte lijst of zwarte lijst.
4. Voer domeinen in (één per regel)

Voorbeeld: Alleen e-mails van het bedrijf

Modus: Whitelist Domeinen: company.com company.org Fout: "Gebruik uw bedrijfs-e-mailadres"

Voorbeeld: Blokkeer tijdelijke e-mailadressen

Modus: Zwarte lijst Domeinen: mailinator.com tempmail.com guerrillamail.com 10minutemail.com throwaway.email Fout: "Gebruik een permanent e-mailadres"

Configuratievoorbeelden

Voorbeeld 1: Basiscontactformulier

Label: "E-mailadres" Plaatsaanduiding: "[e-mail beveiligd]Vereist: Ja Bevestiging: Nee Domeinbeperkingen: Geen

Voorbeeld 2: Aanmelden voor de nieuwsbrief

Label: "Uw e-mailadres" Plaatsaanduiding: "Voer uw e-mailadres in..." Vereist: Ja Bevestiging: Ja Domeinbeperkingen: Blokkeer tijdelijke e-mailadressen Helptekst: "We zullen uw e-mailadres nooit delen"

Voorbeeld 3: Accountregistratie

Label: "E-mail (dit wordt je gebruikersnaam)" Plaatsaanduiding: "[e-mail beveiligd]"Vereist: Ja Bevestiging: Ja Domeinbeperkingen: Geen Helptekst: "Gebruik een e-mailadres dat u regelmatig controleert"

Voorbeeld 4: Werknemersformulier

Label: "Werk-e-mail" Plaatsaanduiding: "[e-mail beveiligd]Vereist: Ja Bevestiging: Nee Domeinbeperkingen: Alleen company.com op de whitelist Helptekst: "Gebruik uw officiële bedrijfs-e-mailadres"

Voorbeeld 5: Leadgeneratie

Label: "Zakelijk e-mailadres" Plaatsaanduiding: "[e-mail beveiligd]"Vereist: Ja Bevestiging: Nee Domeinbeperkingen: Blokkeer gmail.com, yahoo.com (alleen B2B) Helptekst: "Gebruik uw zakelijke e-mailadres voor zakelijke vragen"

Mobiele optimalisatie

E-mail toetsenbord

E-mailvelden activeren een speciaal mobiel toetsenbord:

• @-symbool gemakkelijk toegankelijk
• .com-sneltoets op veel toetsenborden
• Minder interferentie van autocorrectie
• Snellere toegang

Beste praktijken voor mobiele toepassingen

• Duidelijk leesbaar etiket
• Handige placeholder-tekst
• Voldoende tikdoelgrootte
• Wis foutmeldingen

Veelgemaakte fouten bij het invullen van e-mailvelden

1. Tekst gebruiken in plaats van e-mailtypen

Fout: Rechts:

Het e-mailtype maakt validatie en een mobiel toetsenbord mogelijk.

2. Niet verplicht stellen wanneer nodig

Als u wilt reageren, dient u een e-mailadres te gebruiken.

3. Verwarrende plaatsaanduiding voor label

Fout: Alleen een placeholder, geen label. Juist: Duidelijk label + handige placeholder.

4. Te strenge validatie

Sommige geldige e-mailadressen zien er ongebruikelijk uit:

Geldig maar ongebruikelijk: - [e-mail beveiligd]
- [e-mail beveiligd]
- [e-mail beveiligd]

Verwerp geen geldige formaten.

5. Geen context voor foutmeldingen

Fout: "Ongeldige invoer" Goed: "Voer een geldig e-mailadres in (voorbeeld: [e-mail beveiligd])"

Labels voor e-mailvelden

Goede voorbeelden van etiketten

• "E-mailadres"
• “Uw e-mailadres”
• "E-mail"
• “Werkmail”
• “Contact-e-mail”

Contextspecifieke labels

• “E-mail (voor orderbevestiging)”
• “E-mailadres (waar we je download naartoe sturen)”
• “Bedrijfs-e-mail”
• “Voorkeurs-e-mailadres”

Voorbeelden van plaatsaanduidingen

• "[e-mail beveiligd]"
• “Voer uw e-mailadres in…”
• "[e-mail beveiligd]"
• "[e-mail beveiligd]"

Helptekstideeën

Privacyverzekering

"We zullen uw e-mailadres nooit met iemand delen." "Uw e-mailadres wordt vertrouwelijk behandeld." "Wij respecteren uw privacy."

Gebruiksaanwijzing

"We sturen je bevestiging hierheen." "Waar moeten we de downloadlink naartoe sturen?" "Je ontvangt updates op dit adres."

Formaatrichtlijnen

"Gebruik een geldig e-mailformaat (bijvoorbeeld: [e-mail beveiligd]"Gebruik een e-mailadres dat u regelmatig controleert." "Voer het e-mailadres in dat aan uw account is gekoppeld."

Meerdere e-mailvelden

Wanneer meerdere gebruiken?

• Primair en secundair contact
• Persoonlijke en zakelijke e-mail
• Factuur- en verzendmeldingen

Voorbeeld: Primair/Secundair

Primair e-mailadres: [________________] (verplicht) Secundair e-mailadres: [________________] (optioneel) Helptekst: "Secundair e-mailadres voor back-upcontact"

Voorbeeld: Account + meldingen

Account-e-mailadres: [________________] E-mailadres voor meldingen: [________________] ☐ Zelfde als account-e-mailadres

Inzendingen verwerken

In e-mailmeldingen

De waarden van de e-mailvelden worden in uw melding weergegeven:

Nieuwe inzending via het contactformulier: Naam: John Smith E-mail: [e-mail beveiligd]  ← Klik om te reageren Bericht: ...

Antwoord-naar-configuratie

Stel het e-mailveld in als antwoordadres:

• Door op "Beantwoorden" te klikken, wordt het antwoord naar de inzender gestuurd.
• Eenvoudige vervolgcommunicatie

Bij export

CSV-kolom: E-mailwaarden: [e-mail beveiligd], [e-mail beveiligd], ...

Samenvatting van beste praktijken

Do

• ✓ Gebruik het daarvoor bestemde e-mailveldtype
• ✓ Voeg een transparant label toe
• ✓ Voeg een handige plaatsaanduiding toe
• ✓ Maak het indien nodig aan
• ✓ Gebruik de bevestigingsfunctie voor belangrijke formulieren
• ✓ Voeg privacyvriendelijke helptekst toe
• ✓ Testen op mobiele apparaten

Don't

• ✗ Gebruik het tekstveld voor e-mail
• ✗ Validatie overslaan
• ✗ Gebruik de placeholder alleen als label
• ✗ Te veel beperkingen opleggen aan geldige domeinen
• ✗ Vergeet optimalisatie van het mobiele toetsenbord

Problemen oplossen

Geldig e-mailadres afgewezen

• Controleer de domeinbeperkingsinstellingen.
• Controleer of het e-mailformaat voldoet aan de standaarden.
• Sommige ongebruikelijke TLD's moeten mogelijk getest worden.

Bevestiging komt niet overeen

• Controleer of er nog ruimte over is.
• Hoofdlettergevoeligheid (meestal geen probleem)
• Bij kopiëren en plakken kunnen verborgen tekens worden meegegeven.

Mobiel toetsenbord, geen e-mailtype

• Controleer of het veldtype e-mail wordt gebruikt.
• Sommige browsers/apparaten verschillen.
• Controleer het invoertype in de code.

Inzendingen bevatten ongeldige e-mailadressen.

• Zorg ervoor dat validatie is ingeschakeld.
• Controleer of de client-side validatie werkt.
• Voeg een back-up voor servervalidatie toe.

Samenvatting

E-mailvelden toevoegen aan WordPress-formulieren:

1. E-mailveld toevoegen – Sleep naar het formulier
2. Stel label in – Duidelijk en beschrijvend
3. Plaatsaanduiding toevoegen – Voorbeeld van opmaak
4. Maak de vereiste – Indien nodig voor vervolgonderzoek
5. Bevestiging inschakelen – Voor kritische nauwkeurigheid
6. Stel domeinbeperkingen in. – Indien domeinen beperkt worden
7. Helptekst toevoegen – Privacy- of gebruiksinstructies
8. Grondig testen – Geldig, ongeldig, mobiel

Conclusie

Het e-mailveld is vaak het belangrijkste veld in je formulier: het is de manier waarop je de inzender bereikt. Door een speciaal e-mailveld te gebruiken, zorg je voor een goede validatie, optimalisatie voor mobiele apparaten en datakwaliteit. Voeg een bevestigingsfunctie toe wanneer nauwkeurigheid cruciaal is en overweeg domeinbeperkingen om inzendingen te filteren. Een goed geconfigureerd e-mailveld betekent minder onbestelbare e-mails en betere communicatie.

Auto Form Builder Inclusief een volledig functioneel e-mailveld met ingebouwde validatie, optionele bevestiging en mogelijkheden voor domeinbeperking. Verzamel e-mailadressen met een gerust hart.

Klaar om e-mailvelden toe te voegen? Download Auto Form Builder Begin vandaag nog met het verzamelen van geldige e-mailadressen.