Seite 1 von 2
Haupt- und Servicenavigation
Verfasst: Mi 17. Dez 2003, 12:15
von vivi
Hallo,
bin ziemlich neu und hab so gut wie keine Ahnung.
Aber ich hab auf meiner Seite links die Hauptnavigation und oben will ich als Balken eine weiter Navigation. Beide haben die gleichen "Punkte". Also immer "Wir über uns", "Geschäftsfelder", "Solutions". Klappt eigentlich alles ganz gut.
Jetzt will ich in der oberen Navi, bei mir Modul Servicnavigation, erreichen, dass auf der aktiven Seite der Hintergrund ein anderer ist.
In meinem css hab ich die Möglichkeiten active, hover, link und visited. Aber bei keinem davon bleibt der Hintergrund der gewählten Seite anders.
Etwas kompliziert, trotzdem danke!
Verfasst: Mi 17. Dez 2003, 13:12
von wolfganggarella
hi vivi,
nimm' Dein Standardlayout und "kopiere es". Neuer Name z.B. Service. In diesem Layout ganz normal im <head> einen style definieren z.b: body { background-color: #FF6666; }.
Erzeuge ein neues Template z.B. "Service" auf der Basis des Layout Service. Vorkonfigurieren.
Im Content der Kategorie Servicenavi das Template Service zuordnen.
Jedem Artikel der Kategorie das Template Service zuordnen.
Voila, ein gedämpftes rot als Background der Servicenavi.
Grüße
Wolfgang
Verfasst: Mi 17. Dez 2003, 14:24
von vivi
Hallo,
ich muss was falsch gemacht haben, denn ich hab keine Veränderung bemerkt...
Hier ist mein "neues" Layout (iTmServiceLayout):
<html>
<head>
<title>blablabal</title>
<link rel="stylesheet" type="text/css" href="css/format.css">
</head>
<body style="margin:0" background-color: #FF6666>
<table border="0" cellpadding="0" cellspacing="0" width="800" ID="TableTitle">
<tr>
<td class="titlebar" >
<img src="itmImages/logoKlein.gif"/>
</td>
<td bgcolor="#8caade" align="right">
<img src="itmImages/bannerKlein.jpg" />
</td>
</tr>
</table>
<table border="0" cellpadding="0" cellspacing="0" width="800" ID="TableMenuBar">
<tr>
<td class="banner" width="190"> </td>
<td class="banner" width="610">CMS_CONTAINER[3]</td>
</tr>
</table>
<table border="0" cellpadding="0" cellspacing="0" width="800" height="100%" ID="TableContent">
<tr>
<td width="190" height="111" vAlign="top">
<table border="0" height="100%" cellpadding="0" cellspacing="0" ID="TableMenu" >
<tr>
<td class="indexHome" height="25" width="100%" >Home</td>
</tr>
<tr>
<td class="index" width="100%" bgcolor="#8caade" vAlign="top" >CMS_CONTAINER[5]</td>
<tr class="index2" width="100%" </tr>
</tr>
</tr>
</table> </td>
<td width="610" height="111" vAlign="top">
<table border="0" cellpadding="0" cellspacing="0" class="content" width="100%" ID="TableInnerContent">
<tr>
<td class="headline" height="40" width="100%">CMS_CONTAINER[6]</td>
</tr>
<tr>
<td class="subheadline" height="30" width="100%">CMS_CONTAINER[7]</td>
</tr>
<tr>
<td class="content" width="100%">CMS_CONTAINER[8]</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
Wo muss denn da jetzt das: body { background-color: #FF6666; } hin?
Anschließend hab ich das Template iTmServiceT erstellt und dem das iTmServiceLayout zugewiesen.
Im container 3 hab ich das Modul Service Navigation. usw.
Im Content gibt es die Kategorie Servicenavi nicht, die heißt glaub Hilfsnavigation, dieser hab ich das iTmServiceT zugewiesen und auch den Artikeln darunter.
Hm, wie gesagt, funtst nicht.
Grüßle Vivi
Verfasst: Mi 17. Dez 2003, 14:36
von vivi
Mittlerweile glaub ich, dass wir uns falsch verstanden haben, weil jetzt hab ich glaub das geschafft, was Du meintest. Der Hintergrund der ganzen Seite/Artikel wird rot. Ich will aber, dass nur der "Reiter" inder Service Navigation rot wird und zwar der, von der Kategorie, die gerade aktiv ist.
Verfasst: Mi 17. Dez 2003, 14:39
von ttb
Du musst vermutlich die Template-Dateien in cms/templates anpassen.
Verfasst: Mi 17. Dez 2003, 14:44
von vivi
Für die Servicanavigation find ich kein Template und wenn ich cms\templates\hilfsnavi.html verändere, tut sich nichts. Welches wäre denn das richtige Template?
Verfasst: Mi 17. Dez 2003, 14:50
von ttb
Oops, die Servicenavigation wird über die Modulausgabe definiert.
Verfasst: Mi 17. Dez 2003, 14:54
von vivi
Dazu muss man wohl php können und das fehlt mir leider. Hast Du ne Idee? Es ist doch das Modul "Service Navigation"? Nur, damit wir beide vom gleichen reden ,-)
Verfasst: Mi 17. Dez 2003, 15:01
von ttb
Ja, das meinte ich.
Die Ausgabe sieht in der Modulausgabe etwa so aus:
Code: Alles auswählen
echo '<td height="21" class=".navigation" style="border: 0px; border-top:1px; border-color: #F7C473; border-style: dashed; background-color: #FFFFFF; padding-left:7px; padding-right:7px;">
<a class="klein" href="front_content.php?idcat='.$db->f("idcat").'">'.$db->f("name").'</a></td>';
die kannst du z.B. durch ne Klassendefinition im a-Tag erweitern. Alternativ könntest du auch einfach über Style -> Styleeditor die Klassen klein und navigation ändern.
Verfasst: Mi 17. Dez 2003, 15:19
von vivi
Mein Teil sieht da so aus
Code: Alles auswählen
echo '<td height="21" class="menubar" >
<a class="klein" href="front_content.php?idcat='.$db->f("idcat").'">'.$db->f("name").'</a></td>';
Das passende css so:
Code: Alles auswählen
...
.menubar {padding-left:3px; padding-right:3px; color:#FFFF00}
A.klein:active {background-color: #00ff00;} /*keine Panik, nur zum Test*/
A.klein:hover {font-family: arial, helvetica, sans-serif; text-decoration: none; color: #ffffff; background-color: #8caade;}
A.klein:hover {border-top: 2px solid #81f5cd; padding-top: 3px; }
A.klein:visited {font-family: helvetica, arial, geneva, sans-serif; font-size:13; text-decoration: none; color: #ffffff;}
A.klein:visited {font-weight:bold; height: 21px; padding: 6px 8px 2px; }
Schnaggelts bei Dir? Bei mir leider nicht...
Verfasst: Mi 17. Dez 2003, 15:33
von ttb
Mh, das kann auch schlecht funktionieren, weil es bei den Pseudoformaten eine bestimmte Reihenfolge gibt, die unbedingt eingehalten werden muss!
Richtige Reihenfolge: :link, :visited, :hover, :active
Siehe
http://selfhtml.teamone.de/css/eigensch ... tive_focus
Verfasst: Mi 17. Dez 2003, 15:44
von vivi
Peinlich, ok, das sollte man dazu natürlich wissen.
Jetzt hab ichs so:
Code: Alles auswählen
A.klein:link {font-family: arial, helvetica, sans-serif; font-weight: bold; text-decoration: none; height: 21px; padding: 7px 9px 3px; }
A.klein:hover {font-family: arial, helvetica, sans-serif; text-decoration: none; color: #ffffff; background-color: #8caade;}
A.klein:hover {border-top: 2px solid #81f5cd; padding-top: 3px; }
A.klein:visited {font-family: helvetica, arial, geneva, sans-serif; font-size:13; text-decoration: none; color: #ffffff;}
A.klein:visited {font-weight:bold; height: 21px; padding: 6px 8px 2px; }
A.klein:active {background-color: #00ff00;}
Aber die gerade aufgerufene Seite, also damit die ein anderes aussehen hat, bzw. der link dahin, dafür gibt es kein Format oder tag. Oder seh ich das falsch?
Navigation
Verfasst: Mi 17. Dez 2003, 16:14
von kuchi
Hallo,
wenn ich Deine Frage richtig deute, dann möchtest Du, daß Dein aktiver Link als Beispiel eine bestimmte Farbe annimmt? Wenn ja, dann geht das mit
a.klein:active {...color:#009933 oder red/blue..;...}
wenn Du das meinst.
Gruß kuchi
Re: Navigation
Verfasst: Do 18. Dez 2003, 08:47
von vivi
Hallo,
ja genau das will ich. Mit dem
a.klein:active {...color:#009933 oder red/blue..;...}
hb ichs schon probiert, das bleibt immer nur ganz kurz in der anderen Farbe. Fast so, wie wenn die andere Farbe nur genau während des Mausklicks an ist.
Trotzdem danke!
Verfasst: Do 18. Dez 2003, 10:55
von wolfganggarella
hi vivi,
hatte Dich zunächst falsch verstanden.
In Contenido sind die Links im Standard grundsätzlich aktiviert, auch der zum aktiven Inhalt.
Ich habe das bei mir für die Service-Navi so gelöst:
In der while-Schleife im Modul der Servicenavi wird nach der Ausgabe der td's mit:
Code: Alles auswählen
echo '<td height="21" class=".navigation" style="border: 0px; border-top:1px; border-color: #F7C473; border-style: dashed; background-color: #FFFFFF; padding-left:7px; padding-right:7px;">';/*hier echo abschließen*/
die Bedingung eingebaut:
Code: Alles auswählen
if($db->f("idcat")!=$idcat){
echo '<a class="klein" href="front_content.php?idcat='.$db->f("idcat").'">'.$db->f("name").'</a>';
}else{
echo '<span class="nonavi">'.$db->f("name").'</span>';}
und dann die td abgeschlossen:
Hierzu musst Du noch die Klasse .nonavi erstellen mit dengleichen Eigenschaften wie der hover-Zustand beim Link, ggfs zusätzlich noch mit display: block formatieren.
Sollte das gewünschte Ergebnis bringen.
Gruß
Wolfgang