Lesefortschritt:

    Divi-Such-Modul-Special – Trick #3: Innenabstand verändern

    8. Mai 2026 | CSS-Stylesheet, Divi-Theme

    Trick # 567 | Dieser Beitrag beinhaltet 405 Wörter. – Geschätzte Lesezeit: ca. 3 Minuten.

    Die Divi-Suche hat eine fixe Höhe, die Sie aber mit CSS leicht anpassen können. Je nach Webdesign kann dies empfehlenswert sein. Heute legen wir einen Innenabstand im Such-Modul des Divi-Themes fest.

    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-padding. 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-padding .et_pb_searchsubmit,
    .et_pb_search.search-box-padding .et_pb_s {
    padding: 30px;
    }
    .et_pb_search.search-box-padding .et_pb_s {
    text-indent: 15px; /* Fügen Sie links vom Texteingabefeld für die Suche Platz hinzu */
    }

    Auf der Zeile 6 empfehlen wir nötigenfalls eine Anpassung des Codes.

    Das Suchmodul wird sich nun so zeigen:

    Werbung

    Keine Inhalte gefunden.

    Werbung

     

    Pin It on Pinterest

    Share This
    Überblick über den Datenschutz

    Diese Website verwendet Cookies, damit wir Ihnen die bestmögliche Benutzererfahrung bieten können. Cookie-Informationen werden in Ihrem Browser gespeichert und dienen dazu, Sie wiederzuerkennen, wenn Sie auf unsere Website zurückkehren, und unserem Team zu helfen, zu verstehen, welche Bereiche der Website Sie am interessantesten und nützlichsten finden.