Schritt-für-Schritt: So änderst du in Divi 5 die Textfarbe der Erfolgsmeldung direkt in den Kontakt-Modul-Einstellungen (Reiter Erweitert > CSS).
Textfarbe der Erfolgsmeldung im Divi 5 Kontakt-Modul anpassen
Hast du dich schon gefragt, warum du in den Design-Optionen von Divi 5 keinen direkten Schalter für die Textfarbe der Erfolgsmeldung findest?
Wenn ein Besucher dein Formular abschickt, erscheint eine Bestätigung (z. B. „Vielen Dank für Ihre Nachricht“), die oft farblich nicht zum Hintergrund passt.
Die Lösung ist simpel und wird direkt im jeweiligen Modul hinterlegt. So bleibt die Änderung punktgenau auf dieses eine Formular begrenzt.
Die Lösung: Eigenes CSS im Erweitert-Tab
Die Lösung: Präzises CSS im Modul
Anstatt das CSS global für die ganze Website zu schreiben, nutzen wir die lokalen Einstellungen. So kannst du für jedes Formular eine individuelle Farbe festlegen.
Schritt-für-Schritt-Anleitung:
Öffne deine Kontakt-Modul-Einstellungen.
Klicke oben rechts auf den Reiter Erweitert.
Wähle dort den Menüpunkt CSS (für eigenes CSS).
Füge in das Textfeld den folgenden Code ein:
———— —————— ——————-
*/
selector .et-pb-contact-message p {
color: #ffffff; /* Ersetze #ffffff durch deinen Wunsch-Farbcode */
font-size: 20px;
}
—————- ——————- ————–
Warum die Textfarbe so wichtig ist?
In Divi 5 übernimmt das Feld der Erfolgsmeldung automatisch die Hintergrundfarbe des gesamten Kontakt-Moduls. Wenn du also einen dunklen Hintergrund für dein Formular gewählt hast, die Erfolgsmeldung aber standardmäßig in dunkler Schrift erscheint, ist sie für deine Besucher nicht mehr lesbar.
Warum dieser Weg der beste ist?
Durch die Verwendung des Begriffs selector weiß Divi 5 automatisch, dass dieser Code nur für genau dieses Kontakt-Modul gilt.
Wichtig zu wissen:
Da dieser Code lokal im Modul gespeichert ist, musst du ihn für jedes neue Kontakt-Modul, das du erstellst, erneut eingeben. So behältst du die volle Kontrolle über jedes einzelne Element deiner Seite und verhinderst ungewollte Design-Konflikte an anderer Stelle.
Für Divi-Nutzer
Solche kleinen Anpassungen machen den Unterschied zwischen einer Standad-Website und einem professionellen Design aus. Mit diesem Snippet sorgst du dafür, dass deine Besucher eine klare, lesbare und optisch passende Rückmeldung erhalten.
Warum ich diesen Tipp teile?
Ich weiß selbst, wie frustrierend es sein kann, nach einer eigentlich simplen Einstellung stundenlang zu suchen. Da Divi 5 viele neue Wege geht, sind solche kleinen CSS-Kniffe Gold wert. Ich hoffe, dieser Beitrag spart dir die Zeit, die ich früher mit Suchen verbracht habe. Viel Erfolg bei deinem Projekt!
Ritchie von SEO MUC