web-dev-qa-db-fra.com

Ajouter une classe à ul de niveau supérieur à l'aide de menu_block

J'utilise le module de bloc de menu pour générer mes navs principales et secondaires. Je veux ajouter une classe à ul pour juste le niveau supérieur de la navigation principale.

Si je comprends bien, je peux faire quelque chose comme ceci:

function theme_menu_tree__menu_block($variables) {
  return '<ul class="my classes">' . $variables['tree'] . '</ul>';
}

ou ca:

function theme_menu_tree__menu_block__main_menu($variables) {
  return '<ul class="my classes">' . $variables['tree'] . '</ul>';
}

Cependant, cela semble envelopper tous les niveaux de la navigation avec le code HTML ci-dessus. Comment puis-je limiter la modification au premier niveau?

Il ne semble pas que l'on me donne beaucoup de données dans $variables. Suis-je en train de manquer quelque chose?

7routesblocks
6
John Bubriski

Voici l'astuce: theme_menu_tree__MENU_NAME () et theme_menu_link ().

<?php
/**
 * Implements theme_menu_tree().
 */
function THEMENAME_menu_tree__MENU_NAME(&$variables) {
  return '<ul class="FIRST-LEVEL-CLASS">' . $variables['tree'] . '</ul>';
}

/**
 * Implements theme_menu_link().
 */
function THEMENAME_menu_link__MENU_NAME(array $variables) {
  $element = $variables['element'];
  $sub_menu = '';

  if ($element['#below']) {
    // Wrap in dropdown-menu.
    unset($element['#below']['#theme_wrappers']);
    $sub_menu = '<ul class="OTHER-LEVEL-CLASS">' . drupal_render($element['#below']) . '</ul>';
  }
  $output = l($element['#title'], $element['#href'], $element['#localized_options']);
  return '<li' . drupal_attributes($element['#attributes']) . '>' . $output . $sub_menu . "</li>\n";
}
?>
8
arshadcn

$variables Donne moi:

array(3) {
  ["tree"]=> string(n) "HTML for the sub-tree"
  ["theme_hook_suggestion"]=> string(n) "menu_tree__menu_block__main_menu"
  ["theme_hook_suggestions"]=> array(0) { }
}

Cela semble assez mauvais, mais je pourrais faire une recherche de chaîne pour voir si le menu contient le texte de l'un de mes éléments de niveau supérieur:

<?php

function theme_menu_tree__menu_block__main_menu($variables) {
  if (!stripos($variables['tree'], 'home')) {
    return '<ul>' . $variables['tree'] . '</ul>';
  } else {
    return '<ul class="my classes">' . $variables['tree'] . '</ul>';
  }
}

?>
1
John Bubriski

Vous pourriez être intéressé par ce récent article de blog concernant thème des menus natifs dans drupal par Webbykat (par opposition à menu_blocks). Il ajoute des classes à theme_links, que vous n'essayez pas d'appeler. Il est en train de modifier le fichier tpl, mais vous pouvez le faire dans YOURTHEME_links__system_main_menu() je crois. J'ai également utilisé cette fonction, mais pas pour cela.

<?php print theme('links__system_main_menu', array('links' => $main_menu, 'attributes' => array('id' => 'main-menu', 'class' => array('links', 'inline', 'clearfix', 'main-menu')), 'heading' => array('text' => t('Main menu'),'level' => 'h2','class' => array('element-invisible')))); ?>

Fait 4: Vous pouvez contrôler les classes appliquées à chaque menu ul dans la région de menu tpl (en fonction de votre thème, probablement).

Pour ajouter une classe à ul du menu principal, vous devez modifier le tableau ('links', 'inline', 'clearfix', 'main-menu')) to array ('links', 'inline', 'clearfix' , 'menu principal', 'nouvelle classe')).

Il ressemble en fait à votre exemple de code de référencement de type ce billet de blog de Koumbit :

J'ai ajouté le code suivant au template.php de mon thème, pour que le menu utilisateur standard et notre menu personnalisé pour les utilisateurs anonymes utilisent le thème intégré de Drupal pour les liens en ligne:

/**
 * Make the user menu inline
 */
function customtheme_menu_tree__user_menu($variables) {
  return '<ul class="links inline clearfix">' . $variables['tree'] . '</ul>';
}

Mais, je pense que ce que vous avez vraiment à faire est d'examiner le region-menu.tpl.php Du thème et de voir comment ou comme page.tpl.php Rend les menus principaux, chaque thème est différent.

theme_links Et theme_menu_tree Rendent les ensembles (collections) de liens. Des thèmes différents utilisent différentes fonctions dans le même but.

Un autre module qui peut vous aider à comprendre cela est Devel et Devel_Themer . Activez devel_themer et sélectionnez votre menu principal et il vous indiquera la fonction theme_function utilisée et le fichier .tpl (et les remplacements possibles) en cours d'utilisation.

0
tenken