Kontaktformular 7 ist ein Plugin WordPress unglaublich beliebt für die Erstellung von Kontaktformularen. Sie können Formulare ohne HTML-Codierung erstellen. diese Formen kann Funktionen wie das anbieten CAPTCHAHerunterladen von Dateien Umfragefelder etc ...

Obwohl der 7-Standardstil für die meisten grundlegenden Kontaktformulare ausreicht, müssen Sie ihn häufig ändern.

Dadurch wird die Standardformularstruktur geändert, um den Zugriff zu erleichtern. Er fügt auch die Kurzwahlnummern [responsiv] über dem Formular, sodass ein Fehler beim Absenden des Formulars auf dem Formular angegeben wird.

Wenn Sie noch nie eine WordPress-Website erstellt haben, finden Sie es heraus So installieren Sie ein WordPress-Blog mit einem FTP-Client

Für das Standardformular lautet der vom Plugin generierte Code:

[Antwort] Ihr Name (erforderlich) [Text * Ihre-Name-ID: Ihr-Name] Ihre E-Mail (erforderlich) [E-Mail * Ihre-E-Mail-ID: Ihre-E-Mail] Ihr Betreff [Text Ihre-Betreff-ID: Ihr Betreff] Ihre Nachricht [Textbereich Ihrer Nachrichten-ID: Ihre Nachricht] [Senden "Senden"]

Einige Plugins das Formular Kontaktformular anpassen 7

1. Kontaktformular 7 Style

Le-Plugin Kontakt-Formular 7 Stil hat eine Reihe von Stilen zur Auswahl.

Für Benutzer des Twenty Fifteen-Themas gibt es auch einen kompatiblen Stil.

Um einen Stil anzuwenden, gehen Sie zu " Kontaktstile> Schnellbearbeitung Überprüfen Sie das Formular, in dem Sie den Stil anwenden möchten, und klicken Sie dann auf " Aktualisierung ".

2. Kontaktformular 7 Skins

So verwenden Skin Kontaktformular 7, erstelle eine neue Kontaktformular und scrollen Sie die Seite nach unten zum Abschnitt Skins. Sie können eine Vorlage und einen Stil für Ihr Formular auswählen.

Sie finden Modelle, die den Formen von gewidmet sindévénements, Registrierung und Benachrichtigung.

So sieht das Umfrageformular mit dem Topaz-Stil unter Verwendung des Twenty Fifteen-Themas aus.

3. Materialdesign für Kontaktformular

Diese Stile werden auf der Grundlage der Stil Material Design.

Dieses Plugin schlägt vor, dass Sie das Standardformular löschen und seine Shortcodes verwenden.

Hier ist ein Beispiel mit dem Thema Hestia. Beachten Sie die schwebende Beschriftung, wenn der Zeiger in ein Feld im Formular verschoben wird.

Kontaktformular 7 Test auf einigen WordPress-Themes

Kontaktformular mit ColorMag WordPress Theme

In den meisten Fällen übernimmt das Kontaktformular 7 den Stil Ihres WordPress-Themas. Dies ist beim Thema der Fall Coral Dunkel.

Kontaktformular zum Thema WordPress ColorMag

Hier ist das Formular ohne benutzerdefinierten Stil. Er erbt die Farbe des blauen Knopfes ColorMag WordPress-Theme.

Ich habe zunächst ein Foto hochgeladen, das als Hintergrundbild für das Formular verwendet werden soll, und den Code der Etiketten des Formulars von grau in weiß mit einem blauen Schatten auf dem Text geändert.

Die folgenden Änderungen betrafen die Erhöhung der Ränder zwischen Formularbeschriftungen und Formularfeldern, die Änderung der Subtraktionsschaltfläche und das Hinzufügen eines Rahmens, wenn der Zeiger in die Formularfelder eintritt.

Die Anzeige von Fehler- / Erfolgsmeldungen beim Absenden des Formulars sollte ebenfalls geändert werden, damit sie korrekt angezeigt werden.

Das beim Senden des Formulars rotierende GIF wurde nicht korrekt angezeigt. Ich habe eine Alternative zu Loading.io gefunden und mit CSS darauf verwiesen.

Hier ist das resultierende Formular:

Hier ist der Code:

div.wpcf7 {Marge: 0; Polsterung: 1.5em; Hintergrund: URL ('your_background_image_url_here'); -webkit-border-radius: 3px; -moz-border-radius: 3px; Grenzradius: 3px; } .wpcf7-Label, .wpcf7-submit {Farbe: weiß; Textschatten: 1px 1px 0px rgba (40, 157, 204, 1); } .wpcf7 .wpcf7-form-control {10px 0 20px 0; } .wpcf7 .wpcf7-submit: hover {background: #186d8e; } .wpcf7-form-control: focus {border: 2px fest #289dcc; } div.wpcf7-response-output {background: #F8F8F8; Text ausrichten: Mitte; Breite: 92.5%; Marge: 1em 0em 1em 0em; -webkit-border-radius: 3px; -moz-border-radius: 3px; Grenzradius: 3px; } span.wpcf7-not-valid-tip {background: #F8F8F8; Anzeige: Inline-Block; Breite: Auto; Auffüllen: 1%; -webkit-border-radius: 3px; -moz-border-radius: 3px; Grenzradius: 3px; } div.wpcf7 .ajax-loader {background-image: url ('your_loading_image_url_here'); Breite: 50px; Höhe: 50px; }

Wenn Sie den Code nicht kritzeln müssen, empfehlen wir Ihnen, unseren zu lesen 10 WordPress-Plugins zum Erstellen eines Kontaktformulars in Ihrem Blog

Entdecken Sie auch 3 Premium-Alternativen, mit denen Sie Ihre Kontaktformulare erstellen können. 

1. W8-Kontaktformular

W8 Contact Form ist eines der Plugins von Kontaktformular die beliebtesten auf WordPress. Es bietet viele Funktionen wie die Übermittlung an mehrere Empfänger, Unterstützung für Animationen, unbegrenzte Formularerstellung, verschiedene Stile und eine Vielzahl zusätzlicher Anpassungsoptionen.

Darüber hinaus bietet es Ihrer Website oder Ihrem Blog ein professionelles System, mit dem Sie leichter mit Ihren Kunden in Kontakt treten können. Sie können alle Ihre Formulare an Ihre Bedürfnisse und Ihren Geschmack anpassen.

Herunterladen | Demo | Web-Hosting

2. Kontaktieren Sie uns

Das Kontaktformular ist ein ansprechendes WordPress-Plugin und ein einfaches Tool mit zahlreichen Anpassungsoptionen, mit denen Sie ein klares und ermutigendes Formular anzeigen können, auf dem Ihre Besucher Sie kontaktieren können, indem sie ihre Nachricht hinterlassen.

Sie können die erforderlichen Felder definieren, das beste Layout der Felder auswählen und es vollständig anpassen, um Ihre Kunden oder Besucher zu ermutigen, ihre Vorschläge oder Nachrichten zu hinterlassen.

Richten Sie einfach die E-Mail-Adresse ein, unter der Sie die Nachrichten erhalten möchten, und verwenden Sie sie, um Ihr Unternehmen in die profitabelste Richtung zu führen.

Herunterladen | Demo | Web-Hosting

3. Slick Popup Pro

Slick Popup Pro ist ein WordPress-Plugin ziemlich einfach und leicht, das jedes vom Plugin erstellte Formular konvertiert Kontaktformular 7 in einem Popup. Sie verwendet das Formular und konvertiert es in ein schönes und perfekt ansprechendes Popup.

Das Popup-Formular kann verschiedene Verwendungszwecke haben, darunter: ein Informationssammlungsformular, a Kontaktformular, ein Anmeldeformular, ein Angebotsformular, ein Vorschlags- / Beschwerdeformular und andere.

Herunterladen | Demo | Web-Hosting

Empfohlene Ressourcen

Weitere empfohlene Ressourcen, mit denen Sie Kontaktformulare auf Ihrer Website oder Ihrem Blog besser erstellen und verwalten können. 

• 6 WordPress-Plugins zur Überprüfung durch CAPTCHA in Ihren Formularen
• Wie ein Kontaktformular mit Wordpress Kontaktformular 7 hinzufügen
• Wie man DSPR-konforme Formulare auf WordPress erstellt

Zusammenfassung

Voila! Das ist alles für dieses Tutorial. Ich hoffe, Sie haben weitere Ideen, um Ihr Kontaktformular anzupassen. Zögere nicht zu Teile es mit deinen Freunden in deinen bevorzugten sozialen Netzwerken. 

Sie können jedoch auch unsere RessourcenWenn Sie mehr Elemente benötigen, um Ihre Projekte zur Erstellung von Internetseiten durchzuführen, konsultieren Sie unseren Leitfaden auf der WordPress-Blog-Erstellung.

Aber erzählen Sie uns in der Zwischenzeit von Ihrem commentaires und Vorschläge im entsprechenden Abschnitt.

...