contact form 7

Contact form 7 – Een formulier maken in 9 stappen

Introductie

Een stappenplan hoe je een formulier aanmaakt met de Contact Form 7 plugin (CF7)

1 Contact Form 7 (CF7) downloaden, installeren en activeren

- Login op je WordPress site en ga naar "Plugins > Nieuwe Plugin"
- Zoek rechts bovenin op de plugin-naam "Contact Form 7" en je krijgt een overzicht met resultaten
- Klik bij het eerste resultaat naast de titel op de knop "nu installeren" en vervolgens op de knop "activeren"
- Zodra de plugin is geactiveerd wordt je doorgestuurd naar je plugin overzicht pagina en kan je aan de slag!

2 Een formulier aanmaken of aanpassen

- Ga naar "Contact > Nieuwe toevoegen" om een nieuw formulier aan te maken.
- Om een bestaand formulier aan te passen ga je naar "Contact > Contact formulieren" en krijg je een overzicht te zien van de formulieren die zijn gemaakt. Je kan een bestaand formulier wijzigen door onder de titel van het formulier op "bewerken" te klikken.
- Zodra je dit doet zie je in het volgende scherm de formulieren editor met bovenin vier tabjes: formulier, mail, berichten en aanvullende instellingen.

3 De formulier tab

- Voer in deze tab een titel voor je formulier in
- In het tekst veld worden standaard een aantal invoer velden toegevoegd, deze herken je doordat er 'haakjes' om de tekst heen staan. Bijvoorbeeld:
[text* your-name] voor een enkele lijn tekst
[email* your-email] voor een veld waar gebruikers een geldig email adres moeten invoeren
[textarea your-message] voor een tekst vlak waar gebruikers een langer bericht in kunnen typen
[submit "Verzenden"] een knop om het formulier te kunnen verzenden
ps. een * geeft aan of een invoer veld verplicht is.
- Pas de labels van de velden naar wens aan. Let wel op dat je het eerste woord tussen de 'haakjes' laat staan (hierboven in het lijstje vet gedrukt) anders wordt het invoer-veld niet getoond.

4 De mail tab

In de mail tab kan je de mail die wordt verstuurd nadat de gebruiker op 'verzenden' heeft geklikt instellen:
- Naar wie gaat de email
- Van wie komt de email
- Het onderwerp van de mail
- Aanvullende koppen
- Inhoud van de mail
- bestand bijlages toevoegen

5 De berichten tab

In de "berichten" tab kan je alle (fout-)meldingen die aan de gebruiker worden getoond wijzigen. Bijvoorbeeld als een verplicht veld niet is ingevuld wordt de melding "Het veld is verplicht" getoond.

6 De aanvullende instellingen tab

CF7 beschikt over aanvullende instellingen, hoe dit werkt gaat buiten de scope van deze handleiding. Wil je hier meer over lezen ga dan naar deze pagina https://contactform7.com/additional-settings/.

7 Formulier plaatsen in een pagina of bericht

Zodra je tevreden bent wil je natuurlijk het formulier tonen op een pagina of in een bericht. Om het formulier te plaatsen heb je de 'shortcode' van het formulier nodig. Deze 'shortcode' vindt je in het formulieren-overzicht en vindt je door naar "Contact > Contact formulieren" te gaan. In dit overzicht zie je in de twee kolom de 'shortcode' voor het formulier staan, bijvoorbeeld [contact-form-7 id="9" title="Contactformulier"]. Deze shortcode plaatst je in een bericht of in een pagina en vervolgens wordt het formulier in de pagina of bericht getoond.

8 Verstuurde berichten opslaan met de Flamingo plugin

Standaard slaat de CF7 ingezonden berichten niet op. Wil je dat alle ingestuurde berichten toch worden opgeslagen? Gebruik dan de Flamingo plugin.
- Ga naar "Plugins > Nieuwe Plugin"
- Zoek rechts bovenin op de plugin-naam "Flamingo" en je krijgt een overzicht met resultaten
- Klik bij het eerste resultaat naast de titel op de knop "nu installeren" en vervolgens op de knop "activeren"
- Zodra de plugin is geactiveerd wordt je doorgestuurd naar je plugin overzicht pagina en worden ingezonden berichten opgeslagen!

9 Anti-spam/reCAPTCHA toevoegen

Veel formulieren worden gebruikt om spam naar de eigenaar of beheerder van de website te sturen. Om dit tegen te gaan kan je de anti-spam tool "reCAPTCHA (v3)" toevoegen. Zie hieronder het stappenplan:
1. Maak eerst een account aan op https://www.google.com/recaptcha/ en meldt je aan.
2. klik bovenin op "v3 admin console"
3. Klik op de "+" knop 4. vul de gegevens in en je krijgt een 'Site-sleutel' en een 'Geheime sleutel'.
5. Ga naar je website naar "Contact > Integratie > reCAPTCHA > Integratie instellen" en vul hier de 'Site-sleutel' en de 'Geheime sleutel' in. 7. Bewerk het formulier waar je reCAPTCHA wilt tonen en Voeg de code [recaptcha] toe aan het formulier boven de code voor verzenden ([submit "Verzenden"])

Wat vindt je van dit artikel?