Farbe der aktiven Kategorie ändern?

[AllyG]

Hallo,

es ist mal wieder soweit und ich habe eine Frage.^^

Ist es möglich die Kategorie in der man sich im Shop befindet (Im Kategorie-Menü) durch eine gesonderte Schriftfarbe hervorzuheben?

Sprich ich befinde mich in Überkategorie1-> Unterkategorie1-> Unterkategorie2

Ich möchte die Schriftfarbe der Unterkategorie 2 ändern, damit der Kunde sofort sieht, wo er sich befindet.

Das ganze soll sich natürlich ändern sobald der Kunde auf eine andere Kategorie switcht.^^

Es ist nämlich manchmal sehr mühsam sich zurechtzufinden wenn man 5-6 Unterkategorien hat und das obwohl ja jede Kategorie eine Farbabstufung hat.

viele Grüße

Kay



Linkback: https://www.modified-shop.org/forum/index.php?topic=14088.0

[Tomcraft]

Folgender Abschnitt in der "stylesheet.css" ist dafür zuständig:

Code: CSS  [Auswählen]

ul#categorymenu {
        background-color:#EDEDED;
        margin-bottom:15px;
        border: solid #ccc;
        border-width:0px 1px 1px 1px;
}
/* 1st TIER */
ul#categorymenu li.level1 {
        list-style-type:none;
        border: solid #fff;
        border-width:1px 0px 0px 0px;
}
ul#categorymenu li.level1 a {
        text-decoration:none;
        outline: none;
        color:#333;
        background:#eee;
        font-weight:bold;
        padding:4px 0px 4px 6px;
        display:block;
}
ul#categorymenu li.level1 a:hover {
        text-decoration:none;
        color:#333;
        background-color:#e1e1e1;
        font-weight:bold;
}
/* 2nd TIER */
ul#categorymenu li.level2 {
        list-style-type:none;
        border: solid #fff;
        border-width:1px 0px 0px 0px;
}
ul#categorymenu li.level2 a {
        text-decoration:none;
        outline: none;
        color:#333;
        background: url(img/dotted1.gif) no-repeat 8px 9px #e1e1e1;
        font-weight:bold;
        padding:4px 0px 4px 18px;
        display:block;
}
ul#categorymenu li.level2 a:hover {
        text-decoration:none;
        color:#333;
        background-color:#c7c7c7;
        font-weight:bold;
}
/* 3rd TIER */
ul#categorymenu li.level3 {
        list-style-type:none;
        border: solid #fff;
        border-width:1px 0px 0px 0px;
}
ul#categorymenu li.level3 a {
        text-decoration:none;
        outline: none;
        color:#333;
        background: url(img/dotted1.gif) no-repeat 16px 9px #c7c7c7;
        font-weight:bold;
        padding:4px 0px 4px 26px;
        display:block;
}
ul#categorymenu li.level3 a:hover {
        text-decoration:none;
        color:#333;
        background-color:#b3b3b3;
        font-weight:bold;
}
/* 4th TIER */
ul#categorymenu li.level4 {
        list-style-type:none;
        border: solid #fff;
        border-width:1px 0px 0px 0px;
}
ul#categorymenu li.level4 a {
        text-decoration:none;
        outline: none;
        color:#333;
        background: url(img/dotted1.gif) no-repeat 24px 9px #b3b3b3;
        font-weight:bold;
        padding:4px 0px 4px 34px;
        display:block;
}
ul#categorymenu li.level4 a:hover {
        text-decoration:none;
        color:#333;
        background-color:#999;
        font-weight:bold;
}
/* 5th TIER */
ul#categorymenu li.level5 {
        list-style-type:none;
        border: solid #fff;
        border-width:1px 0px 0px 0px;
}
ul#categorymenu li.level5 a {
        text-decoration:none;
        outline: none;
        color:#333;
        background: url(img/dotted1.gif) no-repeat 32px 9px #a2a2a2;
        font-weight:bold;
        padding:4px 0px 4px 42px;
        display:block;
}
ul#categorymenu li.level5 a:hover {
        text-decoration:none;
        color:#333;
        background-color:#7e7e7e;
        font-weight:bold;
}
 

Grüße

Torsten

[web28]

Hallo Kay,

das ist problemlos möglich, auch mit der 1.05 Datei.

Im Trunk ist das schon realisiert.

Gruss Web28

[Kwonga]

Hi,
wenn Du Dir mit dem Add-on "Firebug" für Firefox Deinen Shop anschaust wirst Du sehen das in ca 332 Deiner CSS die Fraben bestimmt werden. Du kannst in Firebug auch direkt ein wenig rumspielen und die Farben "testen" bevor an die CSS rangehst.
Grüße
Dirk

[AllyG]

Ich glaube web28 hat verstanden was ich meine.^^ Wie ich die Farben und Hintergründe der einzelnen Kategorien ändere weiß ich ja.^^

Ich möchte, dass die Farbe nicht festgesetzt ist sondern nur kommt, wenn der Besucher sich in der Kategorie befindet und wenn er in die nächste wechselt.

z.B in Unterkategorie 2.1 dann möchte ich das dort die Schriftfarbe blau ist und bei Unterkategorie 2 (auf der sich der Besucher befand) die Schriftfarbe von blau wieder zu Standard wechselt.

Ich habe jetzt mal im Trunk nachgeschaut und das sind doch bestimmt diese Einträge oder?

Code: CSS  [Auswählen]

ul#categorymenu li a.actparentlink { font-style:italic; }
ul#categorymenu li a.actlink { font-style:italic; text-decoration:underline; }

Ich habe sie für mich mal angepasst zum testen:

Code: CSS  [Auswählen]

ul#categorymenu li.activeparent1 a  { font-style:italic; color:#2882B3; }
ul#categorymenu li.active1 a  { font-style: italic; color: #2882B3;}

aber es passiert leider nichts

PS: Im Trunk stimmt das fast genauso wie ich es haben will nur will ich nicht den Hintergrund andersfarbig sondern die Schrift. Aber das was jetzt im Trunk ist ist genau das was ich will und es sind diese Einträge hier.

Muss ich dafür in irgendeiner anderen Datei noch was ändern?

[h-h-h]

Die "xtc_show_category.inc.php" benötigst Du in diesem Fall.

Gruß

h-h-h

[AllyG]

Spitzensache! Jetzt klappt es! Dankeschön.

[hechicero]

Hallo,

könnt ihr bitte schreiben, wo genau die Farbe der aktiven Kategorie geändert werden kann. Habe nur die Farbe aller Kategorien gefunden. Auch mit der Trunk-Version von "xtc_show_category.inc.php" komme ich nicht ans Ziel.

Danke und Grüße

hechicero

[Tomcraft]

Du brauchst dann natürlich auch die entsprechenden Styleanweisungen aus der "stylesheet.css" des Trunks.

Code: CSS  [Auswählen]

ul#categorymenu {
  background-color:#ededed;
  margin-bottom:15px;
  border:solid #ccc;
  border-width:0 1px 1px 1px;
}
ul#categorymenu li a.actparentlink { font-style:italic; }
ul#categorymenu li a.actlink { font-style:italic; text-decoration:underline; }
/* 1st TIER */
ul#categorymenu li.level1 {
  list-style-type:none;
  border:solid #fff;
  border-width:1px 0 0 0;
}
ul#categorymenu li.level1 a {
  text-decoration:none;
  outline:none;
  color:#333;
  background:#eee;
  font-weight:bold;
  padding:4px 0 4px 6px;
  display:block;
}
ul#categorymenu li.level1 a:hover {
  text-decoration:none;
  color:#333;
  background-color:#e1e1e1;
  font-weight:bold;
}
ul#categorymenu li.activeparent1 a  { font-style:italic; background:#eee; }
ul#categorymenu li.active1 a  { font-style: italic; background: #d7c9d1;}
/* 2nd TIER */
ul#categorymenu li.level2 {
  list-style-type:none;
  border:solid #fff;
  border-width:1px 0 0 0;
}
ul#categorymenu li.level2 a {
  text-decoration:none;
  outline:none;
  color:#333;
  background:url(img/dotted1.gif) no-repeat 8px 9px #e1e1e1;
  font-weight:bold;
  padding:4px 0 4px 18px;
  display:block;
}
ul#categorymenu li.level2 a:hover {
  text-decoration:none;
  color:#333;
  background-color:#c7c7c7;
  font-weight:bold;
}
ul#categorymenu li.activeparent2 a  { font-style:italic; background:#e1e1e1; }
ul#categorymenu li.active2 a  {font-style:italic; background:#d7c9d1; }
/* 3rd TIER */
ul#categorymenu li.level3 {
  list-style-type:none;
  border:solid #fff;
  border-width:1px 0 0 0;
}
ul#categorymenu li.level3 a {
  text-decoration:none;
  outline:none;
  color:#333;
  background:url(img/dotted1.gif) no-repeat 16px 9px #c7c7c7;
  font-weight:bold;
  padding:4px 0 4px 26px;
  display:block;
}
ul#categorymenu li.level3 a:hover {
  text-decoration:none;
  color:#333;
  background-color:#b3b3b3;
  font-weight:bold;
}
ul#categorymenu li.activeparent3 a  { font-style:italic; background: #c7c7c7; }
ul#categorymenu li.active3 a  {font-style:italic; background:#d7c9d1; }
/* 4th TIER */
ul#categorymenu li.level4 {
  list-style-type:none;
  border:solid #fff;
  border-width:1px 0 0 0;
}
ul#categorymenu li.level4 a {
  text-decoration:none;
  outline:none;
  color:#333;
  background:url(img/dotted1.gif) no-repeat 24px 9px #b3b3b3;
  font-weight:bold;
  padding:4px 0 4px 34px;
  display:block;
}
ul#categorymenu li.level4 a:hover {
  text-decoration:none;
  color:#333;
  background-color:#999;
  font-weight:bold;
}
ul#categorymenu li.activeparent4 a  { font-style:italic; background: #b3b3b3; }
ul#categorymenu li.active4 a  {font-style:italic; background:#d7c9d1; }
/* 5th TIER */
ul#categorymenu li.level5 {
  list-style-type:none;
  border:solid #fff;
  border-width:1px 0 0 0;
}
ul#categorymenu li.level5 a {
  text-decoration:none;
  outline:none;
  color:#333;
  background:url(img/dotted1.gif) no-repeat 32px 9px #a2a2a2;
  font-weight:bold;
  padding:4px 0 4px 42px;
  display:block;
}
ul#categorymenu li.level5 a:hover {
  text-decoration:none;
  color:#333;
  background-color:#7e7e7e;
  font-weight:bold;
}
ul#categorymenu li.activeparent5 a  { font-style:italic; background: #a2a2a2; }
ul#categorymenu li.active5 a  {font-style:italic; background:#d7c9d1; }
 

Grüße

Torsten

[hechicero]

Natürlich!  

Danke und Grüße,

hechicero