Menu de navigation dépliant pour SPIP

© Christian PAULUS. Document créé le 10 décembre 2007 , mis à jour le 28 juillet 2011.

On n'est jamais heureux que dans le bonheur qu'on donne. Donner, c'est recevoir. Abbé Pierre

Accueil du site > Outils > Menu de navigation dépliant pour SPIP

Plugin / SPIP 1.9.2c-SPIP 2.1.10

MenuDep est un plugin pour SPIP qui s’appuie sur la distribution 192c de SPIP et jQuery 1.1.1 qui l’accompagne.

MenuDep est paramétrable via le menu Configuration de l’espace privé. Définissez dans cette page la vitesse d’animation et la position des sous-menus flottants.

Avertissement

MenuDep est un programme libre, vous pouvez le redistribuer et/ou le modifier selon les termes de la Licence Publique Generale GNU publiée par la Free Software Foundation (version 2 ou bien toute autre version ultérieure choisie par vous).

MenuDep est distribué car potentiellement utile, mais SANS AUCUNE GARANTIE, ni explicite ni implicite, y compris les garanties de commercialisation ou d’adaptation dans un but spécifique. Reportez-vous à la Licence Publique Générale GNU pour plus de détails.

Merci d’utiliser le forum en bas de page pour signaler les éventuels bugs.

Configuration par défaut

Après avoir installé et activé le plugin, MenuDep prend en charge votre menu de navigation sans avoir besoin de le configurer. Les résultats apparaîtront aussitôt, à condition bien sûr que le squelette inc-rubriques.html fourni ici soit placé au bon endroit, et que le cache ait été vidé.

Un squelette au menu

Le squelette inc-rubriques.html fourni avec MenuDep permet de lister les rubriques et articles du site (de la racine au second niveau).

La balise EXPOSE de ce squelette désactive le lien de l’article présent afin que le visiteur ne tourne pas en boucle en cliquant sur un lien devenu inutile.

Adaptez ce squelette à vos besoins.

Exemples de positionnement

PNG - 1.9 ko
Présentation du menu
Menu et articles de la rubrique courante.
PNG - 3.2 ko
Menu déplié incrusté
La liste des sous-rubriques et articles de la rubrique voisine apparait dans le menu de navigation.
PNG - 3.1 ko
Menu déplié flottant
La liste des sous-rubriques et articles de la rubrique voisine apparait près du menu de navigation.

Configuration

Si besoin, pour configurer MenuDep, cliquez sur le bouton Configuration puis le l’onglet Menu dépliant . La page de configuration apparaît :

PNG

Testez les options, sans oublier de vider le cache si nécessaire en validant votre configuration.

Installation du plugin

Téléchargez la dernière version de MenuDep sur la zone et décompressez l’archive ZIP.

Ou récupérez la dernière version par svn :

svn export svn://zone.spip.org/spip-zone/_plugins_/_stable_/menu-navigation_depliant

L’installation nécessite de placer le dossier du plugin dans votre dossier plugins. Pour plus d’information sur l’installation d’un plugin, consulter cette page sur Spip.net.

Si vous avez créé vos propres squelettes, il vous faut adapter votre fichier inc-rubriques.html. Inspirez-vous du inc-rubriques.html qui se trouve dans le dossier du plugin MenuDep.

Si vous utilisez la distribution par défaut des squelettes de SPIP, le squelette inc-rubriques.html de MenuDep est pris en charge automatiquement (sauf éventuel conflit de plugins).

En option, si vous désirez voir appliquée la règle EXPOSE aux titres des articles dans le menu de navigation, vous devez modifier votre squelette article.html afin de transmettre l’identifiant de l’article lors de l’appel. La ligne :

<INCLURE{fond=inc-rubriques}{id_rubrique}

est à remplacer par :

<INCLURE{fond=inc-rubriques}{id_rubrique}{id_article}>

Voir la version corrigée du squelette article.html pour illustration.

Là aussi, si vous utilisez la distribution par défaut des squelettes de SPIP, le squelette article.html de MenuDep est pris en charge automatiquement (sauf éventuel conflit de plugins).

Script principal

Ce paragraphe n’est plus d’actualité pour les versions de MenuDep <= 0.20. Ce paragraphe est conservé en guise de note. jsmin est plus performant que compacte (qui lui, est intégré à SPIP), mais plus difficile à maintenir.

Le script javascript principal jquery-menudep-min.js est une version compressée du script jquery-menudep.js qui est également fourni avec cette distribution. Vous pouvez modifier le script non compressé, puis le compresser avec jsmin pour remplacer jquery-menudep-min.js.

En ligne de commande :

jsmin < jquery-menudep.js > jquery-menudep-min.js

Définition des feuilles de style

MenuDep modifie à la volée le menu de navigation généré en enveloppant les listes des sous-rubriques dans une boite (div). Consulter le source de votre page générée peut être trompeur.

Voici la structure d’un menu de navigation au format CSS :

#navigation {
        /* boite principale */
}
#navigation .rubriques {
}
#navigation .rubriques h2 {
        /* Titre de la boite */
}
#navigation .rubriques ul {
}
#navigation .rubriques ul li {
        /* une rubrique */
}
#navigation .rubriques ul li div.srub {
        /* l'enveloppe fixe ou flottante */
}
#navigation .rubriques ul li div.srub ul {
        /* boite liste de sous-rubriques ou d'articles */
}
#navigation .rubriques ul li div.srub ul li {
        /* sous-rubriques ou articles */
}

Plussoyez !

Les forums sont fermés.

  • Menu de navigation dépliant pour SPIP 15 mars 2008 00:49, par mirek

    Bonjour,

    Je viens d’installer MenuDep.

    Mon souci est qu’il reste insensible à la configuration : les sous menu reste toujours déplié même si j’active option "menu flotant". Pareil pour les couleurs des boites.

    Je n’ai pas modifié le squelette du SPIP.

    Que-ce qui cloche dans ma config ?

    Les forums sont fermés.

    • Menu de navigation dépliant pour SPIP 15 mars 2008 13:06, par Paladin
      Javascript activé ?

      Les forums sont fermés.

      • Menu de navigation dépliant pour SPIP 15 mars 2008 14:47, par mirek
        Affirmatif : aussi bien sous IE que sous Firefox

        Les forums sont fermés.

        • Menu de navigation dépliant pour SPIP 15 mars 2008 20:03, par Paladin
          Je viens d’installer le plugin sur http://demoplug.free.fr/ sans modifier les squelettes de la distribution SPIP. Ca fonctionne impec !
          Difficile d’en dire plus. A priori, si ça ne fonctionne pas, probablement un problème de squelette.

          Les forums sont fermés.

          • Menu de navigation dépliant pour SPIP 15 mars 2008 21:05, par mirek

            Mon site est encore en local et les seuls changements concernait les .css.

            Pour en avoir le cœur net je l’ai installé à nouveau et publié quelques articles ; le problème persiste. Il s’agit de la version 1.9.2 d du SPIP ;
            Apache:1.3.33 , Php:4.3.10.

            « Si vous utilisez la distribution par défaut des squelettes de SPIP, le squelette inc-menu.html de MenuDep est pris en charge automatiquement (sauf éventuel conflit de plugins). »

            Par contre, dans le repertoire menu-navigation_depliant je n’ai trouvé nul part de fichier inc-menu.html

            Est-ce un indice pour trouver l’erreur ?

            Les forums sont fermés.

  • Menu de navigation dépliant pour SPIP 24 avril 2008 14:38, par teger

    Bonjour,

    j’ai installé un spip 1.9.2d et juste activer le plugin.

    Et dans le front, ca ne fonctionne pas.
    Le menu est entièrement déplié par défaut.

    Que faut-il faire pour que cela fonctionne sur une 1.9.2 d

    merci d’avance

    Les forums sont fermés.

    • Menu de navigation dépliant pour SPIP 25 avril 2008 16:41, par Paladin
      Le configurer ? (menu configuration en backoffice)

      Les forums sont fermés.

      • Menu de navigation dépliant pour SPIP 24 juin 2008 23:32, par clob
        Bonjour,
        J’ai installé le plugin menudep sur un spip 1.9.2c ’native’ (sans rien d’autre), avec config de base et j’ai le même problème que la plupart des utilisateurs : le menu rubrique reste tout le temps déplié et la ’flybox’ ne s’affiche pas.
        Dommage, ce Menu est exactement ce que je cherchais et j’en ai pas trouvé d’autre équivalent sur le web. Si qqun pouvait m’aider....
        Merci

        Les forums sont fermés.

        • Menu de navigation dépliant pour SPIP 26 juin 2008 23:26, par Marc

          Bonjour,

          Merci pour ce plug-in.
          Néanmoins, comme mes petits camarades (même config), le menu reste entièrement déployé :-(

          (évidemment il est configuré, le squelette inc-rubrique est d’origine, donc les styles sont les bons)

          Si quelqu’un a trouvé la solution, nous sommes preneurs :)
          Merci aux bonnes âmes.

          Les forums sont fermés.

          • Menu de navigation dépliant pour SPIP 28 juin 2008 19:08, par Christian PAULUS

            Ca ne fonctionne pas sur votre site ?

            Quelques pistes :

            - 1) vérifier si javascript actif
            - 2) sous Firefox, vérifier si erreur Javascript (Modules WEB Developer + Firebug - outils redoutables, absolument indispensables -, afficher le log des erreurs, la console. Si erreur javascript, le dire ici en précisant les autres plugins SPIP utilisés et la version de SPIP. Indiquer également si vous avez modifié la librairie JQuery)
            - 3) vérifier si le bon squelette est activé (si erreur de squelette par exemple, lorsqu’il y en a plusieurs, dont un dans le dossier de vos squelettes). Vérifier que le bon squelette est appelé en plaçant un titre de test en tete du squelette, etc.). Pensez à vider le cache à l’installation du plugin et entre les tests. Le squelette est mis en cache, trompeur parfois.
            - 4) aller dans le menu config du menu déroulant et confirmer les options (bouton Configuration sous SPIP, onglet "Menu dépliant", etc...)

            Courage ! Ici, ça fonctionne. Donc c’est probalement un tout petit paramètre qui ne fonctionne pas qq part sur votre site. Et ce n’est pas un tout petit paramètre qui va faire la loi !

            Non de non !

            Les forums sont fermés.

            • Menu de navigation dépliant pour SPIP 30 juin 2008 09:28, par clob

              Merci pour tes infos Christian,
              Voici quelques infos que j’ai pu recueillir :

              - Erreur javascript lorsque je clique sur une ligne de menu :

              Warning : Unknown property ’behavior’. Declaration dropped.
              Source File : http://localhost/test/dist/spip_style.css
              Line : 78

              - Dans Firebug je vois également cela :

              Not Found

              The requested URL /local/cache-js/jquery-menudep-compacte-1c72.js was not found on this server.

              J’ai installé un spip de base sans rien toucher et créé une ou 2 rubriques et un ou 2 articles.
              Je n’ai absolument rien customisé.

              Les forums sont fermés.

              • Menu de navigation dépliant pour SPIP 30 juin 2008 12:27, par Christian PAULUS

                Intéressant. Ce n’est pas la première fois que je vois ce genre d’erreur sur un js en cache local.

                Je vais retirer la mise en cache du js et reposter le zip ici dans qq minutes.

                Pour le behavior, c’est une déclaration pour IE qui ne devrait pas être là. Mais ce n’est pas très important.

                Les forums sont fermés.

                • Menu de navigation dépliant pour SPIP 30 juin 2008 15:51, par clob

                  Bonjour,
                  Merci pour ce nouvel update : maintenant j’ai cette erreur :

                  The requested URL /plugins/menu-navigation_depliant/javascript/jquery-menudep.js was not found on this server.

                  et effectivement lorsque je regarde le source de la page généré, il semble qu’il manque le nom du site (/test) dans l’URI de l’appel au javascript (d’ou le 404).
                  Voici un extrait du code source.

                  <script type='text/javascript' src='/plugins/menu-navigation_depliant/javascript/jquery-menudep.js'>
                  </script>

                  Alors que l’on devrait avoir :

                  <script type='text/javascript' src='/test/plugins/menu-navigation_depliant/javascript/jquery-menudep.js'>
                  </script>

                  Les forums sont fermés.

                  • Menu de navigation dépliant pour SPIP 30 juin 2008 18:55, par Christian PAULUS
                    Dans le doute, modification de la recherche du chemin pour le fichier JS. Version 1.06 postée ce jour.

                    Les forums sont fermés.

                    • Menu de navigation dépliant pour SPIP 30 juin 2008 21:09, par clob

                      Bonsoir,
                      On progresse !
                      En fait je ne vois aucun changement sur le build 1.06 (tjs le.js not found), mais après avoir cherché un peu et rajouté le nom de mon site dans le fichier menudep_pipeline_insert.php à l’endroit suivant :

                      <script type='text/javascript' src='/test/".find_in_path('javascript/jquery-menudep.js')."'></script>

                      le menu semble fonctionner correctement.
                      Le pb est qu’il est codé en dur. Il doit surement y avoir un moyen de le récupérer d’une variable quelconque (je ne connais pas SPIP).
                      En tout cas, merci pour l’aide et le temps passé

                      Les forums sont fermés.

                      • Menu de navigation dépliant pour SPIP 11 août 2008 11:00, par Dom Lepaisant

                        Bonjour

                        J’ai rencontré exactement le même pb. Pour corriger, j’ai juste modifié la ligne d’appel du script ds menudep_pipeline_insert_head.php en ajoutant un point devant le slash en début de ligne

                        <script type='text/javascript' src='/".compacte(find_in_path('javascript/jquery-menudep.js'),'js')."'></script> modifié en <script type='text/javascript' src='./".compacte(find_in_path('javascript/jquery-menudep.js'),'js')."'></script>

                        Le plus étonnant, c’est que pour plusieurs sites sur le même serveur, sous la même version de spip, même squelettes, mêmes plugins activés, l’erreur ne se produisait pas à chaque fois. Allez comprendre !!!

                        A noter que ça fonctionne sous spip 2.0, voir ici (juste testé ss FF3) mis à part que l’option vider le cache ds la page de conf du site n’apparait pas (le cache est toujours signalé comme étant vide), mais je n’ai pas cherché pourquoi.

                        En tt cas, bravo pour ce menu.

                        DoM

                        Les forums sont fermés.

                        • Menu de navigation dépliant pour SPIP 18 septembre 2008 19:19, par Maitresinh
                          et si on veut cacher les rubriques de la racine, ou faire des ouvertures "en tiroir" ? comment s’y prend on ?

                          Voir en ligne : et si...

                          Les forums sont fermés.

  • Menu de navigation dépliant pour SPIP 3 novembre 2008 13:50, par Christophe
    Salut
    j’ai installé sur une racine www.infogm.org, deux spip... le premier est www.infogm.org/ecrire et le deuxieme www.infogm.org/ resogm/blingbling/ecrire.
    Sur le deuxième, j’ai installé le plugin MenuDep, qui comme les commentaires ci-dessous le précisent, reste DEPLIE. J’ia donc vérifier plusieurs fois ma config’, vérifier mes squelettes, utiliser les squelettes spip par défaut, pour voir. Rien n’y fait. Aujourdh’ui, je suis allé sur la page http://www.infogm.org/resogm/blingb... et j’ai découvert un truc très curieux :
    Dans le cadre explicatif, à gauche de l’écran, le lien proposé pour [via la page de configuration] est... non pas resogm/blingblming/ecrire mais infogm.org/ecrire.
    Je suppose que ceci peut jouer.
    Est-ce que je peux modifier quelque part le chemin de ce lien ?
    Merci de votre aide
    Cordialement
    C.

    Voir en ligne : Rés’OGM

    Les forums sont fermés.

    • Menu de navigation dépliant pour SPIP 3 novembre 2008 15:57, par Christian PAULUS

      Dans ’plugin.xml’, remplacer le lien absolu par un lien relatif résoudra peut-être ce soucis.

      via la page de configuration->/ecrire/?exec=configuration

      par

      via la page de configuration->ecrire/?exec=configuration

      A tester.

      Les forums sont fermés.

      • Menu de navigation dépliant pour SPIP 20 novembre 2008 18:32, par efche

        Comme plusieurs je cherche ce type de menu qui est pratique et esthétique, si on y ajoute des styles.

        Mais comme plusieurs messages ci-dessus, le menu reste déplié ou plus exactement pour moi partiellement déplié. J’ai une arborescence à plusieurs niveaux au moins 4.

        Est-ce dû à cela ?

        Dan la demo on ne voit qu’un exemple tout simple, ce que j’ai d’ailleurs vérifié sur une dist et ça marche, mais pas lorsque il y plusieurs sous-niveaux ?

        Peux-tu nous confirmer ce comportement ?

        Y a-t-il une modification à prévoir ?

        françois

        Les forums sont fermés.

        • Menu de navigation dépliant pour SPIP 20 novembre 2008 22:46, par Christian PAULUS

          Hmmm. En effet. Il faut probablement adapter le squelette (la noisette ?) pour les appels recursifs qui permettent d’afficher les sous[sous[sous[...]]]rubriques correctement.

          J’avoue que, n’appreciant pas les arbos trop complexes, profondes, je n’ai pas approfondi le sujet.

          A suivre...

          Les forums sont fermés.

          • Menu de navigation dépliant pour SPIP 27 février 2009 10:30, par ZiWaM

            Bonjour,

            Tout d’abord merci pour ce plugin car il me rend bien service.
            J’aurais 2 suggestions pour son évolution :

            - Je souhaiterais pouvoir désactiver tous les effets car dans certains cas il est mieux d’avoir un menu simple mais bien construit. Ca pourrait simplement se faire avec un bouton désactivant l’insertion des Javascripts dans le header ?
            - La seconde concerne les vieux navigateurs interprétant mal les imbrications CSS du type ul > li > ul. Je ne connais pas de hacks pour contourner ça et je me disais qu’introduire des class="leveln" dans les listes permettrait de palier ce problème.

            Ya moyen de faire quelque chose dans ce sens ?

            ZiWaM

            Les forums sont fermés.

  • Menu de navigation dépliant pour SPIP 30 mars 2009 00:51, par dogui

    Bonjour,

    je viens d’installer ce super plug in qui correspond exactement à mes besoins. Mais j’ai 2 problèmes :

    1. le menu reste entièrement déplié. Pourtant j’appelle le même inc-rubriques que la distribution sauf qu’elle est situé dans mon répertoire squelette... J’ai testé avec le squelette article par défaut et ça fonctionne mais pas avec mon article.html...

    2. J’aimerais ajouté une boucle permettant de filtrer le menu afin de supprimer des rubriques ayant le mot clé invisible : j’ai donc la boucle suivante :
    BOUCLE_menu_rubrique_invisible2(RUBRIQUES) racine titre_mot = invisible doublons
    /BOUCLE_menu_rubrique_invisible2
    Mais je ne sais pas où la situé dans inc-rubrique.html pour qu’elle soit prise en compte...

    Merci pour vos réponses qui me seront d’une grande aide !

    Les forums sont fermés.

  • Menu de navigation dépliant pour SPIP 2 avril 2009 20:48, par RP
    J’utilise ce plugin sur un SPIP 2.03 et cela fonctionne bien.
    J’aimerais avoir 2 menus dépliants sur une même page avec des CSS différents. Comment puis-je configurer le menu pour en avoir 2 ? Celui installé est dans contenu, l’autre serait dans extra

    Voir en ligne : respeq

    Les forums sont fermés.

    • Menu de navigation dépliant pour SPIP 3 avril 2009 09:37, par Christian PAULUS

      C’est un ID qui est utilisé ici. Le dupliquer ne fonctionnera pas, il faut renommer et adapter le javascript.

      Bon courage.

      Les forums sont fermés.

  • Menu de navigation dépliant pour SPIP 28 juillet 2011 15:16, par Tara

    Bonjour,

    Merci beaucoup pour votre mise à jour rapide. Je vois ainsi l’interface de configuration dans le menu Configuration.

    Par contre, je ne constate aucune modification sur mon site...

    J’ai remplacé le fichier squelettes-dist/inc-rubriques.html de mon site, par le inc-rubriques.html que vous proposez à la racine du plugin. Vider le cache. Aucune modification. J’ai ensuite essayé avec le fichier inc-rubriques.html du répertoire squellettes du plugin. Vider le cache. Aucune modification.

    Auriez-vous une idée pour m’aider ?

    Merci d’avance

    Les forums sont fermés.