Minigids voor contactformulier 7

Meestal heeft een website een contactformulier nodig om met de site-eigenaar te communiceren. Een van onze favorieten is Contactformulier 7. Laten we kijken wat het kan doen!

Contact formulier 7 is een gratis, eenvoudig en flexibel (in WordPress betekent dit meestal dat er een eenvoudige set-up is voor diegenen die het leuk vinden simpel, en veel diepte en complexiteit voor mensen die van gehannes houden) contactvorm plugin door Takayuki Miyoshi. Sommigen zeggen dat Contact Form 7 een van de beste plugins is voor ons favoriete content management systeem. De plug-in is voor het laatst bijgewerkt in februari en is 6.457.967 keer gedownload (op het moment van schrijven van dit artikel).

De plug-in kan ook meerdere contactformulieren verwerken en ondersteunt AJAX indienen, CAPTCHA, Akismet spamfiltering en het uploaden van bestanden. De nieuwste versie bij het schrijven van dit artikel is 3.1.1. De officiële website is ContactForm7.com. Downloaden kan worden gemaakt vanuit de WordPress Plugin Directory. Gedetailleerde documentatie kan worden gevonden in de officiële documenten.

Na installatie en activering vindt u een speciaal menu-item genaamd "Contact" in de admin-interface.


Formuliercode

Hier is een eenvoudig formulier waar je een mobiele telefoon kunt bestellen. U kunt ook het merk, de kleur en de betaalmethode opgeven.

 

Artikel *
[selecteer * product "iPhone" "Samsung Galaxy S2" "htc Desire"]

Kleur *
[selecteer * kleur "zwart" "wit" "grijs"]

Naam *
[tekst * uw naam]

Email *
[e-mail * uw e-mailadres]

Voorkeursbetaling
[betaalmethode radio "VISA" "MASTERCARD" "AMEX"]

[checkbox quickdelivery] Snelle levering (1 dag)

[submit "Plaats bestelling"]


Formuliercode invoegen

Gebruik dit fragment om het volledige hierboven opgegeven formulier te importeren naar een willekeurig WordPress-artikel of -pagina.

 [contact-form-7 title = "cel-telefoon-bestelformulier"]

Algemene syntaxis

De tag-syntaxis bestaat uit type-, naam- en waardevelden. Met de asterisk wordt het een verplicht element.

 [type naamwaarden] bijvoorbeeld: [radio betaalmethode "VISA" "MASTERCARD" "AMEX"]

Tagtypes

Hier is een lijst met alle tags die u in uw formulieren kunt gebruiken:

  • tekstvelden (tekst, tekst *, e-mail, e-mail *, tekstveld en tekstveld *),
  • selectievakjes, keuzerondjes en menu's (selectievakje *, radio, selecteren en selecteren *),
  • bestand uploaden en bijlage (bestand en bestand *),
  • captcha (captchac en captchar),
  • quiz (quiz),
  • acceptatie checkbox (acceptatie),
  • verzend knop (submit).

Een formulier met twee kolommen maken

We kunnen snel een formulier maken met de stijl met twee kolommen, gebruik gewoon wat HTML en CSS. Het kleine geheim is dat we HTML kunnen combineren met de tagcode.

  
Voornaam [tekst voornaam]
E-mail [e-mail * uw e-mailadres]
Achternaam [tekst achternaam]
Telefoon [sms je-telefoon]
Onderwerp [tekst * uw onderwerp]
Bericht [textarea * uw bericht]
[verzend 'Verzenden']

Hier is de CSS-code. Niets bijzonders gewoon heel basic styling.

 #left width: 300px; zweven: links;  #rechts width: 250px; zweven: links;  .clearfix: na content: "\ 0020"; display: block; Hoogte: 0; beiden opschonen; visibility: hidden; overloop verborgen;  .clearfix weergave: blok; 

Geavanceerde syntaxis

De tag-syntaxis kan ook gedetailleerder zijn. Het onderdeel Opties specificeert het gedrag en uiterlijk. Declaratie-opties zijn niet nodig, maar hier is hoe u het kunt doen. Merk op dat we in het volgende voorbeeld de ID kaart en klasse eigenschappen. U kunt CSS en JavaScript gebruiken om uw formulier uit te breiden.

 [type naam opties waarden] bijvoorbeeld: [radio betaalmethode id: paynow class: paythis "VISA" "MASTERCARD" "AMEX"]

Een e-mailsjabloon instellen

In Contact Form 7 kunt u mail-sjablonen heel gemakkelijk bewerken. Tekst, HTML-code en formuliergegevens kunnen op willekeurige manieren worden gecombineerd. Noteer de formuliergegevens met de haakjes. Hieronder staat een voorbeeld voor de berichttekst.

 Beste [jouw naam], je hebt net een [product] product besteld in [kleur] kleur! Binnenkort ontvangt u een e-mail met de link naar waar u kunt betalen voor uw bestelling. --- Bedankt voor het kopen! OurCompany LLC, www.ourcompany.com

Hier is een lijst van wat u nog meer kunt instellen via het admin panel:

  • basiskopvelden (naar, van en onderwerp)
  • bericht lichaam
  • extra headers
  • bestandsbijlagen
  • HTML-modus

CAPTCHA toevoegen

Met de formulierinvoegtoepassing kunt u een CAPTCHA invoegen in uw contactformulieren om ongewenste berichten te voorkomen. Contactformulier 7 gebruikt echt eenvoudige CAPTCHA als zijn CAPTCHA-module. Voordat we beginnen, moet je de echt eenvoudige CAPTCHA-plug-in installeren. Zorg ervoor dat uw tijdelijke map voor CAPTCHA-bestanden bestaat en beschrijfbaar is. Anders kan de CAPTCHA niet worden gemaakt.

Voor het gebruik van CAPTCHA in uw formulieren, moet u de captchac en captchar formulier tags. captchac betekent CAPTCHA-uitdaging en het vertegenwoordigt een element voor een CAPTCHA-afbeelding. captchar betekent CAPTCHA-Response en het vertegenwoordigt een element voor een antwoordinvoerveld. EEN captchac tag moet altijd worden gekoppeld met een captchar tag met dezelfde naam. De onderstaande tags zijn bijvoorbeeld geldig:

  [captchac captcha-1] [captchar captcha-1]

Merk op dat de namen bij elkaar moeten passen om goed te kunnen werken. Hier captcha-1 is gegeven.


Vaststellende fouten bij het verzenden

Verzenden van uw bericht mislukt. Probeer het later of neem op een andere manier contact op met de beheerder.

Als de server geen e-mail toestuurt via Verzend mail(), u kunt een plug-in gebruiken om e-mail te verzenden via SMTP. Beide extensies zijn compatibel met WordPress 3.2.1. Deze plug-ins kunnen uw problemen oplossen:

  • WP Mail SMTP
  • en SMTP configureren

Download en installeer de door u gekozen plug-in in WordPress. Voer de instellingen voor uw SMTP-server in op de pagina Instellingen.


Aangepaste gebeurtenisberichten

We kunnen de berichten die getoond worden op evenementen vrij wijzigen.

Nog leuker, je kunt HTML-code gebruiken in de invoervakken! Probeer dit eens (het is echt een HTML-one-liner, maar wordt hier voor de duidelijkheid uitgesplitst):

 Je bericht is succesvol verzonden. Dank je! 

Meertalige ondersteuning

Contact Formulier 7 toont standaard formulieren in het Engels, maar bundelt 40+ taalvertalingen en u kunt zelfs een contactformulier in elke taal maken. Om de admin-interface van Contact Form 7 in uw eigen taal te gebruiken, stelt u de WPLANG constant in jouw wp-config.php het dossier.

 // Verander deze regel: define ('WPLANG', 'ja');

Gebruik Geposte formuliergegevens in serverzijde in plaats van mailing

Als u iets anders wilt dan de standaard posting (e-mail verzenden), dan kunt u de onderstaande code gebruiken.

 add_action ("wpcf7_before_send_mail", "wpcf7_do_something_else"); function wpcf7_do_something_else (& $ wpcf7_data) // Hier is de variabele waarin de gegevens zijn opgeslagen! var_dump ($ wpcf7_data); // Als u de gegevens per e-mail wilt overslaan, kunt u dit doen ... $ wpcf7_data-> skip_mail = true; 

Rechten instellen zodat alleen beheerders formulieren kunnen wijzigen

Gebruik deze code om de bewerkingsopties te beveiligen.

 define ('WPCF7_ADMIN_READ_CAPABILITY', 'manage_options'); define ('WPCF7_ADMIN_READ_WRITE_CAPABILITY', 'manage_options');

Velden dynamisch invullen

Het is een feit dat de standaardwaarden in Contactformulier 7 statisch zijn. Stel dat u bijvoorbeeld een GET-parameter heeft die u wilt gebruiken om het contactformulier in te vullen. Dan is de oplossing Contactformulier 7 Dynamische Tekstuitbreiding door Sevenspark. Deze plug-in biedt een nieuw tagtype en maakt het dynamisch genereren van inhoud mogelijk. Nadat de plug-in is geïnstalleerd en geactiveerd, heeft Contact Form 7 twee nieuwe typen: het dynamische tekstveld en het dynamische verborgen veld.


Samenvatting

Zoals u kunt zien, heeft deze plugin voor formulieren veel potentieel en we hebben slechts een klein percentage van alle functies gedekt. Als je hier niets hebt gevonden, duik dan in de documenten op de officiële site. Wees niet bang om het nu te gebruiken! Veel plezier!

Gebruikt u Contact Form 7 al en heeft u een tip om met ons te delen? Of is er nog een plug-in voor contactformaten voor WordPress die u zou aanbevelen? Laat het ons weten in de comments!