Menü: Bilder, Grafiken statt Link-Text

Für Fragen und Diskussionen zum Layout und Design, Templates und Stylesheets sowie Themes
Locked
mrks
New Member
New Member
Posts: 7
Joined: Mon Nov 03, 2008 10:05 pm

Menü: Bilder, Grafiken statt Link-Text

Post by mrks »

Hallo,

ich quäle mich gerade ein bisschen mit meinem menü herum. Ich hätte gerne ein vertikales menü mit bildern statt den menütexten. Ich habe im forum schon danach gesucht und auch die seite http://themes.cmsmadesimple.org/Image_menu.html dazu gefunden. Das ganze scheint für horizontale Menüs ja zu funktionieren. Sollte also für vertikale kein Problem sein.

Was aber wenn ich auch unterpunkte habe?

Geht das überhaupt? Ich finde leider keinen lösungsansatz.. Wird wahrscheinlich eine sehr statische geschichte.

Das große problem ist ja, dass ich von Anfang an ein Bild laden muss, das die Hauptpunkte der Navigation beinhaltet, aber die unterpunkte sollen ja nicht von beginn an sichtbar sein. Erst wenn ich darauf klicke sollen sich ja die unterpunte bzw unterbilder :) zeigen.
Ich müsste jeden Menüpunkt also einzeln integrieren. Gibt es schon so einen ansatz?
Ist es möglich für jede Node bzw dessen id eine grafik zu hinterlegen?
ich weiss grad nicht weiter :(

soll ich das lieber ohne menumanager machen und die liste einfach direkt ins template setzen? funktioniert das so überhaupt? wie füge ich dort die id's der nodes ein?

ohje.. spät.

danke fürs durchlesen
Last edited by mrks on Wed Dec 10, 2008 3:43 pm, edited 1 time in total.
mike-r

Re: Menü: Bilder, Grafiken statt Link-Text

Post by mike-r »

mrks wrote: ohje.. spät.
Jo. Wenn ich zwischen den Zeilen alles was ich nicht verstanden habe, richtig verstehe, dann suchst Du das TTF-Modul. Sollte ich Dich - spät - flasch verstehen, so wäre eine Skizze ganz hilfreich.
antibart
Power Poster
Power Poster
Posts: 1161
Joined: Sun Aug 17, 2008 9:29 am

Re: Menü: Bilder, Grafiken statt Link-Text

Post by antibart »

Wenn es eher statisch sein soll mit sehr individuellen, künstlerischen Grafiken (und dem Kunde ja, wenn er Seitem selbst hinzufügen möchte, eh die passenden Bilder fehlen würden), würde ich das Menu ganz einfach ohne Manager ins Template einbauen.

Wenn es nur um eine originellere Schriftart geht: bei Typo3 gibt es dafür den Gifbuilder, der aus auf dem Server hinterlegten TT-Fonts gifs erstellt.

Ich nehme an, das von mike-r vorgeschlagene TTF-MOdul (TTF für True Type Font ?) macht auch sowas Ähniches?
Last edited by antibart on Sun Nov 23, 2008 9:38 am, edited 1 time in total.
mike-r

Re: Menü: Bilder, Grafiken statt Link-Text

Post by mike-r »

Nein, es macht nichts ähnliches, sondern das selbe ;)
Das Modul heisst Truetypetext. Zu finden ist es hier: http://dev.cmsmadesimple.org/projects/truetypetext/
mrks
New Member
New Member
Posts: 7
Joined: Mon Nov 03, 2008 10:05 pm

Re: Menü: Bilder, Grafiken statt Link-Text

Post by mrks »

Das habe ich mir schon angeschaut. primär ist das problem das hover das der link anzeigen soll. es ist kein exotischer font.

ist es mit dem modul möglich einen überstrich, bei a:hover, über einen link zu setzen?
jeff1980
Forum Members
Forum Members
Posts: 210
Joined: Mon Apr 30, 2007 1:46 pm

Re: Menü: Bilder, Grafiken statt Link-Text

Post by jeff1980 »

Hi,

wenn es wirklich nur um einen Strich (oder allgemeiner: Hintergrund-Grafik) geht, kannst Du das doch per CSS regeln:

Code: Select all

a:hover {
          background: url(images/hover.gif) repeat-x top;
}
Wobei "hover.gif" theoretisch nur 1 Pixel breit sein muss und so hoch, wie der Strich breit sein soll (z.B. 1x2px).

Solltest Du NICHT die Hintergrund-Grafik meinen - da habe ich in letzter Zeit auch schon öfter drüber nachgedacht. Man kann das denke ich auf jeden Fall dynamisch machen. Schließlich steht einem im MenuManager ja der Title der Seite zur Verfügung. Wenn nun das Bild für den jeweiligen Navigationspunkt genauso heißt, wie der Titel (macht ja eh Sinn), dann kann man doch den Image-Tag ins Menu-Template einbauen und den Bildnamen automatisch generieren lassen.
Dann muss zwar für jede neue Seite ein Bild erstellt und hinterlegt werden, aber die Navigation wird trotzdem dynamisch erzeugt.

mfg
Jan
antibart
Power Poster
Power Poster
Posts: 1161
Joined: Sun Aug 17, 2008 9:29 am

Re: Menü: Bilder, Grafiken statt Link-Text

Post by antibart »

mrks wrote:
ist es mit dem modul möglich einen überstrich, bei a:hover, über einen link zu setzen?
Dazu brauchst Du sicher kein Modul. Mach es einfach genau wie jeff1980 beschrieben hat über ein Hover mit Hintergrundbild.
mrks
New Member
New Member
Posts: 7
Joined: Mon Nov 03, 2008 10:05 pm

Re: Menü: Bilder, Grafiken statt Link-Text

Post by mrks »

Man! Das stimmt natürlich! dankeschön!


Dann habe ich noch eine Frage: wie unterscheide ich, bzw wie wird unterschieden ob der Link im Menü ein Elternlink ist oder ein Kind davon? Wie spreche ich diese mit css an?
antibart
Power Poster
Power Poster
Posts: 1161
Joined: Sun Aug 17, 2008 9:29 am

Re: Menü: Bilder, Grafiken statt Link-Text

Post by antibart »

Ich weiß nicht geanu, wie Du das meinst, aber:

"Elternlinks" sind immer die Links aus dem übergeordneten Punkt des jeweiligen Submenus.
In den Templates der Menus gibt es dafür eine css-Klasse mit dem Namen "menuparent" ..

Beipiel

1. (Eltern) Wir über uns:
  •    1.1 (Kind 1) Das Unternehmen
  •    1.2 (KInd 2) Geschichte
  •    1.3 (KInd 3) Team
Kommt noch eine dritte Ebene hinzu (ZB Wir über uns -> Team -> Chefs), würde dann beim Klick drauf der Punkt "Team" ebenfals Elternstatus bekommen.

Also so:

1. (Eltern) Wir über uns:
  •    1.1 (Kind 1) Das Unternehmen
  •    1.2 (KInd 2) Geschichte
  •    1.3 (KInd 3 von 1 und Eltern von 1.3.1) Team
  •                 1.3.1 (KInd von 1.3) Chefs


Du musst in deinen css diesen Eltern-Linkstatus mit .menuparent formatieren.

Also Zb:

#menu-vert a.activeparent {
background: #fff url (bild.jpg) no-repeat;
} .. was auch immer...

Dazu gibt es noch eine Klasse mit dem Namen "currentpage" - mit der formatierst Du den Style der gerade aktiven Seite. Das nützt dann etwas, wenn es keine UNterpunkte gibt oder wenn der Klick auf den Link im Elternmenu nicht gleich einen Unterpunkt aufruft, sondern erstmal zB eine Einleitung. Auch den aktiven Status der Links im Submenu kannst mit currentpage individuell gestalten. Natürlich nur, wenn Du ihn wie im Beispiel oben mit einer DIV-ID kombinierst (oder alternativ den Namen der Klasse im Template des Submenus änderst)

Wenn Du also erreichen willst, dass die Links bei aktiver Seite im Hauptmenu (Eltern) und auch beim Surfen durch das dazugehörige Submenu (Kind)  immer Zb rot sind, musst Du sowohl bei "currentpage" als auch "activeparent" die Farbe Rot zuweisen.

..
Last edited by antibart on Fri Nov 28, 2008 8:37 am, edited 1 time in total.
Locked

Return to “Layout und Design”