Contact Form 7 Installeren en bewerken

Een eenvoudig contactformulier kun je heel makkelijk installeren met de plugin Contact Form 7. Hoe doe je dat?

Stap 1: Installeer de plugin Contact Form 7: Log in op je WordPress website en ga naar [Plugins] –> [Nieuwe plugin]

Stap 2: Vul rechtsboven in het zoekvak [Contact Form 7] in en druk op enter

plugin zoeken WordPress

Stap 3: Ga in het overzicht dat je krijgt naar Contact Form 7 en klik op [Nu installeren]

Contact Form 7 installeren

WordPress zal nu de plugin voor je installeren. Je hoeft dan alleen nog maar op [Activeren] te klikken. Wanneer je de plugin hebt geïnstalleerd en geactiveerd verschijnt er links een extra menu-item die bij de plugin hoort: [Contact]

contactform 7 installeren

Stap 5: Contactformulier maken. Wanneer je op [Contact] klikt kom je in het menu van de plugin Contact Form 7. Daar kun je contactformulieren aanmaken en bewerken. Je ziet dat er dan al een basisformulier voor je gemaakt is [Contactformulier 1]. Je kunt klikken op de titel of op [Bewerk] om het formulier te bewerken.

Stap 6: Contactformulier aanpassen. Het basisformulier heeft de volgende elementen (velden noemen ze dat): naam, e-mailadres, onderwerp. bericht en verzendknop. Je kunt de teksten aanpassen. Zo kun je [Je naam] bijvoorbeeld wijzigen in [Hoe heet je] of [Uw naam]. Dat geldt ook voor “je email”, “je bericht”en “Verzenden”. Je kunt de woorden [verplicht] ook weghalen , maar blijf verder van de code naast en onder de Nederlandse teksten af.

Behalve het formulier heb je nog enkele instellingen/tabjes: Mail, Berichten en Aanvullende instellingen.

Onder het tabje [Mail] zie je waar de ingevulde formulieren naar toe gestuurd worden. Standaard is dit naar het e-mailadres van de beheerder van de website. Deze heb je ingevuld bij [Algemene instellingen]. Dit hoort een maialdres van je domeinnaam te zijn. Het is het beste als dit een emaialdres van de domeinnaam is. Bij het formuleir van wejebouwen zou het maildres van het contactfurmulier dus info@webjebouwen.nl of dieneke@webejebouwen.nl moeten zijn.

Bij het tabje [Berichten] staan de berichten die bezoekers kunnen krijgen bij het invullen. Je mag er naar kijken en ze wijzigen, maar in principe hoef je hier niets te wijzigen.

Klik op [Opslaan] en dan zijn we klaar voor de volgende stap.

Stap 7: Formulier plaatsen op pagina’s en berichten. Misschien heb je al gezien dat er direct onder de titel van het formulier [Contactformulier 1] een code staat. Deze code heb je nodig om het formulier te laten werken. Help code? Nee hoor: je hoeft alleen maar de code te kopiëren en vervolgens te plakken op alle berichten en pagina’s waar je het formulier wilt. Zo ziet de code er uit:

Plak deze in een nieuwe of bestaande pagina:



Het formulier dat ik gemaakt heb ziet er dan zo uit:

Formulier aanpassen – velden toevoegen

Ben je niet tevreden over het aantal invoegmogelijkheden/ velden, dan kun je velden toevoegen, bijvoorbeeld een telefoonnummer.

Telefoonnummer toevoegen aan het formulier

Ga in je Dashboard naar [Contact] –> [Contactformulieren] en klik op het formulier dat je wilt aanpassen (stap 6 hierboven) . Ga met je muis op de plek staan waar je het tefoonveld wilt en klik vervolgens op de “tag” telefoon:

contactform7-telefoonveld invoegen

Je komt dan op een instellingenpagina. Zet een vinkje als dit voor jou een verplicht veld is (mensen moeten dit invullen en kunnen het niet leeg laten). Je ziet ook codes waar je niets mee hoef te doen. Klik op [Tag invoegen]

Je komt nu terug bij het formulier en ziet dat er een “veld”bij gekomen is:

Dan moet je nog toevoegen dat het gaat om een telefoonnummer en de labelcode toevoegen om een mooie lay-out te krijgen:

En dan nog 1 stap. Als iemand een formulier invult stuurt WordPress een mail naar de beheerder. Daar moet je ook nog aangeven dat er een telefoonveld bijgekomen is. Ga in het formulier naar het tabje mail.

Voeg de code van het telefoonveld toe met daarvoor Telefoonnummer:

Formulier opslaan. Het formulier is nu overal op de site waar je het formulier hebt geplaatst aangepast.

Op dezelfde manier kun je ook andere velden toevoegen (keuzevakjes, radiobuttons en meer.

Kom je er toch niet helemaal uit? Laat dan een reactie achter, dan kan ik je misschien verder helpen.