Unternehmer und Geek

Unterlinks von Primary Links separat darstellen

So, hier geht es um fortgeschrittenes Themeing! Aber man kann wirklich coole Sachen machen und es ist eigentlich gar nicht schwierig.

Problemstellung:

Also, die Primary Links werden ja normalerweise ganz normal dargestellt. Die sind eigentlich in jedem Theme drin. Nur was passiert, wenn man Unterlinks von den Primary Links macht? Oftmals wird da das Design ziemlich über den Haufen geworden und es kommt nicht viel schlaues raus. Das Problem lässt sich sehr elegant lösen: Die Unterkategorie rauslösen damit die separat in Theme dargestellt werden kann.

Hier jetzt also die Schritt für Schritt Anleitung:

1. Navigationsstruktur zum Testen erstellen

Diese Struktur solle ungefähr wie folgt aussehen:

  • Bücher
    • Buch 1
    • Buch 2
    • Buch 3
  • DVDs
    • DVD 1
    • DVD 2
    • DVD 3
  • Witze
    • Witz 1
    • Witz 2

Dies ist wichtig, damit wir auch sehen, ob das ganze funktioniert.

2. template.php modifizieren

uid > 0){
$vars['logged_in'] = 'true';
}
else{
$vars['logged_in'] = 'false';

}
$vars['primary_links'] = primary_secondary_links(variable_get('menu_primary_menu', 1),'tablist'); //$primary_links überschreiben
$vars['primary_sublinks'] = primary_sublinks(variable_get('menu_primary_menu', 1)); //das werden dann Buch 1, Buch 2 usw.

break;
}
return $vars;
}
?>

So, mit dem obigen Schnipsel werden neue Variablen für page.tpl.php vorbereitet. Die Primary Links ($primary_links) werden überschrieben. Es wird nur noch die oberste Stufe ausgegeben. Im Weiteren wird eine neue Variable eingeführt: $primary_sublinks. Dies enthält dann Buch 1, Buch 2 usw. und kann dann beliebig eingefügt werden.

<?php
/
Die Primary Sublinks werden herausgelöst, damit diese sepparat angezeigt werden können und nicht irgendwie verschachtelt.

@param int $pid
 @return string html
*/
function primary_sublinks($pid,$anz=2){
$item = menu_get_item($pid); // hole den jeweiligen menupunkt
$out = '';
$final_out = '

    ';
    foreach ($item['children'] as $mid) {
    if(menu_in_active_trail_in_submenu($mid,$pid)){
    $current_menu_item = menu_get_item($mid);
    if(is_array($current_menu_item['children'])){

    $counter = 0;
    foreach ($current_menu_item['children'] as $value) {
    if($value > 0){
    $final_out .= '

  • '.menu_item_link($value).'

    • ';
    if ($counter >= $anz) {
    $final_out .= '

    ';
    $counter = 0;
    }
    $counter++;
    }
    }
    }
    }
    }
    return $final_out.'

';
}
?>

Der obige Schnipsel macht dann schlussendlich die Hauptarbeit. Hier werden die Sublinks extrahiert und in entsprechenden HTML Code verpackt. Dieser kann natürlich nach belieben noch geändert und den eigenen Bedürfnissen angepasst werden.

Der Parameter $anz ist ein bisschen speziell. Dieser macht es möglich, die Links in mehrere Spalten zu schreiben, wobei $anz angibt, wieviele Links in einer Spalte sind. Kann nach belieben umgeschrieben werden.

Damit wäre es dann eigentlich auch schon geschafft. War doch gar nicht so schwierig, das Tüpfelchen auf dem i wäre dann natürlich noch, wenn die der aktive Primary Link passend markiert wird. Dies ist vor allem nützlich, wenn man z.B. Tabs hat und diese als aktiv markieren will.

<?php
/
überschreibt theme_menu_item() aus includes/menu.inc

fügt zusätzlich eine class 'active' für alle aktiven menupunkte zum

  • -element

    */
    function phptemplate_menu_item($mid, $children = '', $leaf = TRUE) {
    $item = menu_get_item($mid); // hole den jeweiligen menupunkt

    if ((drupal_get_normal_path($item['path']) == $_GET['q']) // pfad aktiv?
    || (drupal_is_front_page() && $item['path'] == '') // oder sind wir auf der startseite?
    || menu_in_active_trail($mid)) { // oder sind wir irgendwo im aktiven pfad, also in einem übergeordneten element des gerade angewählten?
    #$active = ' active'; falsch. führt zu klassen wie z.b. 'activeexpanden' statt 'active expanded'
    $active = 'current '; # so ists korrekt
    } else {
    $active = '';
    }
    return '

  • '. menu_item_link($mid) . $children .'

    • ';
    }
    ?>

    Damit wird der aktive primary Link markiert. -> Habe ich auf Drupalcenter gefunden.

    3. Unterlinks an passender Stelle einbauen

    So, jetzt nur noch node.tpl.php öffnen und die Variable einfügen:

    Halt einfach da wo man will

    Jo, das wäre es dann auch schon gewesen, Ich wollte eigentlich noch einen kleinen Screenshot einfügen, aber irgendwie ist bei mir lokal gerade ein Problem

    Update: Ich habe doch wirklich ein Codestück vergessen 😉

    <?php
    /*
     Hier werden die primary und secondary links formatiert, so dass diese einen zusatz markup bekommen
    zum schauen, welcher Punkt aktiv ist und welcher nicht.

    @param int $pid
     @param string $id
    @return string html
    /
    function primary_secondary_links($pid, $id='primary-links') {
    /if ($tree = menu_tree($pid)) {
    return '

      '. $tree .'

    ';
    }    /

    $menu = menu_get_menu();
    $output = '';

    if (isset($menu['visible'][$pid])) {//I only want the once that are visible -> since its the primary navigation
    foreach ($menu['visible'][$pid]['children'] as $mid) {
    $output .= theme('menu_item', $mid);
    }
    }
    return '

      '. $output .'

    ';
    }
    ?>

    Im Anhang kann die Datei sonst noch runtergeladen werden

    Raphael