^_^

[i-fekt]

^_^

[Halchteranerin]

hmm, das Modul kam mir gerade wie gerufen, weil ich dabei bin, an einer Seite zu basteln, und ich ueberlegte, wie ich sie mittelfristig tabellenfrei gestalte.
Da ist ein kleiner Fehler:

if ($e3countup != "") { echo " </ul>
</li>\n"; } else { echo "x</li>\n";}

aber das habe ich schnell gefunden, das ist auch nicht das Problem. Mein Problem ist ein anderes: ich habe einfach mal dieses Modul statt des mitgelieferten Hauptnavigationsmoduls in ein Template eingebunden, und es hat, gelinde gesagt, mein Layout komplett durcheinander gebracht.

Ich habe mir mal die Templates angeschaut, darin steht noch "natuerlich" <tr> und <td>. Die Frage ist, wie die aussehen muessen, denn vermutlich liegt das Problem auch nur daran.

Gruss
Christa

[i-fekt]

Ich habe die Codes der Templates-Files oben noch dazugeschrieben. Das "x" vor dem </li> kam eim copy + paste so mit rübergeschleift.

[Halchteranerin]

wenn schon, denn schon
Postest du bitte auch noch die css-Eintraege fuer die Navi? Danke.

[i-fekt]

Die bringen nichts, die muss man einfach selber machen. Die Klassen stehen ja dran und daran kann man sie selbst definieren. Meine CSS ist auf mich zugeschnitten und das aussehen der Listen auch.

[Halchteranerin]

Aehm, na ja, das war ja nur a href, wie ich beim zweiten Mal hinschauen gesehen habe , die konnte ich aus meinen alten Templates einfach uebernehmen.
Was mir aber etwas Kopfzerbrechen bereitet: im Modul selbst sind auch noch verschiedene Klassen angegeben, so z.B. "menu" beim div-Tag und e1, e2, e3 bei den ul-Tags. Die habe ich bisher nicht gross ueber css formatiert, daher waere es hilfreich, wenn du deine Eintraege als Beispiel posten wuerdest. Dass sie auf deine Seite abgeschnitten sind, ist mir schon klar.
Mir war so, als haette man bei Listen auch eigene Bilder fuer die Listenelemente angeben koennen, aber irgendwie finde ich das nicht bei selfhtml. Taeuscht mich mein Gedaechtnis oder habe ich nicht richtig gesucht? Denn mein Problem ist, dass die Seite, die ich dabei bin, umzustellen, eigene Symbole (Dreiecke, unterschiedliche Farben fuer on und off) vor den Menuepunkten hat, und die sollte ich nach Moeglichkeit uebernehmen. Kannst du mir vielleicht sagen, ob das moeglich ist (wenn ja, wie) oder nicht?

[Enigma]

Mir war so, als haette man bei Listen auch eigene Bilder fuer die Listenelemente angeben koennen, aber irgendwie finde ich das nicht bei selfhtml. Taeuscht mich mein Gedaechtnis oder habe ich nicht richtig gesucht? Denn mein Problem ist, dass die Seite, die ich dabei bin, umzustellen, eigene Symbole (Dreiecke, unterschiedliche Farben fuer on und off) vor den Menuepunkten hat, und die sollte ich nach Moeglichkeit uebernehmen. Kannst du mir vielleicht sagen, ob das moeglich ist (wenn ja, wie) oder nicht?

Eine recht gute Seite, um solche Dinge nachzuschlagen, ist css4you.de. Da wirst Du auch bzgl. der Listenformatierung fündig: http://www.css4you.de/listproperty.html

Gruß,
Jan

[Halchteranerin]

Hallo Jan, die Seite kannte ich noch gar nicht. Danke, ich schaue sie mir mal gleich an.

[Halchteranerin]

Zu frueh gefreut. Ich glaube das, was ich haben moechte, geht so direkt gar nicht. Was ich braeuchte waere wohl eher ein Menue, das nur aus <div>s besteht, wo ich dann ueber Templates das Symbol, was vor den Menueeintraegen angezeigt wird, steuern kann. Denn so, wie es jetzt ist, kann ich ja fuer eine Liste (1., 2., 3 Ebene) ein Symbol vorgeben, aber ich kann nicht zwischen on und off unterscheiden (oder ich stehe auf der Leitung), dass bei on ein Symbol und bei off ein anderes angezeigt wird, und zwar nur bei der ersten Ebene, die 2. und die 3. sollen bloss eingerueckt sein. Ich muss mir das mal bei Gelegenheit in Ruhe angucken.

[i-fekt]

Klar geht das, mit DIVs wäre es nämlich gar nicht korrekt.

Ich habe dazu extra jedem Link eine Klasse gegeben, dadurch kannst du jeden Link individuell gestalten. z.B. e2a steht für "Ebene 2 aktiv". Natürlich ist das anpassbar wie immer du willst. Du kannst über "ul.e2 li a.e2a" zB. das Verhalten des aktiven Links gestalten.

Wenn du nur die Liste ändern willst musst du einfach den LI Tags eine Klasse geben. Praktischer ist es jedoch, die A Tags zu formatieren, so kann man die LI Tags nämlich getrost vergessen. Einfach die A Tags mit "display: block;" auszeichnen. Klingt sicher twas komisch, aber CSS ist wirklich mega easy. CSS4You ist ne ganz gte Seite zum anfangen.

Am besten ist, wenn du einen Link oder Code postet was du hast und du machen willst. Bei CSS kann ich dir immer helfen und da bekomme ich alles hin.

[Halchteranerin]

Am besten ist, wenn du einen Link oder Code postet was du hast und du machen willst. Bei CSS kann ich dir immer helfen und da bekomme ich alles hin.

Och, das lasse ich mir nicht zweimal anbieten. Ich habe zwar so ganz einfache Sachen mit css gemacht, eben Links formatiert oder so etwas, aber mir ist schon klar, dass man viel mehr damit machen kann.
Willst du das hier im Forum machen (da verlieren vielleicht die anderen das urspruengliche Modul aus den Augen ), oder wollen wir das per PN machen?

[i-fekt]

Mir egal, vielleicht bringt es den anderen auch was? Poste mal und dann schau mer weiter.

[Halchteranerin]

Also gut ... die Originalseite ist unter www.bbs3bs.de, da noch mit statischem HTML, Frames usw.
Das, was bisher in Contenido umgesetzt wurde, befindet sich unter http://cms.bbs3bs.de/cms/. Da ist (leider) noch gar nichts tabellenfrei.
Was mir gerade auffaellt: bei der Contenido-Variante gibt's noch einen Rand drum rum, sichtbar am linken und am oberen Rand.
Der "Kopf" wird noch geaendert, weil die Schule einen neuen Namen bekommt, deswegen habe ich in die beiden Kopfgrafiken (Startseite und Folgeseiten) keine Muehe mehr investiert. Wichtig waere erstmal, das Menue so wie auf der Originalseite hinzubekommen. Schoen waere, wenn der farbige Balken, mit dem das Menue hinterlegt ist, auch mit Contenido bis nach ganz unten ginge, aber das ist wohl eine Layout-Sache, die ich mir spaeter anschauen muss. CSS 4 You ist schon den Bookmarks hinzugefuegt worden, aber ich muss auch die Zeit finden, mir das mal in Ruhe durchzulesen.
Kurz zum Menue: im Off-Zustand haben alle Punkte das rote Dreieck davor. Der angeklickte Menuepunkt (also on) hat ein gruenes Dreieck davor. Beides gilt nur fuer die erste Ebene. Bei der zweiten Ebene ist die Schrift etwas kleiner und auch nicht mehr fett, die Symbole davor gibt's nicht mehr. Eine dritte Ebene gibt's zur Zeit nicht, aber die Moeglichkeit moechte ich offen halten. Da sollen die Menueeintraege nur 10px weiter rechts eingerueckt werden.
Danke schon mal fuer das Hilfsangebot.

[i-fekt]

Ganz einfach. Die Klassen müssen etwa so aussehen:

Code: Alles auswählen

li, ul {
 margin: 0;
 padding: 0;
 list-style-type: none;
 width: 200px;
}

Code: Alles auswählen

li a,
ul a {
 display: block;
}

Code: Alles auswählen

a.e1a {
 background: #cc0000 url(/i/img1.gif) no-repeat 0px 0px;
 padding: 0 0 0 20px;
 font-weight: bold;
}

Code: Alles auswählen

a.e1p {
 background: #cc0000 url(/i/img2.gif) no-repeat 0px 0px;
 padding: 0 0 0 20px;
 font-weight: bold;
}

Code: Alles auswählen

a.e2a,
a.e2p {
 padding: 0 0 0 20px;
}

Du gibst also in background die Hintergrundfarbe an, dann das Bild und mit der Angabe "no-repeat", daß es sich im Element nicht wiederholen soll. Die Px Angaben dahinter dienen der Positionierung dieses Bilds, da musst du dann nur noch je nach Grafik mal schauen wie du es am besten ausrichtest, eine Größe für Abstand von links und eine von oben.

In "ul a, li a" wandelst du den Link zu einem Blockelement, es streckt sich dann über die gesamte Breite und man kann dem Link erst dann ein Padding und Margin geben.

Die Angaben oben sind alle optional und du musst sie natürlich anpassen.

[Halchteranerin]

hmm ... da gab's noch ein paar Unzulaenglichkeiten, weil der A-Tag mir die Standard-Formatierung "geklaut" hat und die Menueeintraege deshalb unterstrichen waren.
Aber die Bilder habe ich noch nicht hinbekommen, weil ich nicht weiss, wie der Pfad angegeben werden muss. Ich hab's mit und ohne upload versucht, mit und ohne anfuehrendem "/", aber die Bilder werden nicht angezeigt. Relativ wozu muessen die Pfade angegeben werden?
Und wie (bzw. an welcher Stelle) kann ich den Abstand vom obersten Menueeintrag (Wir ueber uns) zur Oberkante vergroessern? Die Schrift passt ansonsten ganz gut, wie ich das sehe ... ich musste allerdings etwas mit den Schriftgroessen herumexperimentieren.