Je vous avais parlé des possibilités de personnalisation de la barre de menu du thème Freshy dans ce billet de fin septembre dernier. Depuis, plusieurs d'entre vous ont posé des questions ici, sur le forum de DotClear ou encore par mail, essentiellement sur la manière de de mettre en évidence le menu sélectionné en fonction du mode courant.
Je rappelle que le but du jeu est de positionner une classe current_page_item
sur la balise <li>
(en plus de la classe existante page_item
ou last_menu
qu'il faut préciser quoiqu'il arrive). Le code de base est le suivant :
<li class="page_item <?php echo (test) ? 'current_page_item' : ''; ?>">…</li>
Voilà l'aspect normal d'un élément du menu :
Et voilà maintenant à quoi il ressemble lorsqu'on ajoute la classe current_page_item
à la balise <li>
:
Attention si vous avez le plugin pagination installé et actif car il intercepte le mode courant et le remplace par le sien. Dans ce cas il faudra tester une autre variable ($dc_orig_mode
) dans laquelle le plugin sauvegarde le mode standard avant de le modifier. D'ailleurs, par soucis de simplicité, nous pouvons mettre la ligne suivante, juste avant la définition de la barre de menu, y compris si vous n'avez le plugin installé chez vous :
<?php if ($mode != 'pagination') $dc_orig_mode = $mode; ?>
Nous allons maintenant voir comment spécifier le test en fonction des cas.
Cas de la page d'accueil
Dans ce cas, il suffit d'utiliser le test ($dc_orig_mode == 'home')
.
Cas des catégories
Le test ($dc_orig_mode == 'cat') && ($news->f('cat_id') == xx)
permettra de tester si la catégorie possédant l'identificateur numérique xx
est active. L'identificateur numérique est facilement récupérable sur la page de gestion des catégories. Vous y trouverez la liste de toutes vos catégories et pour chacune, en glissant la souris sur leurs noms vous verrez une URL qui se termine par &cat_id=xx
. Notez le xx
, c'est lui dont il s'agit.
Si vous souhaitez que l'item de menu reste éclairé y compris lorsque vous affichez un billet de cette catégorie, il suffit d'utiliser (($dc_orig_mode == 'cat') || ($dc_orig_mode == 'post')) && ($news->f('cat_id') == xx)
.
Cas des pages connexes
J'avais précisé dans le billet précédent comment créer une petite fonction dans le fichier prepend.php
du thème qui permet de faire test simplement. Avec cette fonction, il suffit de tester avec dcRelatedCurrent('infos')
pour une page spécifiée avec infos = "infos.php|Informations"
dans le fichier related.ini
du plugin (répertoire share/related
).
Cas d'un billet particulier
Ici il suffit d'utiliser ($dc_orig_mode == 'post') && ($news->f('post_id') == xxx)
, avec xxx
représentant l'identificateur numérique du billet. Cet identificateur précède normalement le titre dans l'URL du billet. Par exemple, le billet que vous êtes en train de lire à un identificateur égal à 792 (…?2006/11/28/792-le-menu-de-freshy-complements)
Cas d'une table des matières
Dans ce cas, il faut utiliser ($dc_orig_mode == 'tocHome')
. Si vous voulez différencier les différentes tables des matières en fonction du fichier de configuration utilisé, vous pouvez compléter en testant la variable $toc_ini_file
qui contiendra alors le nom du fichier de configuration (sans extension). Par exemple ($dc_orig_mode == 'tocHome') && ($toc_ini_file == 'alpha')
dans le cas d'un fichier alpha.ini
(dans le répertoire share/toc
).
Cas d'une galerie
Avec le plugin Galerie il suffit de tester avec ($dc_orig_mode == 'galleryCat') || ($dc_orig_mode == 'galleryGal') || ($dc_orig_mode == 'galleryImage')
.
Cas du résultat d'une recherche
Sur la page de résultat d'une recherche il faut tester avec ($dc_orig_mode == 'search')
.
Cas de la page contact fournie par le plugin du même nom
Pas compliqué car il suffit de tester avec ($dc_orig_mode == 'contact')
.
Cas des pages produites par le plugin Download manager
Là non plus c'est relativement simple. Un petit test avec ($dc_orig_mode == 'dlm')
suffira.
Voilà, je pense avoir fait le tour des possibilités. Si vous aviez des précisions à apporter, n'hésitez-pas à le faire en commentaire, je mettrai alors ce billet à jour en conséquence.
1 De Guillaume -
As tiens pour le cas d'une page related particulière j'ai ça comme condition :
<?php if ($mode == 'related' && $related_page == 'curriculumvitae') : ?>
Et pour le mode home avec pagination ceci :<?php if ($mode == 'home' || ($mode == 'pagination' && $dc_orig_mode == 'home')) : ?>
Cela doit être complémentaire je suppose
2 De Franck -
Oui ça rejoint ce qui était expliqué sur le billet précédent, et mon astuce du début permet de s'affranchir du double test (
$mode
et$dc_orig_mode
).3 De Guillaume -
Effectivement c'est peut être mieux, je vais tester ;)
4 De geneo -
Salut,
si j'ais bien compris, pour mon blog ou j'ai un lien vers un post (presentation), ce que je devrais mettre dans mon template c'est:
<li class="page_item <?php echo ($dc_orig_mode == 'post') && ($news->f('post_id') == 1) ? 'current_page_item' : '';
?>"><a href="http://gendoors.free.fr/blog/index.php?2006/11/27/1-first-post";">Présentation</a></li>
le lien marche mais pas le changement de couleur... pourtant le test devrait etre bon, ou le probleme vient du fait qu'il s'agit du premier post? excuse moi je débute...
5 De Franck -
Le test est correct mais il ne faut pas oublier de mettre la ligne suivante juste avant la définition du menu :
Si c'est déjà le cas, il faudrait alors tester le contenu de la variable
$dc_orig_mode
.6 De geneo -
bon allez un dernier et je ne t'embete plus avec mes questions. Pour ma page contact pour laquelle j'utilise le plugin contact, je dois mettre quoi? Pour l'instant j'ais mis cela, sans succès:
<?php if ($mode != 'Contact') $dc_orig_mode = $mode; ?> <li class="last_menu <?php echo dcRelatedCurrent('?contact') ? 'current_page_item' : ''; ?>"><a class="last_menu" href="<?php dcInfo('url'); ?>?contact" title="Contact" accesskey="7">Contact</a></li>
Pour le reste ça marche impec! Je te remercie!
7 De Franck -
La ligne :
n'est pas utile. Il suffit de mettre celle que j'indiquais juste avant SANS la modifier. Pour le plugin contact, il faut que je jette un coup d'œil.
8 De Franck -
Bon je viens de regarder et je vais mettre le billet à jour en fonction. Il suffit d'utiliser le test
($dc_orig_mode == 'contact')
.9 De geneo -
Voilà, tout marche à merveille maintenant grâce à toi! Je te remercie beaucoup surtout pour ta rapidité de réponse. Mille fois merci. J'avais compris le principe mais pas toutes les nuances...^^ Merci encore et bonne continuation!
10 De Sylvain -
Merci pour ce complément, tout marche nikel chez moi :)
11 De Jérôme -
Merci pour ces précisions super claires, ça a marché direct. Cela venait juste du plugin de pagination installé... Encore désolé du dérangement. Par contre mon dernière onglet contact ne marche pas, je pense pourtant avoir mis la bonne syntaxe : @@<li class="last_menu <?php echo ($dc_orig_mode == 'contact') ? 'current_page_item' : ''; ?>"><a class="last_menu" href="http://jerome.greffier.free.fr/dotclear/index.php/form" title="Contact" accesskey="7">Contact</a></li> @@
Le lien marche, mais par contre je ne sais pas si c'est de la bonne façon que j'ai mis la redirection vers la page contact.
Merci beaucoup pour ton travail et ton aide.
12 De J2L -
j'ai vraiment été séduit par ce thème. Toutes mes félicitations pour ce travail ! je voudrai juste arriver à rendre plus visible les jours du calendrier où il y a au moins un billet. Y-a-t-il un moyen de les souligner, de les mettre en gras,ou de les mettre dans une couleur très claire ?
13 De Franck -
Pour cela il suffit par exemple de rajouter ceci dans la feuille de style :
Si nécessaire, on peut même rajouter cela :
Après, pour les tailles et les couleurs c'est affaire de goûts
14 De J2L -
Merci Franck, t'es génial !
15 De Franck -
Zizir ;-)
16 De arteta -
Merci bien deja pour ces petites modifs.
Je bloque avec le plugin Gallery, voila mon code:
<li class="page_item <?php echo ($dc_orig_mode == 'galleryCat') || ($dc_orig_mode == 'galleryGal') || ($dc_orig_mode == 'galleryImage') ? 'current_page_item' : ''; ?>"><a href="http://greguar.free.fr/index.php?gallery" title="gallery">gallery</a></li>
Et si tu avais une idée pour une PopUp radio Blog:
<li class="page_item"><a href="http://daustralie.fr/radio.blog.3.0/index.htm" onclick="window.open(this.href, '_blank', 'resizable=1, location=0, toolbar=0, scrollbars=0, height=360, width=215'); return false;" title="Popup FS Radio">Music</a></li>
=> daustralie.fr
Arteta.
17 De Franck -
Pour les modes gérés par Galery, il faut tester
$mode
si tu n'utilises pas le plugin Pagination.Pour le popup, je sèche désolé. Poses la question sur le forum, quelqu'un saura peut-être répondre ?
18 De chichi -
Hello,
merci de ta patience et de tes explications,
j'ai une question par rapport aux catégories j'ai été obligé de modifier ton code par :
y a t il une importance à cela ?
19 De Franck -
En l'absence du plugin pagination, en effet cette ligne fonctionne. Par contre lorsqu'il est installé il faut utiliser la ligne que je donnais dans le billet.
C'est pour cette raison (absence ou présence du plugin pagination) que je proposais de mettre le code suivante juste avant la définition du menu :
Cela permet d'utiliser la variable
$dc_orig_mode
sans se préoccuper de la présence ou pas du plugin.20 De chichi -
Merci, et désolé, j'avais mal lu le début....
21 De Franck -
Pas de soucis du moment que c'est résolu ;-)
22 De julien -
Bonjour, je veux migrer vers DC 2, je suis en train d'adapter mon template qui utilise une barre d'en tete onglets (je n'ai pas de grand merite, j'ai utilisé ton billet pour m'aider). Mais cela ne fonctionne pas, aurais tu une idée ?
23 De Franck -
Attention tout ce que je raconte n'est valable que pour Dotclear 1 !
24 De Julien -
Oui je sais, mais vu que tu travailles également en parallèle avec dotclear 2 et que j'ai eu le plaisir de lire (cela m'a bien aidé), je me demandais si tu n'avais pas explorer cette piste et si tu voulais nous en faire part.
25 De Fady -
Salut,
Frank, excuse moi mais je n'arrive à suivre très bien ce que tu as dit dans les posts...
Donc est-ce que c'est possible de me donner le code pour la surbrillance des liens quand ils pointent vers des articles/billets (susceptibles de changer de position dans la liste).
Je pensais utiliser une fonction javascript qui comparerait la partie du l'url après le point d'interrogation à une chaine de caractère... Je sais pas s'il y a moins compliqué en php (ou même dans les propriétés de Dotclear mais je m'y connais pas trop...
Merci de ton aide.
26 De Franck -
Pour un lien vers un billet :
Il faudra bien sûr modifier le n° du billet dans le test et son URL.
27 De Fady -
Super ! Merci Franck ! ça marche impec !
28 De jc-Qualitystreet -
Salut Franck,
J'ai un soucis avec les pages connexes, semble-il (accueil ok), couleur verte ok aussi:
Pour le coup ça ne marche pas !! Merci d'avance
29 De Franck -
Il y a un petit problème d'intégration du plugin related me semble-t-il car je ne vois pas pourquoi tu obtiens une erreur dans le fichier
list.php
qui n'est pas appelé lors de l'affichage d'une page connexe !Il faut vérifier soigneusement le code dans le fichier
template.php
.30 De jc-Qualitystreet -
Effectivement il manquait ce code dans le fichier template:
Je l'ai ajouté et c'est OK. Merci
31 De jc-Qualitystreet -
Bonjour Franck,
J'ai un petit soucis avec le menu. Tout est OK (couleur verte à l'état en cours) pour les 2 pages connexes et le billet mais pas pour l'item Accueil qui ne prend pas la couleur verte. Quand j'essaie de faire ce qui est indiqué au dessus, j'ai une page d'erreur !
Voici mon code dans template (pas de page d'erreur mais pas de couleur verte sur accueil) :
Peux tu m'aider ?
32 De Franck -
Il manque un
<?php echo ($dc_orig_mode == 'home') ? 'current_page_item' : ''; ?>
dans la classe du lien correspondant (à mettre après lefirst_menu
) ! Normal dans ce cas que cela ne fonctionne pas ;-)33 De jc-Qualitystreet -
J'ai ajouté ce bout de code et rien ne se passe. Mon nouveau fichier template :
34 De Franck -
Il faut remplacer
<?php if ($mode == 'home') : ?>
par<?php if ($dc_orig-mode == 'home') : ?>
si la pagination est installée.35 De jc-Qualitystreet -
Merci; c'était effectivement le problème...j'ai remplacé le bout de code et accueil devient vert ... mais reste allumé ! je vais jeter un coup d'oeil dans les commentaires précédents si cette problématique s'est déjà présentée !
36 De Franck -
Simplement parce qu'il y a des lignes en trop ! Celles ci :
37 De jc-Qualitystreet -
J'ai retiré les deux lignes : aAccueil reste allumé. Comme tu peux le voir en direct (j'ai mis en ligne le thème)... d'ailleurs j'espère que le résultat ne trahit pas ton travail :)
38 De Franck -
Je pense que ça vient du traitement des pages connexes (related). Il y a un billet où j'explique cela un peu plus en détail.
39 De jcQualitystreet -
Salut Franck,
Bon pas mal de modifs, j'ai remis les choses au clair et voilà où j'en suis: je suis revenu à Accueil non allumé et les 3 autres qui marchent bien! Mon code:
En plus, l'item 1 (
<?php if ($mode != 'pagination') $dc_orig_mode = $mode; ?>
) semble redondant avec le suivant mais quand ke le supprime le 4 eme item de mon menu Manifeste .... n'est plus allumé. Je n' y comprends plus rien !! HELP !PS: Je pense aussi avoir un soucis avec le contact qui sabote la mise en page du menu !
40 De jc-Qualitystreet -
C'est bon. Problème résolu; il fallait changer la position d'un petit bout de code sur la ligne dédiée à la page d'accueil. C'est cette ligne qui posait problème.
Voici le résultat final de cette ligne Home:
Bref merci pour ton support et pour ce thème que je trouve clair et efficace même s'il n'est plus tout neuf !
41 De brol -
Je me permets de regrouper ici une info trouvée sur le forum de dc concernant les codes de pagination à mettre dans
list.php
pour intercepter les modes home, search et category :<?php if ($mode == 'home' || ($mode == 'pagination' && $dc_orig_mode == 'home')) dcPagination::showNavigation(); ?>
<?php if ($mode == 'cat' || ($mode == 'pagination' && $dc_orig_mode == 'cat')) dcPagination::showNavigation(); ?>
<?php if ($mode == 'search' || ($mode == 'pagination' && $dc_orig_mode == 'search')) dcPagination::showNavigation(); ?>