Elementor-Form-gestalten

Elementor Kontaktformular (schöner) gestalten

Elementor Form gestalten

Zugegeben, das Elementor Form ist in seiner Ursprungsform nicht das schönste seiner Art. Ich habe auch schon erlebt, dass User sich ein anderes Formular-Plugin installiert haben, das von Hause aus besser aussah.

Aber mit ein paar Handgriffen kann auch das Elementor Form zu gestaltet werden, dass es richtig schick aussieht.

Zum Vergleich:

Unbearbeitetes Formular:

Bearbeitetes Formular:

Schritte zum Anpassen

Folgende Anpassungen habe ich vorgenommen, damit das Formular so aussieht, wie oben zu sehen.

Platzhalter rausnehmen

Zunächst habe ich die Platzhalter gelöscht, damit die Felder leer sind:

Elementor Form - Platzhalter löschen

Abstände anpassen

Dann habe ich den Reihenabstand und den Abstand der Feldnamen erhöht, so dass die Darstellung etwas aufgelockerter ist:

Schrift der Feldnamen anpassen

Damit die Feldnamen nicht ganz so groß erscheinen, habe ich die Schrift etwas verkleinert und den Schriftschnitt vergrößert (fetter):

Rahmen anpassen

Nun habe ich den Rahmen der Felder angepasst. Dieser wird jetzt nur noch unten und links angezeigt. Die Rahmenfarbe habe ich etwas aufgehellt: #C8C8C8

Elementor Form - Rahmen anpassen

Schaltfläche anpassen

Letzter Schritt: Die Anpassung der Schaltfläche. Ich habe die Ausrichtung auf „links“ geändert und die Spaltenbreite auf 30 % reduziert.

Elementor Form - Schaltfläche

Das wars 😉

Kommentar schreiben

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert

Weitere Artikel

Mit dem WordPress-Plugin Elementor Pro lassen sich schnell und einfach Formulare erstellen, bspw. für Newsletter oder die Kontaktseite. In diesem...
Learnpress bietet zwar ein eigenes Zahlungssystem, wenn du aber mehr Flexibilität benötigst, dann solltest du das kostenlose Woocommerce-Plugin als Zahlungssystem...
Modern Events Calendar rechtssicher einsetzen Heute geht es einmal um die rechtssichere Einbindung des Moder Events Calendar-Plugins. Meine Hinweise stellen...

Weitere Tutorials

Learnpress bietet dir die Möglichkeit, Kursfortschritte für bestimmte Kurse oder ausgewählte Nutzer zurückzusetzen. Dies kann bspw. notwendig sein, wenn sich...
Viele Themes und Pagebuilder (bspw. Elementor) bringen schon eine große Auswahl an Icons mit. Möchte man aber bspw. Yoga-Posen oder...
Einleitung In diesem JetEngine-Tutorial zeige ich, wie man bestimmte Posttypen miteinander verknüpfen kann.  Das Tutorial richtet sich an WordPress-Nutzer, die...
Newsletter abonnieren

Erhalte regelmäßig Informationen zu neuen Tipps und Tutorials.