Joomla Menu mit Untertiteln (Subtitles)

Achtung, öffnet in einem neuen Fenster. Drucken

joomla-menu-subtitleSehr beliebt und häufig nachgefragt sind horizontale oder vertikale Menus mit Untertiteln. Diese Menus finden sich vorallem in kostenpflichtigen Templates der Templates Clubs.

Wir zeigen Ihnen anhand eines Standard Menus, wie Sie mit wenigen Handgriffen und ausschließlicher Verwendung von Template Overrides, also update-beständig und ohne Installation von Erweiterungen Untertitel zu Ihrem Joomla Menu hinzufügen können.

Demo

So sieht das fertige Joomla Menu mit Untertiteln aus: Live Preview

joomla_menu_mit_untertiteln

Umsetzung

Sie werden sehen: das Menu mit Untertiteln lässt sich mit wenigen Handgriffen umsetzen. Folgende Schritte sind erforderlich:

  • Erstellung eines Joomla Template Overrides für das Mainmenu
  • Editieren der Joomla Menu Titel
  • Anpassung der CSS Datei

Joomla Template Override: Menu mit Untertiteln

Template Overrides überschreiben die Ausgabe des von Joomla erzeugten Codes und bieten somit ein sehr gutes Mittel updatebeständige Änderungen an der Ausgabe der Website durchzuführen. Diese Overrides werden in einem Ordner "html" im Template gespeichert.

Der Einfachheit halber bieten wir unser Override direkt zum Download an:

Download: Override mainmenu_subtitles.zip

Die Zip Datei enthält den Overrides Ordner "html" und darin das Override "mod_mainmenu". Laden Sie den Ordner "html" mit Hilfe eines FTP Programmes in den Ordner Ihres aktiven Templates.

Es ist in der Regel nicht schädlich, wenn dort schon ein Ordner "html" angelegt ist, da bei den allermeisten Templates kein Override für das Mainmenu existiert.

Sollte sich in Ihrem Template Override Ordner ("html") schon ein Ordner "mod_mainmenu" befinden, müssen Sie den nachfolgenden Code manuell einfügen.

JoomlaRoot/templates/IhrTemplate/html/mod_mainmenu/default.php, ab Zeile 83:

// Subtitles in Joomla Menu
$separator = '::';
if ($node->name() == 'a' || $node->name() == 'span') {        
  if (isset($node->span)) {
    $span = $node->span[0];
    if (strpos($span->data(), $separator) !== false) {
      // Title and Subtitle
      $title = $span->data();
      $subtitle = explode($separator, $title);
      // Title
      $node->span[0]->setData(trim(array_shift($subtitle)).' ' );
      // Subtitle
      foreach($subtitle as $value) {
        $child = $node->addChild('span');
        $child->setData( trim(array_shift($subtitle)));
        $child->addAttribute('class', 'subtitle');
      }
    }
  }
}

Durch den separator "::" werden die Titel der Menulinks von den Untertiteln getrennt und in einem eigenen <span class="subtitle"> ausgegeben.

Dazu ist natürlich erforderlich, dass die Joomla Menupunkt-Titel dieses Trennelement und den Subtitle enthalten.


Joomla Menu Titel editieren

Gehen Sie im Administrationsbereich unter Menus/Ihr Menu auf die einzelnen Menupunkte und fügen Sie die das Trennzeichen "::" und den Untertitel den entsprechenden Menutiteln an.

Screenshot:

joomla_menu_mit_untertiteln_admin

Zu guter letzt muss natürlich noch die CSS Datei angepasst werden.


Anpassen der CSS Datei

Dies kann im Einzelfall etwas schwieriger und hier nicht allgemeingültig erklärt werden, da sich die CSS Anweisungen für Menus von Template zu Template teilweise stark unterscheiden.

Daher können wir nur den CSS Code unseres Beispiel Menus veröffentlichen:

JoomlaRoot/templates/IhrTemplates/css/template.css.


Fragen oder Probleme

Sollten Sie Fragen oder Probleme bei der Einrichtung des Menus mit Untertiteln haben, können Sie uns gerne einen Kommentar hinterlassen.

Möchten Sie, dass wir Ihnen das Menu mit Untertiteln in Ihr Joomla Template einbauen, nehmen Sie mit uns Kontakt auf.

Kommentare 

 
#1 Patty 2010-07-17 03:50
Super, Danke!
Ich habe mich schon öfters gefragt wie man das realisieren kann, dazu aber bisher noch keine hilfe gefunden.
Wie immer: tolle arbeit.
Gruß Pat
Zitieren
 
 
#2 Steffen Günther 2010-10-17 09:56
Hey wow! Dachte das wäre in Jooml immer nur mit Menüerweiterung en möglich! Aber wenn das so einfach mit nem Override zu machen ist kommt das auf jeden Fall mal!

Dankeschön dafür!
Zitieren
 
 
#3 yean 2010-10-22 16:04
hi… habe den code an der richtigen stelle eingefügt. bekomme folgende fehlermeldung:
Fatal error: Call to a member function name() on a non-object in ../templates/webseincustom_h /html/mod_mainmenu/default.php on line 85

Fatal error: Class 'JLoader' not found in ../libraries/loader.php on line 161
Zitieren
 
 
#4 gooch 2011-02-15 15:38
Sehr nettes Tut. Ich konnte es leicht umsetzen. Allerdings habe ich ein Problem, wenn ich ein Submenu erstellen will… Bei Submenu-Modulen wird diese modifizierung ignoriert.
Wie muss ich vorgehen, wenn ich diese Subtitles bei Modulen mit Submenus haben möchte?
Zitieren