Widget Suche Hintergrund anpassen

    So, mein EinstandsPOST und ich hoffe ich trete nicht gleich ins Fettnäpfchen. Habe die Suche bemüht aber wirklich nichts zu meinem Problem finden können. Und zwar ist dies folgendes:

    Ich habe ein Theme welches ich anpasse, in diesem habe ich die Option meinen Sidebars einen background zu verpassen. Soweit so gut. Ich möchte aber einen weißen Hintergrund in den Seitenleisten habane (und in den Widgets) und nur der Suche, also dem widget-Suche einen grauen Hintergrund verpassen.

    Wo kann ich das machen? Ich habe diverse Änderungen bereits getestet, aber irgendwie komme ich da nicht voran. Bin ehrlich gesagt nun auch kein Coder also bitte um Nachsicht meiner Frage.

    Geh ich recht in der Annahme, dass die entsprechende Änderung hier eingegeben werden muss?

    Code
    .widget_search #search-text { border: 1px solid #ccc; padding: 4px; margin-right: 3px;}
/*.widget_search #search-submit { background: #666; color:#fff; font-weight: bold; padding: 3px;}*/

    Was muss ich denn da genau eingeben? Ich bin wirklich für jeden Tipp dankbar und freue mich auf Rückmeldungen.

    • Gerade eben
    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

    [URL per PM]

    Das ist das HTML für dein Suchen-Widget:

    HTML
    <div id="search" class="widget widget_search">
	<form id="search-form" method="get" action="<?php bloginfo('url') ?>">
		<fieldset>
			<input type="text" id="search-text" name="s" value="" />
			<button type="submit" id="search-submit">GO</button>
		</fieldset>
	</form>
</div>

    Die CSS-Regeln, die du oben gefunden hast, kannst du dafür nehmen, oder du schreibst dir an der Stelle neue hin. Selektoren hast du genug.

    Code
    .widget_search { background: ... }


    erscheint mir auf den 1. Blick am vernünftigsten.

    Hi marX,

    Dank nochmals für Deine schnelle Rückmeldung. Also ich habe die Zeile:

    HTML
    .widget_search { background: #f4f4f4;}

    eingefügt, und zwar in der style.css und zwischen die beiden oben aufgeführten Zeilen, also:

    HTML
    .widget_search #search-text { border: 1px solid #ccc; padding: 4px; margin-right: 3px;}
/*.widget_search #search-submit { background: #666; color:#fff; font-weight: bold; padding: 3px;}*/

    aber nichts passiert. :cry:

    Wie muss ich denn die Zeile ergänzen bzw. einfügen? Wie muss diese aussehen?

    Zitat von marX

    Mmh, das wird von einer späteren Regel überschrieben. Probiers mal so:

    Code
    #sidebar-1 .widget_search {}

    Das sollte spezifisch genug sein. ;)

    Das war´s. Hat geklappt super! Echt klasse. Und wieder etwas dazugelernt. Jetzt muss ich nur zusehen, dass es Designtechnisch irgendwie passt. Aber nochmals vielen Dank!

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!

Benutzerkonto erstellen Anmelden