Farbe der Top Navigation ändern

Hallo zusammen, finde zum Thema Top Navigation immer nur ein “transparent” in der CSS Datei. Kann der obere Balken nur durch eine neue Grafik eingefärbt werden? Wie sieht`s dann allerdings mit den verschiedenen Farbtönen aus, sprich Kategorie gewählt = dunkler. Gruß Jens

Hat hier niemand eine Idee!?

Wenn ich deine Frage verstehen würde, hätte ich evtl eine Idee :wink: Du kannst die Navi doch per CSS so gestalten wie du willst. Hintergrundgrafik, feste Farbe, Transparent etc. Was meinst du genau?

Finde die entsprechende Stelle in der CSS leider nicht. Eigentlich müsste sich doch etwas ändern, wenn ich hier die Werte ändere, oder!? #topbar input {color: #666;border-color:#555;}

Ohne das Template zu kennen bzw. einen Link zur Seite kann ich dir nicht weiterhelfen. Ich kenne ja die CSS Datei nicht :wink:

Die Farben der Top-Navi sind in den CSS Dateien hinterlegt. Such mal nach #mainNavigation…müsste in der colors.css so um Zeile 65 und in den Untertemplates in der black, blue etc. css so um die Zeile 71 sein…

Hier der Auszug aus der css Datei: /* SHOP NAVIGATION ------------------------ */ #topbar input {color: #666;border-color:#555;} #topbar input:hover {border:0 none; } #topbar .currency {border-color: #c9c9c9} #topbar select {color: #666;background-color: transparent;} .my_options a {color: #666} #mainNavigation {background-color: transparent;} #mainNavigation a {color:#444;border-left-color: #aaaaaa; border-right: 1px solid #fff;} #mainNavigation .dropactive:hover a {color: #000000;} #mainNavigation ul li a.active {color: #fff;border-right: 1px solid #c4c4c4;border-left: 1px solid #b5b5b5; } #mainNavigation ul li a.first {border-left: 0 none;} Theoretisch müsste ich doch nur die Zeile #topbar input {color: #666;border-color:#555;} anpassen, oder!?

Wenn Du nur die Hintergrundfarbe der oberen Navi-Zeile ändern willst wäre es wohl eher (hier als beispiel Template gray / gray.css) [quote]#mainNavigation {background-color: #7c7c7c;}[/quote] Die Farbe der unteren Navi-Zeile (die mit dem Default-Suchfeld) findest Du in der gleichen css unter Zeile 397 [quote]div#searchcontainer {background-color:#e9e9e9;}[/quote]

1 Like

[quote=„user_one“]Hier der Auszug aus der css Datei: /* SHOP NAVIGATION ------------------------ */ #topbar input {color: #666;border-color:#555;} #topbar input:hover {border:0 none; } #topbar .currency {border-color: #c9c9c9} #topbar select {color: #666;background-color: transparent;} .my_options a {color: #666} #mainNavigation {background-color: transparent;} #mainNavigation a {color:#444;border-left-color: #aaaaaa; border-right: 1px solid #fff;} #mainNavigation .dropactive:hover a {color: #000000;} #mainNavigation ul li a.active {color: #fff;border-right: 1px solid #c4c4c4;border-left: 1px solid #b5b5b5; } #mainNavigation ul li a.first {border-left: 0 none;} Theoretisch müsste ich doch nur die Zeile #topbar input {color: #666;border-color:#555;} anpassen, oder!?[/quote] topbar input wäre das Formularfeld in der Navi :wink: #mainNavigation {background-color: #Hier der Farbcode;}

1 Like

Habe jetzt aus #mainNavigation {background-color: transparent;} #mainNavigation {background-color: #7c7c7c;} gemacht und den Cache gelöscht, jedoch ohne Veränderung

Der CSS Code ist auf jeden Fall richtig. In welcher Datei hast du das nun gemacht? Ich empfehle dir mit Firefox und Firebug zu arbeiten, da kannst du deine Änderungen direkt im Browser machen und siehst sofort die Auswirkungen.

Endlich gfeunden, es wurden bereits Anpassungen vorgenommen, allerdings wurden diese ganz ans Ende der CSS gesetzt.