Trick # 568 | Dieser Beitrag beinhaltet 407 Wörter. – Geschätzte Lesezeit: ca. 3 Minuten.
Das Such-Modul des Divi-Themes hat standardmässig Ecken und Kanten. Je nach Webdesign möchten Sie es vielleicht ein wenig runder. Geht ganz einfach. Wir zeigen wie.
So präsentiert sich das Such-Modul im Divi Theme standardmässig:

Um das gewünschte Styling zu erreichen, müssen Sie nun dem Such-Modul eine CSS-Klasse zuweisen: search-box-rounded. Diese Klasse tragen Sie hier ein: Im Register «Advanced» des Such-Moduls, unter «CSS-ID und Klassen» und dort im Textfeld «CSS-Klassen».
Nun können Sie den folgenden CSS-Code zu Ihrem CSS-Stylesheet hinzufügen. Dieses bearbeiten Sie im Backend unter
.et_pb_search.search-box-rounded,
.et_pb_search.search-box-rounded .et_pb_s,
.et_pb_search.search-box-rounded .et_pb_searchsubmit {
border-radius: 30px; /* Passen Sie den px-Wert so an, dass er der Hälfte der Höhe des Suchfelds entspricht, um eine perfekte Pillenform zu erhalten. */
}Auf der Zeile 4 empfehlen wir nötigenfalls eine Anpassung des Codes.
Das Suchmodul wird sich nun so zeigen:

Werbung


