Kurzanleitung zum Kontaktformular 7

Normalerweise benötigt eine Website ein Kontaktformular, um mit dem Eigentümer der Website zu kommunizieren. Einer unserer Favoriten ist das Kontaktformular 7. Mal sehen, was es kann!

Contact Form 7 ist ein kostenloses, einfaches und flexibles (in WordPress bedeutet dies normalerweise, dass es eine einfache Einrichtung für diejenigen gibt, die es einfach mögen, und eine Menge Tiefe und Komplexität für Leute, die gerne spielen). Einige sagen, dass Contact Form 7 eines der besten Plugins für unser beliebtes Content-Management-System ist. Das Plugin wurde zuletzt im Februar aktualisiert und wurde insgesamt 6.457.967 mal heruntergeladen (zum Zeitpunkt der Erstellung dieses Artikels).

Das Plugin kann auch mehrere Kontaktformulare verarbeiten und unterstützt das Senden von AJAX, CAPTCHA, Spam-Filterung von Akismet und das Hochladen von Dateien. Die neueste Version beim Schreiben dieses Artikels ist 3.1.1. Die offizielle Website ist ContactForm7.com. Der Download kann aus dem WordPress Plugin-Verzeichnis erfolgen. Ausführliche Dokumentation ist in den offiziellen Dokumenten verfügbar.

Nach der Installation und Aktivierung finden Sie in der Administrationsoberfläche einen speziellen Menüpunkt mit dem Namen "Kontakt".


Formularcode

Hier ist ein einfaches Formular, mit dem Sie ein Handy bestellen können. Sie können auch die Marke, die Farbe und die Zahlungsart angeben.

 

Produkt *
[Wählen Sie * Produkt "iPhone" "Samsung Galaxy S2" "HTC Desire"]

Farbe *
[wähle * Farbe "schwarz" "weiß" "grau"]

Name *
[Text * Dein Name]

Email *
[E-Mail * Ihre E-Mail-Adresse]

Bevorzugte Zahlung
[Radio-Zahlungsmethode "VISA" "MASTERCARD" "AMEX"]

[checkbox quickdelivery] Schnelle Lieferung (1 Tag)

[Submit "Bestellung aufgeben"]


Formularcode einfügen

Verwenden Sie dieses Snippet, um das oben angegebene vollständige Formular in einen beliebigen WordPress-Artikel oder eine Seite zu importieren.

 [contact-form-7 title = "Handy-Bestellformular"]

Grundlegende Syntax

Die Tag-Syntax besteht aus den Feldern Typ, Name und Wert. Mit dem Sternchen wird es zum Pflichtelement.

 [Typnamenwerte] zum Beispiel: [Radio-Bezahlmethode "VISA" "MASTERCARD" "AMEX"]

Tag-Typen

Hier ist eine Liste mit allen Tags, die Sie in Ihren Formularen verwenden können:

  • Textfelder (Text, Text *, E-Mail, E-Mail *, Textbereich und Textbereich *),
  • Ankreuzfelder, Optionsfelder und Menüs (Ankreuzfeld, Ankreuzfeld *, Radio, Auswählen und Auswählen *),
  • Dateiupload und Anhang (Datei und Datei *),
  • Captcha (Captchac und Captchar),
  • Quiz (Quiz),
  • Abnahme-Checkbox (Abnahme),
  • Schaltfläche "Senden" (Senden).

Erstellen eines zweispaltigen Formulars

Wir können schnell ein Formular mit dem zweispaltigen Stil erstellen. Verwenden Sie dazu einfach HTML und CSS. Das kleine Geheimnis ist, dass wir HTML mit dem Tag-Code kombinieren können.

  
Vorname [Text Vorname]
E-Mail [E-Mail * Ihre E-Mail-Adresse]
Nachname [Text Nachname]
Telefon [Text dein Telefon]
Betreff [Text * Ihr Betreff]
Nachricht [Textfeld * Ihre Nachricht]
[absenden "senden"]

Hier ist der CSS-Code. Nichts Besonderes, nur ein sehr einfaches Styling.

 #links width: 300px; Schwimmer: links;  #right width: 250px; Schwimmer: links;  .clearfix: nach content: "\ 0020"; Bildschirmsperre; Höhe: 0; Lösche beide; Sichtbarkeit: versteckt; Überlauf versteckt;  .clearfix display: block; 

Erweiterte Syntax

Die Tag-Syntax kann auch detaillierter sein. Der Optionsteil gibt das Verhalten und das Aussehen an. Das Deklarieren von Optionen ist nicht erforderlich, aber wie Sie dies tun können. Beachten Sie, dass wir im folgenden Beispiel die Ich würde und Klasse Eigenschaften. Sie können CSS und JavaScript verwenden, um Ihr Formular zu erweitern.

 [Typname Optionswerte] zum Beispiel: [radio paymethod id: paynow class: paythis "VISA" "MASTERCARD" "AMEX"]

Einrichten einer Mail-Vorlage

In Kontaktformular 7 können Sie Mail-Vorlagen sehr einfach bearbeiten. Text, HTML-Code und Formulardaten können auf beliebige Weise kombiniert werden. Beachten Sie die Formulardaten mit den Klammern. Unten ist ein Beispiel für den Nachrichtentext.

 Sehr geehrter [Ihrname], Sie haben gerade ein [Produkt] in [Farbe] Farbe bestellt! In Kürze erhalten Sie eine E-Mail mit dem Link, wo Sie Ihre Bestellung bezahlen können. --- Danke für den Einkauf! OurCompany LLC, www.ourcompany.com

Hier finden Sie eine Liste der Einstellungen, die Sie noch über das Admin-Panel vornehmen können:

  • grundlegende Kopfzeilenfelder (nach, von und Betreff)
  • Nachrichtentext
  • zusätzliche Header
  • Dateianlagen
  • HTML-Modus

CAPTCHA hinzufügen

Mit dem Formular-Plugin können Sie ein CAPTCHA in Ihre Kontaktformulare einfügen, um unerwünschte Nachrichten zu verhindern. Kontaktformular 7 verwendet Really Simple CAPTCHA als CAPTCHA-Modul. Bevor wir beginnen, müssen Sie das Really Simple CAPTCHA-Plugin installieren. Stellen Sie sicher, dass Ihr temporärer Ordner für CAPTCHA-Dateien vorhanden ist und beschreibbar ist. Andernfalls kann das CAPTCHA nicht erstellt werden.

Um CAPTCHA in Ihren Formularen verwenden zu können, müssen Sie die Captchac und Captchar Formular-Tags. Captchac bedeutet CAPTCHA-Challenge und repräsentiert eine Element für ein CAPTCHA-Bild. Captchar bedeutet CAPTCHA-Response und repräsentiert eine Element für ein Antwort-Eingabefeld. EIN Captchac Tag muss immer mit einem gepaart werden Captchar Tag mit dem gleichen Namen. Die unten gezeigten Tags sind beispielsweise gültig:

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

Beachten Sie, dass die Namen übereinstimmen müssen, damit sie ordnungsgemäß funktionieren. Hier Captcha-1 ist gegeben.


Fehler beim Senden beheben

Senden der Nachricht fehlgeschlagen. Bitte versuchen Sie es später oder kontaktieren Sie den Administrator auf andere Weise.

Wenn der Server das Senden von E-Mails nicht zulässt sendmail (), Sie können ein Plugin verwenden, um E-Mails über SMTP zu senden. Beide Erweiterungen sind mit WordPress 3.2.1 kompatibel. Diese Plugins können Ihre Probleme lösen:

  • WP Mail SMTP
  • und konfigurieren Sie SMTP

Laden Sie das ausgewählte Plugin herunter und installieren Sie es in WordPress. Geben Sie auf der Seite Einstellungen die Einstellungen für Ihren SMTP-Server ein.


Benutzerdefinierte Ereignismeldungen

Wir können die auf Ereignissen angezeigten Meldungen frei ändern.

Noch schöner können Sie HTML-Code in den Eingabefeldern verwenden! Versuchen Sie es hier (eigentlich ist es ein HTML-Einzeiler, hier jedoch der Übersichtlichkeit halber):

 Ihre Nachricht wurde erfolgreich versandt. Vielen Dank! 

Unterstützung für mehrere Sprachen

In Kontaktformular 7 werden standardmäßig Formulare in Englisch angezeigt. Es werden jedoch mehr als 40 Übersetzungen in einer Sprache gebündelt. Sie können sogar ein Kontaktformular in jeder Sprache erstellen. Um die Admin-Oberfläche von Contact Form 7 in Ihrer eigenen Sprache zu verwenden, setzen Sie das WPLANG konstant in deiner wp-config.php Datei.

 // Diese Zeile ändern: define ('WPLANG', 'ja');

Verwenden Sie auf Server-Seite veröffentlichte Formulardaten anstelle von Mailing

Wenn Sie etwas anderes als das Standard-Posting wünschen (E-Mail-Versand), können Sie den nachstehenden Code verwenden.

 add_action ("wpcf7_before_send_mail", "wpcf7_do_something_else"); Funktion wpcf7_do_something_else (& $ wpcf7_data) // Hier ist die Variable, in der die Daten gespeichert werden! var_dump ($ wpcf7_data); // Wenn Sie das Versenden der Daten überspringen möchten, können Sie dies tun ... $ wpcf7_data-> skip_mail = true; 

Rechte setzen, damit nur Administratoren Formulare ändern können

Verwenden Sie diesen Code, um die Bearbeitungsoptionen zu sichern.

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

Felder dynamisch füllen

Tatsache ist, dass die Standardwerte in Contact Form 7 statisch sind. Angenommen, Sie haben beispielsweise einen GET-Parameter, den Sie zum Ausfüllen des Kontaktformulars verwenden möchten. Dann ist die Lösung Contact Form 7 Dynamic Text Extension von Sevenspark. Dieses Plugin bietet einen neuen Tag-Typ und ermöglicht die dynamische Erzeugung von Inhalten. Nach der Installation und Aktivierung des Plugins verfügt Contact Form 7 über zwei neue Typen: das dynamische Textfeld und das dynamische ausgeblendete Feld.


Zusammenfassung

Wie Sie sehen, hat dieses Formular-Plugin viel Potenzial und wir haben nur einen kleinen Prozentsatz aller Funktionen abgedeckt. Wenn Sie hier nichts gefunden haben, tauchen Sie in die Dokumente auf der offiziellen Website ein. Scheuen Sie sich nicht, es jetzt zu benutzen! Habe Spaß!

Verwenden Sie bereits das Kontaktformular 7 und haben Sie einen Tipp, um es mit uns zu teilen? Oder gibt es ein anderes Kontaktformular-Plugin für WordPress, das Sie empfehlen würden? Lass es uns in den Kommentaren wissen!