Koumbit.org

Pour un internet libre et solidaire

Liens de menu en ligne dans Drupal 7

Aujourd’hui j'avais une de ces taches d’intégration Drupal qui semble constamment resurgir: celle de transformer un bloc du module menu d'une liste html a un jeu de liens en ligne. En images je devais me rendre

de ça: Menu Drupal standard à ça: Liens tel que affiché dans le design

Comme d'habitude je fait surtout du développement de modules et des taches semblables chez Koumbit, j'étais conscient que Drupal avait déjà une classe pour des listes contenant des liens en ligne, "lists inline", mais je ne savais pas comment changé ces valeurs au niveau du thème. Donc j'ai visité la page API de theme_menu_tree() pour y trouver de l'inspiration, ce que j'ai trouvé dans un commentaire de wgsimon. Un thème Drupal peut supplanter la fonction de thème d'un menu précis dans Drupal avec la pattern THEME_menu_tree__MENU_NAME().

J'ai ajouté le code suivant au template.php de mon thème, pour rendre le menu d'usager standard de Drupal ainsi que notre menu pour les visiteurs avec le style Drupal de liens en ligne:

/**
 * Afficher le menu d'usager en ligne
 */
function customtheme_menu_tree__user_menu($variables) {
  return '<ul class="links inline clearfix">' . $variables['tree'] . '</ul>';
}

/**
 * Afficher le menu d'usager anonyme en ligne
 */
function customtheme_menu_tree__menu_user_menu_anonymous_($variables) {
  return '<ul class="links inline clearfix">' . $variables['tree'] . '</ul>';
}

Vous n'avez qu'à remplacer le mot customtheme avec le nom de votre thème et ensuite changer les noms des menus pour utiliser ça sur n'importe quel menu.

Pour le changeur de langage j'ai fait quelque-chose de semblable, après avoir consulter locale_block_view() dans le API. J'ai vue que le bloc du changeur de langue utilise theme('links__locale_block', $variables); pour fournir son contenu. J'ai supplanter cette fonction dans template.php:

/**
 * Afficher les liens du changeur de langue en ligne
 */
function customtheme_links__locale_block($variables) {
  array_push($variables['attributes']['class'], 'links', 'inline', 'clearfix');
  return theme('links', $variables);
}

J'ai donc découvert que la pattern theme_function__object_name marche pour n'importe quel fonction thème appeler de cette manière. Je suis sur que ceci est précisé quelque-part dans la documentation de l'API de Drupal.

Mes menus ressemblais maintenant à ceci: Liens menu après les changements dans template.php

La dernière étape varie selon le thème. Dans mon cas j'ai déplacé <div class="region region-header"> et son contenu à avant le logo, dans page.tpl.php, et j'ai inséré le CSS suivant dans les fichiers appropriés:

.region-header .block {
  display: inline-block;
  margin-bottom: 0;
}

.region-header {
  text-align: right;
}

Le résultat: Liens après les modifications du CSS

Il reste évidement à finir l'intégration, mais mon soucis principal jusqu'à présent c'était d'éviter de charger mon CSS avec du code déjà présent dans Drupal.

Pour commenter cet article, faire des suggestions, et voir les échantillons de code avec du syntaxe couleur.

Ajouter un commentaire

Permanence téléphonique

☏ +1 514 907 9494
Lun: 10h à 12h
Mar/Mer: 10h à 12h et 13h à 16h
Jeu: 10h à 12h
Mon: 10AM to 12PM
Tue/Wed: 10AM to 12PM et 13AM to 16PM
Thu: 10AM to 12PM

Venez nous voir!

1883, rue Atateken,
Montréal (Québec) H2L 3L7, Canada
Veuillez noter que nos bureaux n'ont pas de stationnement attitré.
1883 Atateken Street,
Montreal, Quebec, H2L 3L7, Canada
Please note that you'll need to find on-street parking.

Écrivez-nous

Informations générales

Support technique

Pour une demande de devis, voir le formulaire à la page contact.

Nos clefs PGP

General inquiries

Technical support

For a free estimate, see the form on our contact page.

Our PGP keys

Suivez-nous

ktweb_menu_social