Mini Guide till kontaktformulär 7

Vanligtvis behöver en webbplats en kontaktformulär för att kommunicera med platsägaren. En av våra favoriter är Kontaktformulär 7. Låt oss se vad det kan göra!

Kontaktformulär 7 är en fri, enkel och flexibel (i WordPress betyder det oftast att det finns en enkel inställning för dem som gillar det enkelt och mycket djup och komplexitet för personer som gillar att fitta) kontaktformat av Takayuki Miyoshi. Vissa säger att kontaktformulär 7 är en av de bästa formulärtilläggen för vårt favorithanteringssystem. Plugin uppdaterades senast i februari och har laddats ned totalt 6 457 967 gånger (vid skrivning av denna artikel).

Pluggen kan också hantera flera kontaktformulär och stöder AJAX-inlämning, CAPTCHA, Akismet-spamfiltrering och filuppladdning. Den senaste versionen i skrivandet av denna artikel är 3.1.1. Den officiella hemsidan är ContactForm7.com. Nedladdning kan göras från WordPress Plugin Directory. Detaljerad dokumentation kan nås i de officiella dokumenten.

Efter installation och aktivering hittar du ett eget menyalternativ som heter "Kontakt" i admingränssnittet.

Formulär

Här är en enkel form där du kan beställa en mobiltelefon. Du kan också ange varumärke, färg och betalningsmetod.

 Produkt *
 [välj * produkt "iPhone" "Samsung Galaxy S2" "HTC Desire"] 
 Färg *
 [välj * färg "svart" "vit" "grå"] 
 Namn *
 [text * ditt namn] 
 Email *
 [email * your-email] 
 Föredragen betalning 
 [radio betalningsmetod "VISA" "MASTERCARD" "AMEX"]
 [checkbox quickdelivery] Snabb leverans (1 dag)
 [Skicka in "Placera order"]

Sätt in formulärkod

Använd det här koden för att importera hela formuläret som anges ovan till en godtycklig WordPress-artikel eller -sida.

 [contact-form-7 title = "cell-ordering-form"]

Grundläggande syntax

Syntaggen för tagg består av typ, namn och värdefält. Med stjärnan blir det ett obligatoriskt element.

 [typnamnvärden] till exempel: [radio betalningsmetod "VISA" "MASTERCARD" "AMEX"]

Tagtyper

Här är en lista med alla taggar du kan använda i dina formulär:

textfält (text, text *, email, email *, textarea och textarea *),
kryssrutor, radioknappar och menyer (kryssrutan, kryssrutan *, radio, välj och välj *),
filuppladdning och bifogad fil (fil och fil *),
captcha (captchac och captchar),
frågesport (frågesport),
accept checkbox (acceptans),
Skicka in knappen (skicka in).

Skapa en två kolumnform

Vi kan snabbt skapa en form med de två kolumnstilarna, använd bara HTML och CSS. Den lilla hemligheten är att vi kan kombinera HTML med taggkoden.

    Förnamn [text förnamn] 
 Email [email * your-email] 
  Efternamn [text förnamn] 
 Telefon [text telefon] 
 
 Ämne [text * ditt ämne] 
 Meddelande [textarea * ditt meddelande] 
 [Skicka "Skicka"]

Här är CSS-koden. Ingenting fancy bara mycket grundläggande styling.

 #left width: 300px; flyta till vänster;  # rätt bredd: 250px; flyta till vänster;  .clearfix: efter innehåll: "\ 0020"; display: block; höjd: 0; tydligt: båda; visibility: hidden; overflow: hidden;  .clearfix display: block;

Avancerad syntax

Taggen syntax kan också vara mer detaljerad. Alternativet specificerar beteendet och utseendet. Deklarera alternativ är inte nödvändigt men här är hur du kan göra det. Observera att i följande exempel använder vi id och klass egenskaper. Du kan använda CSS och JavaScript för att utöka din blankett.

 [typnamn alternativvärden] till exempel: [radio betalningsmetod id: paynow klass: paythis "VISA" "MASTERCARD" "AMEX"]

Ställa in en postmall

I kontaktformulär 7 kan du enkelt redigera postmallar. Text, HTML-kod och formulärdata kan kombineras på godtyckliga sätt. Notera formdata med parenteserna. Nedan visas ett exempel på meddelandekroppen.

 Kära [ditt namn] Du har just beställt en [produkt] produkt i [färg] färg! Snart får du ett mail med länken till var du kan betala för din beställning. --- Tack för att du köpte! OurCompany LLC, www.ourcompany.com

Här är en lista över vad du kan ställa in via adminpanelen:

grundläggande rubrikfält (till, från och ämne)
meddelandekroppen
ytterligare rubriker
fil bilagor
HTML-läge

Lägger till CAPTCHA

Form plugin kan du infoga en CAPTCHA i dina kontaktformulär för att förhindra oönskade meddelanden. Kontaktformulär 7 använder Really Simple CAPTCHA som sin CAPTCHA-modul. Innan vi börjar måste du installera Realt Simple CAPTCHA-plugin. Se till att din tillfälliga mapp för CAPTCHA-filer finns och kan skrivas. Annars kan CAPTCHA inte skapas.

För att använda CAPTCHA i dina formulär måste du använda captchac och captchar formstaggar. captchac betyder CAPTCHA-Challenge och representerar en element för en CAPTCHA-bild. captchar betyder CAPTCHA-Response och representerar en element för ett svarsfält. en captchac taggen måste alltid vara kopplad till a captchar tagg med samma namn. Till exempel är taggarna som visas nedan giltiga:

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

Observera att namnen måste matcha varandra för att fungera korrekt. Här captcha-1 är given.

Åtgärda sändningsfel

Misslyckades med att skicka ditt meddelande. Vänligen försök senare eller kontakta administratören på annat sätt.

Om servern inte tillåter att skicka mail via skicka brev(), Du kan använda ett plugin för att skicka mail via SMTP. Båda tilläggen är kompatibla med WordPress 3.2.1. Dessa plugins kan lösa dina problem:

WP Mail SMTP
och konfigurera SMTP

Hämta och installera ditt valda plugin i WordPress. Ange inställningarna för din SMTP-server på sidan Inställningar.

Anpassade händelsemeddelanden

Vi kan fritt ändra de meddelanden som visas på händelserna.

Ännu trevligare kan du använda HTML-koden i inmatningsrutorna! Prova detta (det är verkligen ett HTML-liner, men uppdelat för tydlighet här):

 Ditt meddelande skickades med framgång. Tack!

Flerspråkig support

Kontaktformulär 7 visar blanketter på engelska som standard, men det kombinerar 40+ språköversättningar och du kan till och med skapa en kontaktformulär på vilket språk som helst. För att använda kontaktformulär 7: s admingränssnitt på ditt eget språk ställer du in WPLANG konstant i din wp-config.php fil.

 // Ändra den här raden: define ('WPLANG', 'ja');

Använd inlagd formulärdata på serversidan istället för att skicka mail

Om du vill ha något annat än standardpostningen (skicka in e-post), kan du använda koden nedan.

 add_action ("wpcf7_before_send_mail", "wpcf7_do_something_else"); funktion wpcf7_do_something_else (& $ wpcf7_data) // Här är variabeln där data lagras! var_dump ($ wpcf7_data); // Om du vill hoppa över posten data kan du göra det ... $ wpcf7_data-> skip_mail = true;

Ange rättigheter så bara administratörer kan ändra formulär

För att säkra redigeringsalternativen, använd den här koden.

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

Populärfält dynamiskt

Faktum är att standardvärdena i kontaktformulär 7 är statiska. Säg till exempel att du har en GET-parameter som du vill använda för att fylla i kontaktformuläret. Då är lösningen Kontaktformulär 7 Dynamisk Textförlängning av Sevenspark. Detta plugin ger en ny taggstyp och tillåter den dynamiska generationen av innehåll. Efter att ha installerat och aktiverat pluginet kommer Kontaktformulär 7 att ha två nya typer: det dynamiska textfältet och det dynamiska dolda fältet.

Sammanfattning

Som du kan se har det här pluginprogrammet en stor potential och vi täckte bara en liten andel av alla funktioner. Om du inte hittade något här, dyka in i dokumenten på den officiella webbplatsen. Var inte rädd att använda den just nu! Ha så kul!

Använder du redan kontaktformulär 7 och har ett tips att dela med oss? Eller finns det ett annat kontaktformulär för WordPress som du rekommenderar? Låt oss veta i kommentarerna!

Koda