Alumio is de nummer 1 IT Cloud Service Provider in Nederland 
Meer informatie
Een witte pijl die naar rechts wijst, een visuele weergave van hoe je toegang krijgt tot meer paginamateriaal als je it klikt.
E-commerce
10 min lezen

De ultieme gids voor het instellen van contactformulier 7 op WordPress

Geschreven door
Gepubliceerd op
28 mei 2023
Bijgewerkt op
17 mei 2024

Het creëren van een naadloos communicatiekanaal tussen jou en je websitebezoekers is cruciaal voor elk succesvol online bedrijf. Contact Form 7 is een populaire WordPress plugin waarmee je precies dat kunt doen. In deze uitgebreide handleiding leiden we je door het hele proces van het configureren van Contact Form 7 voor je WordPress site, van installatie tot aanpassing.

Contactformulier 7 installeren

Om te beginnen moet je Contact Form 7 installeren en activeren op je WordPress website. Volg deze stappen:

  1. Log in op je WordPress admin dashboard.
  2. Navigeer naar Plugins > Nieuwe toevoegen.
  3. Typ in de zoekbalk "Contact Form 7" en druk op Enter.
  4. Zoek de Contact Form 7 plugin van Takayuki Miyoshi en klik op Nu installeren.
  5. Zodra de installatie is voltooid, klikt u op Activeren.

Gefeliciteerd, Contact Form 7 is nu geïnstalleerd en klaar voor gebruik op je site!

Je eerste contactformulier maken

Als Contact Form 7 is geïnstalleerd, kunt u nu uw eerste contactformulier maken. Volg hiervoor deze stappen:

  1. Ga in je WordPress admin dashboard naar Contact > Nieuw toevoegen.
  2. Voer een titel in voor uw contactformulier in het daarvoor bestemde veld.
  3. Je zult zien dat er al een standaard formuliersjabloon aanwezig is. Je kunt dit sjabloon aanpassen of een nieuw sjabloon maken. Voor nu gebruiken we de standaardsjabloon.
  4. Klik op Opslaan om je nieuwe contactformulier op te slaan.

Formuliervelden toevoegen

Het aanpassen van je contactformulier is eenvoudig met Contact Form 7. Je kunt verschillende velden toevoegen, zoals tekstvakken, vervolgkeuzemenu's, selectievakjes en meer. Zo werkt het:

  1. Plaats in de formuliereditor je cursor op de plek waar je een nieuw veld wilt toevoegen.
  2. Klik op het veldtype dat je wilt toevoegen in de werkbalk boven het formuliersjabloon (bijv. tekst, e-mail, URL, enz.).
  3. Er verschijnt een pop-upvenster waarin je de eigenschappen van het veld kunt aanpassen, zoals het label, de standaardwaarde en de vereiste status.
  4. Klik op Tag invoegen om het veld toe te voegen aan het sjabloon van je formulier.

Herhaal deze stappen voor elk veld dat je aan je formulier wilt toevoegen.

E-mailmeldingen configureren

Zodra je formulier klaar is, moet je e-mailmeldingen instellen om berichten van je websitebezoekers te ontvangen. Om dit te doen:

  1. Scroll naar beneden naar de sectie Mail in de formuliereditor.
  2. Voer uw e-mailadres in het veld Aan in om formulierinzendingen te ontvangen.
  3. Pas de velden Van, Onderwerp en Extra kopteksten aan als dat nodig is.
  4. Controleer in het veld Berichttekst of alle tags voor formuliervelden zijn opgenomen, zodat u de verzonden informatie ontvangt.

Vergeet niet op Opslaan te klikken om je wijzigingen op te slaan.

Je contactformulier stylen

Om je contactformulier visueel aantrekkelijk te maken en consistent met het ontwerp van je website, kun je aangepaste CSS-stijlen toepassen. Zo werkt het:

  1. Ga in je WordPress dashboard naar: Uiterlijk > Aanpassen.
  2. Navigeer naar de sectie Extra CSS.
  3. Voeg uw aangepaste CSS-code toe om de Contact Form 7-elementen te stylen. Bijvoorbeeld:

.wpcf7-formulier {

  achtergrondkleur: #f8f8f8;

  padding: 20px;

  omtrekrand: 5px;

}


.wpcf7-form input[type="text"],

.wpcf7-formulier input[type="email"],

.wpcf7-form textarea {

  breedte: 100%;

  padding: 10px;

  rand: 1px solid #ccc;

  grensradius: 3px;

}


.wpcf7-submit {

  achtergrondkleur: #4CAF50;

  rand: geen;

  kleur: wit;

  opvulling: 15px 32px;

  tekst-uitlijning: centreren;

  tekstdecoratie: geen;

  weergave: inline-block;

  lettergrootte: 16px;

  marge: 4px 2px;

  cursor: aanwijzer;

  omtrekrand: 5px;

}

  1. Klik op Publiceren om uw aangepaste stijlen op te slaan.

Je contactformulier zou nu gestyled moeten zijn volgens je voorkeuren.

Tips voor bescherming tegen spam

Spam kan een groot probleem zijn voor website-eigenaren. Gelukkig biedt Contact Form 7 verschillende opties om uw formulieren tegen spam te beschermen:

  1. CAPTCHA: Integreer met de reCAPTCHA-service van Google om een CAPTCHA-veld aan je formulier toe te voegen. Hierdoor moeten gebruikers controleren of ze menselijk zijn voordat ze het formulier verzenden.
  2. Honeypot: Gebruik de Contact Form 7 Honeypot plugin om een verborgen veld aan je formulier toe te voegen. Bots vullen het veld in, maar mensen zien it niet. Als het veld wordt ingevuld, wordt de inzending gemarkeerd als spam.
  3. Akismet: Integreer Contact Form 7 met de Akismet anti-spamservice om spam automatisch uit inzendingen te filteren.

Het implementeren van een of meer van deze methoden kan helpen om je inbox schoon te houden en ervoor te zorgen dat je alleen legitieme berichten van je websitebezoekers ontvangt.

Integreren met Alumio

Alumio is een krachtig integratieplatform dat je kan helpen met je WordPress integraties met verschillende applicaties en systemen. Door Contact Form 7 te integreren met Alumio kun je processen automatiseren en je workflows stroomlijnen.

U kunt Contact Form 7 bijvoorbeeld koppelen aan uw CRM om automatisch leads of contactpersonen aan te maken wanneer een formulier wordt ingediend. Dit bespaart tijd en zorgt ervoor dat er geen leads worden gemist.

Om Contact Form 7 te integreren met Alumio, moet je:

  1. Meld je aan voor een Alumio .
  2. Maak een nieuwe integratie in Alumio en verbind WordPress met de gewenste toepassing (bijv. CRM, marketing , enz.).
  3. Configureer de integratie-instellingen om Contact Form 7 velden toe te wijzen aan de juiste velden in je verbonden applicatie.
  4. Schakel de integratie in en test deze om er zeker van te zijn dat alles correct werkt.

Als Alumio en Contact Form 7 samenwerken, kunt u efficiëntere workflows creëren en het meeste halen uit de contactformulieren van uw website.

Portret van Leonie Becher Merli, 
Business Development Representative, Alumio, wijst naar rechts met beide handen - binnen een witte cirkelvormige achtergrond.

Vraag een gratis demo aan van het Alumio platform

Over onze partner
Neem contact op

We helpen je graag en beantwoorden al je vragen

Begin met integreren met populaire apps!

Geen items gevonden.

Maak verbinding met elk aangepast eindpunt

Begin met integreren met populaire apps!

Geen items gevonden.

Maak verbinding met met

Geen items gevonden.
Portret van Leonie Becher Merli, 
Business Development Representative, Alumio, wijst naar rechts met beide handen - binnen een witte cirkelvormige achtergrond.

Wil je Alumio in actie zien?