Wie erstellt man solche Menüs

Du kannst doch für a:link (bzw. a generell), dann für a:hover und schliesslich über die Klasse .active, die Drupal einem gerade aktiven Menüpunkt zuweist, verschiedene Hintergrundbilder einbinden.

Drupal - the Linux of the Web

Ja das kann man, aber wenn ich beispielsweise ein Bild als Link haben will, worauf ein exotischer Font als Linkbeschreibung drauf sein soll, gibts ein Problem.
Denn ein normal generierter Link wird als Text ausgegeben, wenn ich denn via

#Menu-1 a {
visibility: hidden;
}

verberge, dann habe ich auf einmal kein funktionierenden Link mehr, kann aber dann ein Hintergrundbild mit einem beliebigen Font im Bild einfügen, jedoch funktioniert der Link nicht mehr da der Link ( a ) nicht mehr vorhanden ist.

Gehe auf einen Menüpunkt auf der Beispiel-Webseite http://www.ourbania.de/ und klick über ein Menüpunkt mit der rechten Maustaste, dann auf "Grafik anzeigen", dann wirst du sehen, dass es ein einziger Image-Button ist und genau sowas will ich auch nur wie?

Das erreichst du am Besten nur mit CSS, dann ist es auch zugänglicher als in deinem Beispiel auf ourbania.de, wo nur Bild und kein Text im Quelltext zu finden ist (auch schlecht für SEO...).

Schau am Besten mal http://simplebits.com/notebook/2003/09/30/accessible_imagetab_rollovers.... oder http://veerle.duoh.com/index.php/blog/comments/2_level_horizontal_naviga...

Alles was du hierfür brauchst ist eigentlich schon drin in Drupal - eine Navigation die als Liste ausgegeben wird sowie unique ids pro Menüpunkt.

soweit verstanden, aber wie komme ich z.B.: an den Html-Tag eines Links, der durch Nice-Menu erstellt wurden ist.
Schliesslich kann ich ja so ein Code:

nicht in CSS einfügen, das kapiere ich nicht.

aber du kannst in deinem css

Ich denke mal die Links die im Beitrag davor gepostet wurden, sagen dir alles, was du brauchst.
______________________________
Yet Another Drupal Site (YADS)
http://www.rapsli.ch
******************************

du musst im prinzip einfach zusehen, dass jeder einzelne link eine eigene id besitzt. die kannst du dann im css ansprechen und ihr ein hintergrund-image verpassen. was mit dem text passiert steht auf den von mir verlinkten seiten. d.h. letztlich würde das menü so aussehen:

und in der styles.css:

da hättest du dann schon mal ein bild hinter dem menüpunkt. es steckt noch etwas mehr dahinter, größenspezifizierung, das verstecken vom text und active/hover zustände, aber da solltest du in den links meines letzten posts was finden können.

für mich ist der weg über css einfacher als eine php-lösung aber bei drupal.org habe ich aber auch verschiedene anfragen zum gleichen thema gefunden, z.b. http://drupal.org/node/110199#comment-207080. wenn du es mit css nicht hinkriegst, kannst du ja gucken ob dir der ansatz mehr liegt.

zwar nicht genau das was du suchst, aber doch noch cool: taxonomy bilder menus. ...
http://www.alldrupalthemes.com/blog/6-steps-fancy-custom-taxonomy-menu-t...
______________________________
Yet Another Drupal Site (YADS)
http://www.rapsli.ch
******************************

Hallo aschiwi, ok das dieser Code vom Nicemenü generiert wird ist klar,
auch das ich dann in CSS ein background bzw background-image als Hintergrundbild festlegen kann.
( Wobei, macht es einen Unterschied, wenn ich nur "background" anstatt "background-image" verwende? )

Ist der zuätzliche Part neben der Grösse ( width, height ) und der Ausrichtung ( background-position: left; )
das entscheidene dies?:

Es macht keinen Unterschied, ob du nur "background" nimmst. Eventuell nur zum schlechten, weil in manchen Fällen Internet Explorer das Bild nur erkennt, wenn alles einzeln aufgezählt ist (background-image, background-repeat usw.). Soweit ich das verstanden habe, ist text-indent-9999px das Wichtige zum Text "ausblenden", da es den Text außerhalb des Browserfensters positioniert. Du musst es aber ausprobieren, ich hab grad nichts zum Testen.

Ich empfehle zu diesem Thema mal das Buch "The Art & Science of CSS" zu kaufen. Direkt im Kapitel 1 "Headings" werden Image Replacement und Flash Replacement (zur Nutzung selbstdefinierter Fonts) vorgestellt.

--
"Look, Ma, I'm dead!"
Cell, Stephen King

Da ein großer Teil von ourbania.de von uns entwickelt wurde, möchte ich mich auch dazu äußern. I.d.R. verwende ich für Menüs auch nur CSS und keine Images im HTML und wenn die Zeit es zulässt auch Image Replacement Techniken.
Aber erstens kommt es anders und zweitens als man denkt. In großen Projekten sind die Prioritäten manchmal anders und die Kundenwünsche auch.
Aber richtig bleibt trotzdem: wenn möglich sollte man CSS und Image Replacement verwenden.

Wem das nichts sagt: im Prinzip schreibt man im HTML die Menüpunkte als Text, meistens in einer Liste und versteckt diese mit CSS. Ein Browser mit aktiviertem CSS sieht die Backgroundbilder, ein Browser ohne CSS z.B. ein Screenreader "sieht" die Menüpunkte als Text.

vg
--
md - DrupalCenter

mdwp* :: Drupal Services