Contact Form 7 - dies ist eines der beliebtesten Plugins zum Erstellen von Feedback-Formularen auf WordPress. Es bietet eine einfache Möglichkeit, Feedback-Formulare auf Ihrer Website zu erstellen und anzupassen. Wenn Sie neu sind und Contact Form 7 einrichten möchten, folgen Sie dieser detaillierten Anleitung.
Step 1: Installation und Aktivierung
Der erste Schritt besteht darin, das Contact Form 7-Plugin auf Ihrer WordPress-Website zu installieren und zu aktivieren. Gehen Sie dazu zum Abschnitt Plugins im WordPress-Dashboard, suchen Sie nach dem Contact Form 7-Plugin, klicken Sie auf die Schaltfläche Installieren und dann auf Aktivieren.
Step 2: Erstellen eines neuen Formulars
Nachdem Sie das Plugin aktiviert haben, gehen Sie zum Abschnitt "Kontakte" in der WordPress-Systemsteuerung und klicken Sie auf die Schaltfläche "Neu hinzufügen", um ein neues Formular zu erstellen. Hier können Sie den Namen des Formulars festlegen und die gewünschten Felder wie Name, Email, Nachricht usw. hinzufügen. Verwenden Sie die Beschriftungen in geschweiften Klammern, um die Felder automatisch zu generieren. Verwenden Sie zum Beispiel [text your-name] um ein Namensfeld zu erstellen.
Step 3: Einstellungen anpassen
Nachdem Sie ein Formular erstellt haben, können Sie dessen Einstellungen anpassen. Dazu gehören die Angabe der E-Mail-Adresse, an die die Nachrichten gesendet werden sollen, die Konfiguration der Vorlage und andere Parameter. Klicken Sie auf die Registerkarte Nachrichten, um den Nachrichtentext zu ändern, und auf die Registerkarte Dateianhänge, damit Benutzer Dateien an das Formular anhängen können.
Step 4: Einfügen eines Formulars in Ihre Website
Wenn Sie das Formular eingerichtet haben, kopieren Sie den generierten Code und fügen Sie ihn in die Seite oder Nachricht ein, auf der das Feedback-Formular angezeigt werden soll. Sie können den Code mit einem speziellen Block oder mit einem HTML-Editor einfügen, indem Sie den visuellen Modus auswählen.
Das ist alles! Jetzt wissen Sie, wie Sie Contact Form 7 auf Ihrer WordPress-Website einrichten. Befolgen Sie diese Anleitung und Sie haben ein funktionelles Feedback-Formular, das Benutzer direkt von Ihrer Website aus ausfüllen und senden können.
Contact Form 7 Plugin installieren
Schritte zum Installieren des Contact Form 7-Plugins:
- Melden Sie sich in Ihrem WordPress-Dashboard an.
- Gehen Sie zum Abschnitt "Plugins".
- Klicken Sie auf die Schaltfläche "Neu hinzufügen".
- Geben Sie "Contact Form 7" in die Suchleiste ein.
- Suchen Sie das Plugin Contact Form 7 und klicken Sie auf die Schaltfläche "Jetzt installieren".
- Klicken Sie nach der Installation des Plugins auf die Schaltfläche "Aktivieren".
Das Plugin Contact Form 7 kann auf Ihrer Website verwendet werden. Jetzt müssen Sie das Feedback-Formular anpassen und es der Seite oder dem Beitrag hinzufügen.
Erstellen eines neuen Formulars
Nachdem Sie das Contact Form 7-Plugin installiert und aktiviert haben, können Sie mit der Erstellung Ihres ersten Formulars beginnen.
1. Gehen Sie im Dashboard Ihrer Website zum Abschnitt "Kontaktformulare".
2. Klicken Sie auf die Schaltfläche "Neues hinzufügen".
3. Geben Sie den Namen des Formulars in das Feld Titel ein. Der Name sollte klar sein und den Zweck der Form beschreiben.
4. Definieren Sie die Felder, die Sie in das Formular aufnehmen möchten. Sie können beispielsweise das Feld Name, das Feld E-Mail und das Feld Nachricht hinzufügen.
5. Wählen Sie für jedes Formularelement einen Feldtyp aus. Zum Beispiel können Sie für das Feld "E-Mail" den Typ "E-Mail" oder "Text" auswählen.
6. Legen Sie die gewünschten Einstellungen für jedes Feld fest. Sie können beispielsweise eine Bezeichnung für das Feld Name festlegen oder festlegen, ob das Feld "E-Mail" ausgefüllt werden muss.
7. Fügen Sie bei Bedarf zusätzliche Formularelemente hinzu. Sie können beispielsweise eine Schaltfläche zum Senden eines Formulars oder ein Feld zum Hochladen einer Datei hinzufügen.
8. Speichern Sie das Formular, indem Sie auf die Schaltfläche Speichern klicken.
Jetzt haben Sie ein fertiges Formular, das Sie auf Ihre Website einfügen können!
Wie Sie ein Formular in Ihre Website einfügen, erfahren Sie im nächsten Abschnitt.
Anpassen von Formularfeldern
Wenn Sie ein Formular mit Contact Form 7 erstellen, müssen Sie die Felder anpassen, die im Formular angezeigt werden. Dazu können Sie verschiedene Feldtypen wie Textfeld, E-Mail-Feld, Checkbox, Dropdown-Liste und andere verwenden.
Um ein Feld zu einem Formular hinzuzufügen, müssen Sie den entsprechenden Code in das Textfeld auf der Bearbeitungsseite des Formulars einfügen:
[text your-name] - für das Textfeld des Benutzernamens.
[email your-email] - für das E-Mail-Feld.
[checkbox your-country "Country 1" "Country 2" "Country 3"] - für ein Feld mit mehreren Optionen.
[select your-recipient "Option 1" "Option 2" "Option 3"] - für die Dropdown-Liste.
Darüber hinaus können Sie Feldern zusätzliche Attribute hinzufügen, z. B. ein Pflichtfeld, einen Platzhalter, eine Zeichenbegrenzung und andere. Wenn Sie beispielsweise ein Feld als obligatorisch festlegen möchten, fügen Sie dem Feldcode das Attribut "erforderlich" hinzu:
[text your-name required]
Sie können auch das Aussehen von Formularfeldern anpassen, indem Sie dem Feldcode entsprechende CSS-Klassen hinzufügen. Um beispielsweise die Größe eines Textfelds zu ändern, fügen Sie dem Feldcode die Klasse "your-class" hinzu:
[text your-name class:your-class]
So können Sie durch das Anpassen von Formularfeldern eine Vielzahl von Feldtypen erstellen und ihnen zusätzliche Attribute und Klassen hinzufügen, um das Erscheinungsbild anzupassen. Dies hilft, Ihr Formular für die Benutzer benutzerfreundlicher und intuitiver zu gestalten.
Konfiguration der E-Mail-Einstellungen
Nachdem Sie das Plugin Contact Form 7 installiert und aktiviert haben, müssen Sie die E-Mail-Einstellungen konfigurieren, um Benachrichtigungen über ausgefüllte Formulare zu erhalten und E-Mails mit Antworten an Benutzer zu senden.
Gehen Sie zunächst auf die Seite "Kontaktformulare" im Administrationsbereich Ihrer Website.
Als nächstes wählen Sie das gewünschte Formular aus und klicken Sie auf die Schaltfläche "Bearbeiten", um die Einstellungen für dieses Formular zu öffnen.
Klicken Sie auf die Registerkarte "E-Mail" und sehen Sie einige Felder, die Sie ausfüllen müssen.
- Wem: Geben Sie die E-Mail-Adresse an, an die Sie über das ausgefüllte Formular benachrichtigt werden möchten. Wenn Sie mehrere E-Mail-Adressen angeben möchten, trennen Sie diese durch ein Komma.
- Von wem: Geben Sie die E-Mail-Adresse an, in deren Namen die Antwortbriefe gesendet werden sollen. Sie können das Tag verwenden [your-email] um die vom Benutzer angegebene E-Mail-Adresse einzuschließen.
- Das Thema: Geben Sie den Betreff der E-Mail ein, die beim Ausfüllen des Formulars gesendet wird. Sie können Tags in eckigen Klammern verwenden, zum Beispiel: [your-subject] um das vom Benutzer angegebene Thema einzuschließen.
- Zusätzliche Titel: Hier können Sie zusätzliche Header angeben, die durch Zeilenumbruch getrennt sind. Sie können beispielsweise "Antworten-an" angeben, damit der Empfänger leicht auf eine E-Mail antworten kann.
- Nachricht: Geben Sie den Text der Nachricht ein, die Sie beim Ausfüllen des Formulars senden möchten. Schreiben Sie verständliche und aussagekräftige Anweisungen, damit die Benutzer verstehen, was sie tun sollten.
Nachdem Sie alle Felder ausgefüllt haben, klicken Sie auf die Schaltfläche Speichern und die E-Mail-Einstellungen sind abgeschlossen.
Sie erhalten jetzt Benachrichtigungen über ausgefüllte Formulare und können E-Mails mit Antworten an Benutzer senden.
Erstellen einer erfolgreichen Sendungsnachricht
Nachdem ein Besucher das Formular ausgefüllt und auf die Schaltfläche "Senden" geklickt hat, muss er eine Nachricht über die erfolgreiche Übermittlung anzeigen. Dazu müssen wir die Funktion on_sent_ok im Code Contact Form 7 verwenden.
- Öffnen Sie das administrative Dashboard Ihrer Website.
- Wechseln Sie zum Abschnitt "Kontakte" und wählen Sie das gewünschte Formular aus.
- Suchen Sie auf der Registerkarte "Erweiterte Einstellungen" nach dem Feld "Zusätzlicher JavaScript-Code".
- Fügen Sie den folgenden Code in das Feld "Zusätzlicher JavaScript-Code" ein:
on_sent_ok: "location = 'http://example.com/thank-you/';"Ersetzen Sie in diesem Code http://example.com/thank-you / auf die URL der Seite, zu der der Benutzer nach erfolgreichem Senden des Formulars weitergeleitet werden soll.
Wenn der Besucher nun das Formular einsendet, wird er automatisch zur Dankesseite weitergeleitet.
Platzieren eines Formulars auf einer Seite
Nachdem Sie das Formular im Plugin Contact Form 7 erstellt haben, können Sie es auf der gewünschten Seite platzieren. Dazu müssen Sie die ID des erstellten Formulars kennen.
Um ein Formular auf eine Seite einzufügen, können Sie einen speziellen Shortcode verwenden [contact-form-7 ] . Fügen Sie die ID Ihres Formulars anstelle von id_form ein. Sie können diesen Shortcode mithilfe von PHP-Code in den Texteditor der Seite oder an die gewünschte Stelle des Themas einfügen.
Wenn Sie das Formular in den Text einfügen möchten, genügt es, den angegebenen Shortcode an der richtigen Stelle im Text hinzuzufügen. Zum Beispiel:
Ваше имя (обязательно)[text* your-name]Ваш Email (обязательно)[email* your-email]Тема[text your-subject]Сообщение[textarea your-message][submit "Отправить"]
Nachdem Sie das Formular auf der Seite platziert haben, können Sie es aktualisieren und sehen, wie es live aussieht. Wenn etwas nicht stimmt, können Sie das Formular oder seine Platzierung jederzeit bearbeiten.
