Menüelemente durch Bilder ersetzen


8

Ich suche nach einer Möglichkeit, Menüelemente als Bilder (mit Rollover) anstelle der üblichen Textlinks anzuzeigen. Ich habe das Modul Menüsymbole gefunden , aber wie der Name schon sagt, soll es das Symbol neben dem Link platzieren. Hat jemand eine Technik dafür? Vielleicht muss ich eine Art benutzerdefinierten Block oder Panel erstellen, aber ich dachte, vielleicht gibt es einen einfacheren Weg.

Antworten:


7

Sie können das Menü-Symbol- Modul verwenden, um die gesuchte Funktionalität zu implementieren - ich habe dies mehrmals getan.

Sie müssen lediglich die Datei menu_icons_css_item.tpl.php so anpassen, dass das Bild mithilfe der CSS-Bildersetzungstechnik angezeigt wird, anstatt das Bild als symbolähnlichen Hintergrund zu positionieren. Für die Rollover-Funktion muss jedes Bild, das Sie mit dem Bildsymbolmodul hochladen, die statische Version und die Rollover-Version des Menübilds enthalten.

Hier ist ein Beispielinhalt einer Datei menu_icon_css_item.tpl.php, die ich zuvor verwendet habe. Dies gilt für Drupal 6, daher muss möglicherweise ein Teil der Syntax aktualisiert werden, wenn Sie Drupal 7 verwenden.

<?php
$base_url = $_SERVER['DOCUMENT_ROOT'];
$image_info = getimagesize($base_url.$path);
$width = $image_info[0];
$height = $image_info[1]/2;
?>

ul.links li.menu-<?php print $mlid ?> a {
  background-image: url(<?php print $path ?>);
  background-repeat: no-repeat;
  background-position: 0 0;
  height:<?php print $height?>px;
  text-align: left;
  text-indent: -9999px;
  width: <?php print $width?>px;
}

ul.links li.menu-<?php print $mlid ?> a:hover {
  background-position: 0 <?php print $height?>px;
}

Nachdem Sie in Ihrem Design eine Kundendatei menu_icons_css_item.tpl.php erstellt haben, müssen Sie die CSS-Datei löschen, die das Menüsymbolmodul zuvor generiert hat, damit mit dieser Vorlage eine neue Datei generiert wird. Es sollte sich in Ihrem Ordner sites / default / files befinden.

Wenn Sie Site-Administratoren nicht erlauben müssen, Menüelementbilder über die Drupal-Benutzeroberfläche zu aktualisieren, können Sie die CSS-Bildersatztechnik natürlich einfach in Ihrem Thema implementieren, ohne ein Hilfsmodul wie Menüsymbole zu benötigen.


Danke, funktioniert
super

Ich liebe es, Leute zu sehen, die Fusion verwenden! : D
sheena_d
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.