Contact Form 7 ist seit vielen Jahren das beliebteste Plugin für Kontaktformulare mit WordPress. Mit diesem Plugin kannst Du Kontakt-, Anmelde- oder Teilnahmeformulare erstellen. Dafür bietet das Plugin Buttons mit verschiedenen Feld-Funktionen wie beispielsweise Textfelder, E-Mail Feld, Checkboxen, Drop-Down Auswahl, Radiobuttons, URL-Feld uvm.
Standardmäßig passt sich das Desing des mit Contact Form 7 erstellten Formulars automatisch an das Layout Deines Themes an. Möchtest Du dennoch gestalterische Anpassungen machen, gibt es hierfür auf der Support-Seite von Contact Form 7 zahlreiche CSS-Formatierungshilfen und weitere Anleitungen: http://contactform7.com/docs/
Auf der Supportseite findest Du auch hilfreiche und neue Artikel. Sie sollte auf jeden Fall Dein erster Anlaufpunkt sein, wenn Du Schwierigkeiten mit Contact Form 7 hast!
Wenn Du das Plugin bei Dir installiert hast erscheint in Deiner Sidebar ein neuer Menüpunkt namens „Formular“
Wenn Du auf Formulare klickst, gelangst Du auf die Übersichtsseite von Contact Form 7. HIer ist standardmäßig schon das erste Kontaktformular angelegt. Klicke dort auf Bearbeitung und verschaffe Dir einen ersten Überblick zum Aufbau des Kontaktformulars.
Im Bearbeitungsmodus des Kontaktformulars hast Du die Möglichkeit das Formular nach Deinen Wünschen umzugestalten. Hierfür kannst Du bestehende Buttons einfach löschen, Texte umschreiben und natürlich neue Buttons hinzufügen.
Wenn Du einen neuen Button hinzufügst, musst Du über diesen noch selbständig den dazugehörigen Text eintragen inkl. der <p>-Tags. Ansonsten würde nur das leere Feld im Formular angezeigt werden und der Besucher weiß nicht was er dort reinschreiben soll.
Die Funktionsfelder sind beim Contact Form 7 immer in eckigen Klammern dargestellt und diese darfst Du nicht verändern. Hier mal ein Beispiel für einen Beschreibungstext mit darunter liegendem Funktionsfeld:
<p>Ihr Name<br />
[text* your-name] </p>
So wird das Feld auf der Webseite angezeigt: Das <p>-Tag erzeugt den Absatz und das <br/>-Tag ist für den Zeilenumbruch zuständig. Alles was zwischen diesen Tags steht wird auf der Webseite angezeigt.
Wie wird das Kontaktformular auf meiner Webseite eingebunden?
Jedes von Dir erstellte Kontaktformular hat einen eigenen Shortcode, dieser wird Dir entweder in der Übersicht hinter dem jeweiligen Formularnamen angezeigt oder aber im Bearbeitungsmodus direkt unter der Überschrift des Formulars:
Kopiere diesen Code und füge ihn dort ein, wo das Kontaktformular angezeigt werden soll. Du kannst ihn auf allen Seiten und Beiträgen so oft einfügen wie Du möchtest und natürlich auch beliebig viele Formulare erstellen. Jedes neue Formular das Du anlegst, wird mit einer eigenen ID gekennzeichnet die im Shortcode hinterlegt ist.
Möchtest Du das Formular in Deine Sidebar einfügen, dann gehe auf Design – Widgets und wähle dort das Text-Widget aus. Füge dort den kopierten Shortcode ein und klicke auf Speichern.
E-Mail anpassen bei Contact Form 7
Wenn Besucher Deine Formulare ausfüllen und den Senden-Button anklicken, bekommst Du das ausgefüllte Formular per E-Mail zugesendet. Hierfür musst Du auf die Karteikarte E-Mail klicken (siehe obiges Bild) und dort Deine E-Mail Adresse hinterlegen.
Wichtig: Bei WordPress 4.4.1 gibt es immer wieder Probleme mit dem Versenden ausgefüllter Kontaktformulare. Klickt der Anfragende auf „Senden“ bekommt er eine Fehlermeldung, dass seine Anfrage nicht versendet werden konnte. In den meinsten Fällen liegt das an dem fehlerhaft ausgefüllten „From“ Feld bei den E-Mail-Einstellungen des jeweiligen Kontaktformular.
Hier ist es wichtig ebenfalls die E-Mailadresse einzutragen (wie im darüber liegenden Feld „To“) und nicht nur Deinen Namen. Das Feld sollte wie folgt ausgefüllt sein:
Mit Darstellung Deines Namens kannst Du das Feld auch wie folgt ausfüllen:
Mach den Live-Test mit Deinem Kontaktformular
Zum Schluss möchte ich Dir noch zwei Tipps mit auf den Weg geben, wenn Du mit das WordPress Plugin Contact Form 7 im Einsatz hast:
- Mach den Praxis-Test nachdem Du das Kontaktformular erstellt und auf Deiner Webseite eingebunden hast. Teste aus ob Dein Formular gesendet werden kann und alle Informationen bei Dir ankommen.
- Installiere Dir das Zusatzplugin Storage für CF 7*. Dieses Plugin kostet zwar ein bisschen was (19 $), fängt aber dafür alle echten Anfragen auf die von Deinem Email-Dienst fälschlicherweise in den Spam-Ordner gesteckt worden. Das passiert ziemlich häufig und hat seine Ursache in der Zuweisung von „temporären“ IP Adressen der Webhoster. Wenn Du das Plugin nicht möchtest, dann schau regelmäßig in Deinen Spamordner!
Liebe Sandra,
Danke für das tolle Tutorial, doch irgendwie muss ich etwas übersehen, denn etwas stimmt nicht.
Ich versende, es kommt an, aber ohne den Textinhalt. Nur die Betreffzeile ist ersichtlich. Sonst steht da nur
Von:[Dein Name]
Nachrichtentext:
[Deine Nachricht]
Antworten kann ich, es geht auch an die richtige Adresse und dass was ich dann schreibe kann ich dann auch lesen aber auch da ist kein Text welcher vom Formular gesendet wurde.
Ich weiss einfach nicht woran es liegen könnte. Hast du einen Tipp?
Liebe Alexandra,
Du musst Deine Textfelder im Reiter Email noch hinzufügen. Wie das genau geht, siehst Du in diesem Video: https://www.youtube.com/watch?v=dMazshucWTY&t=5s
LG Sandra
Vielleicht habe ich es auch hier übersehen … in dieser tollen Beschreibung …
Ich will gerne, dass der Nutzer meiner Webseite nach dem Ausfüllen eines Kontaktformulars eine Datei runterlasen kann … geht das mit CR7 ? Wenn ja .. wie?
Hallo Bernhard,
nein das geht nicht, aber Du könntest ihn auf eine andere Seite weiterleiten, wenn er den Senden-Button geklickt hat. Auf der Seite kannst Du dann einen Download hinterlegen.
Hier findest Du den Code-Schnipsel, den Du zur Weiterleitung auf der Seite einbinden musst, auf der Du auch den Shortcode vom Kontaktformular hinterlegt hast: https://contactform7.com/redirecting-to-another-url-after-submissions/
Wenn Du Hilfe brauchst, bitte einfach per Mail an kontakt@sandra-messer.info melden.
LG Sandra
Hallo Sandra,
wo gibt es im CF7 die Möglichkeit, den Bestätigungstext (nach Absenden des Formulars, z.B. „Formular erfolgreich übermittelt“) zu ändern?
Hallo ThoBue,
klar dafür gehst Du bei deinem jeweiligen Formular einfach auf den Reiter „Meldungen“ und dort ist es gleich der erste Eintrag, den Du wie gewünscht verändern kannst.
Lg Sanddra
Vielen Dank, Sandra, ich muss blind gewesen sein,
scheinbar habe ich nur unten gesucht. Also noch einmal vielen Dank und entschuldige meine Anfrage.
Immer gerne ;)
Hallo Sandra,
Ich habe bei meinem Kontaktofrmular mehrere Felder hinzugefügt, bekomme in den emails aber nur die Felder auch zugeschickt, die bereits vorher eingestellt waren. Kannst du mir da helfen?
Hallo Philipp, hast Du Dir alle Videos zum Contact Formular von mir genau angesehen? Du muss alle Felder die du zusätzlich in Dein Formular einfügst auch im Reiter „Email“ bei Nachrichtenkörper hinzufügen! Sonst werden Dir die Antworten auf Deine Fragen nicht mit übermittelt. Hier kommst Du noch mal zur Playlist mit allen CF7 Videos: https://www.youtube.com/watch?v=w7_E_yMRnlQ&list=PLCVhfPXwn8VqDJ46JDHGgm4WJ8cWofe7l
LG Sandra
Liebe Sandra, ich konnte mir anhand Deines tollen Tutorials ein Kontaktformular anlegen. Das Testmail habe ich erfolgreich abgeschickt und erhalten, jedoch wurde das angehängte Foto nicht mitgeschickt. Im Mail steht da nur der Name der angehängten Datei. Aber die Datei selbst fehlt. Woran könnte das liegen?
Hallo Björn, das Problem liegt vermutlich am Webhoster hat. Der hat aus Sicherheitsgründen die von WordPress verwendete PHP Funktion mail() deaktiviert.
Versuch es mit dem Plugin WordPress SMTP Mail. Damit lässt sich einstellen, das WordPress die Emails zukünftig über SMTP verschickt. Lg Sandra
hallo Sandra. ich hoffe, du kannst mir weiterhelfen. ich habe bei „from“ und „to“ meine email Adresse eingetragen, dann bei additional header Reply-To: [your-email]. ich habe es jetzt getestet, habe die mail bekommen. allerdings steht bei der Absender Adresse vor der email „WordPress“, ich würde dort lieber den Namen des Absenders haben. wie kann ich das machen? es sieht nicht gut aus, wenn man auf die mail antwortet. und dort „WordPress“ steht. vielen Dank und schoene gruesse von den Philippinen -)
Hallo Rico, die Mail wird ja nicht vom Absender verschickt, sondern über Deine Webseite – also von WordPress – darum kann dort nicht der eigentliche Absender drinnen stehen. Wenn Du jemanden antwortest, musst Du unbedingt darauf achten, dass Du seine Mailadresse verwendest und nicht einfach auf Antworten im Mailprogramm klickst. Lg Sandra
Hallo Sandra,
Du hast mir bereits mit Deinen Youtube WordPress Anleitungen bereits 2013 sehr geholfen. Vielleicht auch bei Contakct form 7:
Iich habe ein Kontaktformular auf meiner Seite und möchte, dass der Anfragende auch das ausgefüllte Formular übersendet bekommt. ich habe hierzu eingegeben:
Unter Formular:
Kopie Ihres Auftrags:
Kopie dieses Auftrags für Sie?
[radio kopie „Ja, bitte senden Sie eine Kopie per E-Mail an mich“ „nein danke“]
Unter E-Mail:
Kopie Ihres Auftrags:
Kopie dieses Auftrags für Sie?
[kopie]
Es kommt aber keine Kopie bei dem Ausfüllenden an? Die englische Anleitung hilft mir leider nicht und ich finde den Fehler nicht. Hast Du eine Lösung
Hallo Barnie, das er auf Wunsch – also per Auswahl – die Mail bekommen kann oder nicht, ist mir nicht bekannt wie oder ob das funktioniert.
Ich weiß nur dass man eine generelle Kopie an den Absender schicken lassen kann in dem man bei „Zusätzlicher Kopfzeile“ folgendes einträgt: Bcc: [your-email]
Lg Sandra
Hallo Sandra, erstmal vielen danke für deine Zahlreichen Video´s
habe nun selbst ein Problem was normalerweise leicht zu lösen ist nur irgendwie will er nicht, ich vermute neues Update bei CF7
ich möchte gerne die ersten beiden Felde bei mir neben einander haben anstatt untereinander…beim letzten mal hats locker geklappt jetzt kriege ich das nicht mehr hin….kannst du mir den Passenden code verraten……..
::::::::::::::::> das ist mein Jetziger code:::::::::::::::>
Ihr Name
[text* your-name]
Firma
[text Firma]
Ihre Email
[email* your-email]
Betref
[text your-subject]
Ihre Nachricht
[textarea your-message]
[submit „Senden“]
Hallo Krieger,
dafür musst Du ein bisschen CSS einsetzen. Hier habe ich einen Artikel in dem gut beschrieben wird, wie das geht: http://www.wpsnippet.com/create-a-two-column-form-using-contact-form-7/
Leider auf Englisch und wenn Du solltest schauen ob Dein Theme ein Feld namens Custom CSS hat. Ansonsten müsstest Du den Code direkt in Deine CSS reinsetzen – wäre aber nach einem Theme-Update dann weg :( Oder es gibt noch die Möglichkeit mit einem Plugin so ein Custom CSS Feld zu erstellen. In das kannst Du dann alle Deine CSS Anpassungen reinsetzen und nach einem Theme-Update sind die Änderungen immer noch da. https://wordpress.org/plugins/simple-custom-css/
Lg Sandra
hi Sandra,
ich habe mir die Codes bei Google abgeholt und im WordPress entsprechend eingetragen. Dennoch funktioniert es nicht. Woran kann der Fehler liegen? Ich bin ratlos.
Liebe Grüße
Jutta
PS: Die Webseite (Kittelschürze…) ist für eine gute Bekannte, und noch in Arbeit..
Liebe Jutta,
kann ich Dir so leider nicht beantworten… liegt das Problem noch vor, dann müsste ich mal reinschauen! LG Sandra
Hallo Sandra,
ich habe ein Problem und wende mich jetzt mal an einen Profi wie du es bist. Bei mir funktioniert Contact Form 7 einwandfrei bei der Desktop Version. Wenn ich aber WPTouch Mobile aktiviere sind die Absende Button auf dem Smartphone rot markiert und funktionieren nicht mehr. Kann es sein das die Funktion erst mit der WPTouch Pro Version wieder geht oder woran liegt der Fehler. Für deine Hilfe wäre ich dir sehr dankbar. LG Patrick
Hallo Patrick,
mhh das kann ich Dir auch nicht sagen, aber ich würde WPTouch sowieso nur als Übergangslösung verwenden. Besser ist ein Theme zu verwenden das responsive ist, damit fährst Du auf alle Fälle besser. WP Touch kann nur Kleinigkeiten anpassen und größere Korrekturen wie Deine Buttons müssten nachträglich via CSS geregelt werden.
Lg Sandra
Hallo Sandra,
habe bei mir das contactform7 installiert, lief alles wunderbar. Im Kontaktformular hatte ich eine emailadresse zur domain verwendet, die Nachrichten aber per Weiterleitung an meine private emailadresse schicken lassen. Klappte prima. Dann habe ich die Weiterleitung im Webspace deaktiviert, weil ich separaten mailspace gekauft habe. Da die Freischaltung gedauert hat, habe ich die Weiterleitung wieder aktiviert und seitdem funktioniert nichts mehr. Das contactform7 bestätigt mir zwar einen efolgreichen Versand, es kommt aber keine Nachricht mehr an nur eine Fehlermeldung.“554-IP address is black listed“! Was kann ich jetzt tun? Hast Du vielleicht eine Idee, wie ich trotzdem im contactform7 eine funktionierende emailadresse verwenden kann oder kann ich einen Postausgangsserver im Plugin auch direkt eintragen? Das wäre der Vorschlag von meinem Webhoster, der auch nach einer Lösung sucht.
Bin für jede Hilfe dankbar.
Silke
Hallo Silke,
ja das Problem mit der Blacklist liegt an Deinem Hoster und daran das die Hälfte aller ID’s im Netz auf eine Blacklist könnten ;) Mit dieser Anleitung kannst Du den Lösungsansatz Deines Hosters umsetzen: https://cool-tricks.net/contact-form-7-configuration/#why-do-we-need-a-plugin-to-implement-something-basic-as-a-contact-form
Hast Du schon mal Storage versucht? Das verwende ich um alle Mails zu bekommen ;) https://www.youtube.com/watch?v=DjdAyrGKgVI
Lg Sandra
Wenn ich das Plugin Contact Form 7 installiere, wird es mir danach nur in englisch anzeigt, wie kann ich dies auf deutsch umstellen.
Hallo Monego,
CF7 passt sich automatisch der WordPress Systemsprache an die Du verwendest. Arbeitest Du mit der deutschen WordPress Version ist CF7 auch auf Deutsch nach der Installation. Um die Systemsprache anzupassen gehe einfach auf Einstellungen – Allgemein scrolle etwas runter und stelle bei „Sprache der Webseite“ auf Deutsch um. Evtl. musst du danach das Plugin nochmal löschen und wieder installieren ;) LG Sandra
Hallo Sandra,
ich möchte meine Kontaktanfragen fortlaufend nummerieren. In der Email soll dann z.B. Anfrage 200 und bei der nächsten Anfrage 201 usw. stehen.
Hast du eine Idee, wie man das machen kann?
Vielen Dank
Hallo Lars,
ich glaube dieser Artikel könnte Dir helfen: http://sevenspark.com/tutorials/how-to-create-a-counter-for-contact-form-7
Vorher aber die function.php einmal speichern, damit Du im Falle eines groben Fehlers die Ursprungsdatei wieder herstellen kannst ;)
Lg Sandra
Hallo Sandra,
vielen Dank. Hat erstmal geklappt :-) Danke. Jetzt möchte ich den Zähler vorstellen auf 2300. Hast du eine Idee?
Hier ist der Code.
//Define the key to store in the database
define( ‚CF7_COUNTER‘, ‚cf7-counter‘ );
//Create the shortcode which will set the value for the DTX field
function cf7dtx_counter(){
$val = get_option( CF7_COUNTER, 0) + 1; //Increment the current count
return $val;
}
add_shortcode(‚CF7_counter‘, ‚cf7dtx_counter‘);
//Action performed when the mail is actually sent by CF7
function cf7dtx_increment_mail_counter(){
$val = get_option( CF7_COUNTER, 0) + 1; //Increment the current count
update_option(CF7_COUNTER, $val); //Update the settings with the new count
}
add_action(‚wpcf7_mail_sent‘, ‚cf7dtx_increment_mail_counter‘);
OK der Kommentar ist schon ein bisschen her, hast Du es schon gelöst oder soll ich den Code erweitern? Lg Sandra
Hallo Sandra bei mir ist im contact form 7 alles in englisch,
bei dir im Video alles auf deutsch … warum?
Gruss siggi
Hallo Siggi, normalerweise passt sich Contact Form 7 an die Sprache Deiner WordPress Installation an. Du musst dafür auf Einstellungen (Settings) – Allgemein (General) und dort bei Sprache der Webseite Deutsch auswählen. LG Sandra
Hallo Sandra,
Ich habe mir die Videos zu Contact Form 7 angeschaut und habe zwei Fragen aber dazu:
1.) wenn ich z.B. ein Text-Feld angelegt habe; wie gelange ich dann wieder zu dem ursprünglichen Popup-Fenster (wo der Name eingetragen oder das Feld als Pflichtfeld festgelegt wurde)?
Geht dies überhaupt nicht mehr?
2.) wenn ich zwei Felder nebeneinander haben möchten, dann kenne ich dies noch, dass man z.B. ein Feld mit einer Länge von 50 Zeichen und das andere daneben mit 10 Zeichen Feldlänge definieren konnte.
Geht dies mit Contact Form nicht?
LG Stefan
Hallo Stefan,
Frage 1 verstehe ich leider nicht, denn bei Contact-Form gibt es doch gar kein Pop-Up?!
Frage 2 hat was mit der Formatierung zu tun und Du musst das dann über CSS regeln. Hier mal zwei Links, die Dir weiterhelfen: http://forum.wpde.org/plugins-und-widgets/132051-contact-form-7-felder-nebeneinander.html
http://contactform7.com/styling-contact-form/
LG Sandra
Hallo Sandra,
wie richte ich folgendes ein?
Ich habe ein Wort, klicke es an, dort öffnet sich ein neues Fenster mit dem Kontaktformular.
Viele Grüße aus der Lüneburger Heide
Silke
Hallo Silke, zuerst erstellst Du eine Seite mit dem Kontaktformular, veröffentlichst diese und kopierst Dir die URL aus der Adressleiste. Dann wechselst Du in die Seite mit dem Wort das Du verlinken möchtest. Markiere das Wort, klicke oben im Editor auf das Symbol mit der Kette für Link einfügen und kopiere die URL des Kontaktformulars hier hinein. Fertig! LG Sandra
Hallo Sandra,
wie kann ich in dem Kontaktformualr eine extra Sendebestätigung installieren, wie z.B. „Ihre Anmeldung wurde erfolgreich versandt!“ in einem neuen Fenster oder einer Box anzeigen lassen? Bislang erscheint dieser Text nur ganz klein unter dem Formular.
Danke für deine Antwort im Voraus und viele Grüße
Oliver
Hallo Oliver,
das müsstest Du mit Hilfe von CSS machen. Damit kannst Du die Box dann so anpassen, wie sie Dir von der Größe und Farbe her am besten gefällt. Wenn Du selber kein CSS beherrscht, kannst Du das nette Zusatzplugin dafür verwenden: https://de.wordpress.org/plugins/contact-form-7-style/
Hier kannst Du noch viele weitere andere Style-Anpassungen für Dein Kontaktformular vornehmen.
Viele Grüße
Sandra
Hallo Sanda,
SUPER deine Videos !!
Ich habe ein Formular mit Foto hochladen.Leider sehe ich nur der nahmen des Bildes, kann nicht runter laden, was mache ich falsch ?
Hallo Wiel,
zum Verständnis bräuchte ich noch eine genauere Angabe: Meinst Du wenn man Dir die Mail mit dem angehängte Bild sendest, kannst Du dieses nicht öffnen?
Danke und viele Grüße
Sandra
Hallo Sandra
Besten Dank für die tollen Infos. Noch eine Frage: Wir führen unsere Webpage zweisprachig. (D/E) Wie kann ich bei reCAPTCHA den Text in E angeben? (ich bin kein Roboter)
Danke
Simona
Hallo Simona, hierfür musst du eine Anpassung bzw. Duplikation im Skript machen und diese z.B. in recaptcha2 benennen sowie den Englischen Ländercode hinzufügen. Dann steht es dir im Formular zukünftig zur Auswahl. Ist nicht ganz leicht, hier mal eine englischsprachige Anleitung dazu: http://stackoverflow.com/questions/18859857/setting-recaptcha-in-a-different-language-other-than-english
Lg Sandra
Hallo Sandra
Danke für deine immer tollen Tips und Tricks
Ich such ne möglichkeit den Schreiber mit seinem Text per Mail zu beliefern.
Hab das mit Additional Headers und Reply-To: [your-email] versucht. Funktioniert aber nicht
kannst Du mir die Lösung verraten?
Danke, einen guten Tag und Gruss
RichArt
Kurze Nachfrage: Du möchtest also dass derjenige der das Kontaktformular ausfüllt es ebenfalls per Mail erhält? Hab ich das richtig verstanden? Lg Sandra und Dankeschön für das Lob :)
Hallo Sandra
Genau, danke schon mal
Gruß RichArt
Hallo RichArt,
aktiviere einfach mal bei Deinem Kontaktformular unter E-Mail das Feld E-Mail (2). Dort ist standardmäßig schon der Platzhalter [your-email] hinterlegt. Solange du das Mailfeld nicht anders definiert hast, müsste das schon funktionieren. Lg Sandra
Hi Sandra,
Wenn wir (nicht ganz hellen WordPress User) dich nicht hätten…
Vielen Dank für die Lösung, auf die man(n) eigentlich selber kommen könnte…
Du hast 3 meiner Karten gut, einfach die RC0xx Nummern merken und in meinem Kontaktformular einfügen und dann kannst Du gleich sehen dass es funktioniert. Das Yoga-Schaf weiss ich, gefällt Dir;-) und was noch?
Herzlichen Dank und auf ein ander ma(i)l
LG RichArt
Hallo RichArt,
Dankeschön dann werde ich jetzt endlich mal auf Dein Angebot zurück kommen und in meiner Freizeit (vermutlich mal spät in der Nacht) durch Deinen schönen Karten-Shop stöbern :)
Liebe Grüße Sanda