Menus

Créez enfin vos menus facilement !

Introduction

Lorsqu’on ne se sert pas du plugin ’Menus’, on est obligé de définir tous ses menus dans les squelettes, ce qui fait que les administrateurs du site n’ont pas directement la main dessus, que lorsqu’ils veulent y changer quelque chose, ils sont obligés d’en faire la demande à la personne en charge des squelettes.

De plus, lorsqu’on veut des liens statiques (un lien vers un article précis, ou vers une page précise, ou vers un site externe) il faut les écrire en dur dans le squelette du menu.

Le but du plugin ’Menus’ est donc de permettre de facilement élaborer des menus au moyen d’une interface conviviale, directement dans la partie privée.

Attention ! Ce plugin ne s’occupe pas de la manière dont seront affichés les menus. Il permet de les créer facilement et d’en générer le HTML.

Pour l’affichage, voyez avec votre thème ou des plugins spécifiques tels que Menu animé déroulant, Menu Déroulant 2, Menu Accordéon 2 ou Menu jQuery Superfish.

Installation

Comme n’importe quel plugin.

Création d’un menu

Le plugin ajoute un lien dans le bandeau de SPIP :

La page liste tous vos menus, et vous propose d’en créer un nouveau :

D’abord vous devez identifier votre menu. Il faut lui donner un titre, ainsi qu’un mot-clé qui vous permettra de l’appeler facilement. En effet, vous ne pouvez pas prévoir à l’avance dans vos squelettes le numéro du menu. Grâce à ce mot-clé identifiant, vous n’avez donc pas à modifier vos squelettes à chaque fois. Vous pouvez également saisir une classe qui sera ajoutée au premier élément ul du menu généré. Ceci peut permettre d’activer la gestion de l’affichage par un plugin tiers.

Vous pouvez alors commencer à construire le menu en ajoutant des entrées :

Les différents types d’entrées

Les Menus sont fournis pour l’instant avec plus de dix types d’entrées qui permettent déjà de construire la plupart des menus facilement.

N’hésitez pas à en proposer d’autres !

Voici la description de quelques uns des types d’entrées disponibles :

-  Lien arbitraire : vous pouvez créer des liens vers ce que vous voulez en donnant une adresse et un titre.

-  Objet de SPIP : crée un lien vers n’importe quel objet éditorial de SPIP. Ça peut être un article, une rubrique ou n’importe quoi venant d’un plugin.

-  Liste dynamique de rubriques et d’articles : vous pouvez afficher les rubriques de SPIP, y compris de manière arborescente. Pour cela, il suffit de définir la rubrique dans laquelle il faut commencer la liste, le niveau maximum de sous-rubriques, les exclusions éventuelles, le type de tri... Vous pouvez aussi inclure les articles dans l’arborescence, limiter leur nombre, en gérer le tri...

Modification des entrées

Lorsque vous avez déjà ajouté des choses, vous obtenez alors la liste des entrées sous cette forme :

Vous pouvez alors déplacer les entrées pour modifier leur ordre, les supprimer, changer leurs paramètres et créer des sous-menus en-dessous des entrées qui le permettent.

Utiliser les menus dans votre site

Pour afficher un menu dans votre site, il vous suffit d’inclure un petit squelette où vous le désirez :

#INCLURE{fond=inclure/menu, env, identifiant=<votre_menu>}

Vous pouvez aussi tester votre menu facilement en cliquant sur le bouton « Voir en ligne » ou en allant sur la page : spip.php?menu<numero>

Exporter les menus vers un autre site

Imaginons que sur une version de votre site en local vous réorganisez tous les menus. Pour reporter ces changements en prod, il faut exporter les menus dans un fichier et les réimporter en prod.

S’assurer tout d’abord que le plugin Yaml est activé .

Lorsqu’il est activé une icône apparaît : exporter ce menu

Le sauvegarder sur votre ordinateur

Sur le site de destination, il suffit de créer un nouveau menu avec le même identifiant ( penser à le supprimer avant s’il existe). Et à la création, si le plugin YAML est bien activé, la boite de choix de fichier est proposée.

Surcharge des fichiers menus/<type>.html

Si pour des besoins particuliers, on doit surcharger un fichier du répertoire menus/, il ne faut pas oublier de copier le fichier XML de description qui va avec.

En effet, le plugin cherche le fichier XML au même endroit que le fichier HTML.

Discussion

354 discussions

  • 1

    Bonjour,

    J’ai installé le squelette ZPIP qui utilise le plugin Menu. Je vois bien le menu mais pas les sous-menu ? Pourquoi ?

    Est-ce dû au thème choisi ? (Wu Wei Blanc) au squelette ZPIP ? ou est-ce une limitation du plugin ?

    Merci de votre réponse

    • C’est du au thème, tous les thèmes ne sont pas compatibles avec les sous menus.

      Certains pourrait être adapter, mais cela prend énormément de temps pour faire des sous menus qui fonctionne bien.

      Tu peut voir ce qu’il est possibe de faire en ajoutant tes styles dans squelettes/perso.css

    Répondre à ce message

  • Ce plugin est un peu mon graal (je veux faire des menus croisé avec des mots clef et autre,

    je suis archi débutant sous spip(j’ai eva web) et je cherche à l’incorporer dans mon site, comment je dois m’y prendre. J’ai le plugin, je peux editer des menus mais après je coince, squelette et tout ça, je suis un peu perdu sur la syntaxe à mettre dans une petite page html pour inclure un bloc...

    merci de votre aide

    yvan

    Répondre à ce message

  • Bonjour

    Merci pour ce plugin qui est bien intéressant : juste une petite question, est-ce que vous avez prévu de développer une partie Articles dynamiques également ?
    ce serait plus simple que d’ajouter des objets à chaque fois....

    Merci de votre réponse !!

    Répondre à ce message

  • Bonjour, Shnoulle,

    Si tu as une idée pour le faire sans trop alourdir le code, la zone est ouverte ;)

    Des idées, dans l’abstrait, je peux en avoir... mais, vu mes compétences, je ne pense pas pouvoir les traduire en code... Quand j’ai du temps, ma contribution est de tester des applications et d’envoyer des retours...

    Je pensais, dans le cas du plugin menus , pouvoir utiliser les champs Classes CSS commenté ainsi pour le menu : Vous pouvez ajouter au menu d’éventuelles classes CSS supplémentaires, ainsi pour un item : Classes CSS de l’entrée [Facultatif] et en tester les applications. Ce que je n’arrive pas à faire...

    Bonne fin d’année et meilleurs vœux pour 2010 !

    Cordialement, KMk.

    Répondre à ce message

  • 2

    Re- , Shnoulle,

    Me voilà un peu plus informée : la balise [(#EXPOSE)] fonctionne dans une boucle article. Le plugin menus n’utilise pas cette boucle (le lien vers un article est un lien vers un objet).

    Donc la question demeure... est-il possible d’avoir un effet « lien on » avec un menu créé avec le plugin menus  ? Ou, autre façon de poser la question, comment arrive-t-on à obtenir cet effet « lien on » avec, par exemple, le thème BluePigment (ou tout autre thème) de Zpip  : http://www.spip-contrib.net/BluePigment-1-0 ?

    Voilà. Je ne sais pas si ma question est plus claire formulée ainsi...

    Merci pour votre réponse par avance !

    Cordialement,

    KMk.

    • Précision supplémentaire : le « lien on » de BluePigment fonctionne avec un lien qui dépend d’une boucle (rubrique, mot-clef). Est-il possible d’avoir cet effet sur les autres liens ?

    • C’est à fabriquer dans le menu avec des tests etc ...

      Pas évident selon les menu, EXPOSE étant fait pour les articles et rubriques. Pour les autres élément, c’est uniquement sur l’élément en lui même, mais pas sur les dépendants. Mais par exemple, si tu es sur un article possédant tel mots clés, il n’est pas prévu d’ajouter la classe on dans le menu par mots clés.

      Si tu as une idée pour le faire sans trop alourdir le code, la zone est ouverte ;)

    Répondre à ce message

  • Bonjour, Shnoulle,

    Je me suis sans doute mal exprimée... J’ai testé avec succès le plugin menus, créé un menu à partir de l’interface privée, inclus ce menu dans la page avec la ligne de code prévu pour : spip.php?page=test_menus&identifiant=<votre_menu>. Concernant les styles maintenant, je les inclus sur la page elle-même en utilisant bien entendu ma feuille de style externe... Donc, j’interviens sur les pages et le code (avec des compétences qui sont loin d’être celles d’un expert, mais je me débrouille).

    • Concernant le plugin, il semble qu’on puisse, à partir de l’interface privée, utiliser du css. Je me demandais comment on pouvait utiliser la déclaration des classes à partir du champ Classes CSS commenté ainsi pour le menu : Vous pouvez ajouter au menu d’éventuelles classes CSS supplémentaires, ainsi pour un item : Classes CSS de l’entrée [Facultatif]. Quelle syntaxe utiliser dans ces champs ? Il me faudrait un exemple concret d’utilisation de ces champs de l’interface de gestion des menus pour savoir ce qu’on peut en faire.
    • Seconde question effectivement : le lien actif... Je vais me renseigner sur l’utilisation de cette balise [(#EXPOSE)].

    Je vous remercie pour ces premiers éléments de réponse. Si vous pouviez m’apporter des précisions sur l’usage du css que permet le plugin, cela me permettrait de faire un pas de plus.

    Très bonne fin d’année à vous ! Cordialement,
    KMk.

    Répondre à ce message

  • 1

    Bonjour,

    Je teste actuellement, dans des configurations diverses, le plugin menus qui me semble ouvrir de belles perspectives à spip.

    Je crée donc un menu, j’intègre la ligne de code là où je désire voir apparaître mon menu, tout marche bien...

    Je me heurte cependant sans cesse à la même interrogation : comment ajouter des classes .css au menu ou aux liens créés : quelle syntaxe utiliser ?

    Un exemple concret : si j’utilise le thème BluePigment, voici comment je fais :

    • j’intègre la ligne de code dans une barre-nav.html,
    • j’utilise dans ce fichier les balises css des blocs.
      Mais comment définir un style à chaque élément des puces (lien en cours par exemple) ? Que faut-il déclarer dans la ligne prévue pour le .css : les identifiants déjà existant dans les feuilles de styles ? faut-il faire autrement ?

    Si vous pouviez me donner un peu de lumière... tout ce que j’ai tenté n’a rien donné pour l’instant.

    Merci par avance ! Très bonne fin d’année à vous !

    KMk

    • Salut,

      Je ne comprend pas très bien, tu souhaite créer ton propre menu ou utiliser l’un des menus du plugin menus ?

      Pour les classes css on, c’est en général la balise [(#EXPOSE)].

      Sinon, tu peut forcer une classe dans ton menu, dans ce cas, tu pourras utiliser la feuille de style perso.css dans ton squelette.

      Mais j’ai sans doute mal compris ???

    Répondre à ce message

  • 2
    Pierre-Tho

    Bonjour, je suis néophyte, j’ai lu l’article, plus le commentaire ci-dessous, mais je ne parviens pas à faire afficher le menu désiré sur la droite du thème que j’ai sélectionné.

    Thème : CoolWater
    SPIP : dernière version

    titre du menu : menu_silverball
    identifiant du menu : menu_silverball

    Quels sont les 2 fameux fichiers à mettre à jour pour que cela fonctionne ?

    J’ai déposé un fichier : menu_silverball.html dans : spip/plugins/auto/menus/inclure

    avec à l’intérieur :

    quel est l’autre fichier à modifier ? Où est-il placé dans l’arborescence ? Est-ce que je dois supprimer du code pour faire appel au plugin Menu ?

    Merci d’avance pour vos réponses... aux moins me dire l’emplacement des fichiers à modifier.

    Cordialement,

    Pierre-Tho

    Site en cours de modif : http://www.silverball.fr/spip

    • Pourquoi faudrait-il ajouter un quelconque fichier ? À quelle endroit de la documentation est-ce marqué cela ? Jamais.

      C’est marqué d’inclure la noisette qui affiche un menu, en lui passant en paramètre l’identifiant du menu : #INCLURE{fond=inclure/menu, env, identifiant=menu_silverball}

      À inclure à l’endroit voulu de votre squelette.

    • Pierre-Tho

      Bonsoir,

      OK j’ai une noisette à mettre dans un fichier pour faire afficher le menu. Mais ce que je ne trouve/comprends pas est l’emplacement du menu qui est sur la droite du site ?
      J’avoue être un peu perdu dans la structure de SPIP. Une fois que je l’aurais bien assimilé j’imagine mieux cibler les modifs. Mais là pour le moment je n’y arrive pas !
      D’ailleurs quand j’insère la noisette dans le fichier : barre-nav.html j’ai uniquement le bouton accueil qui apparait et aucune de mes titres que j’ai sélectionné dans le module du Menus ! Pourquoi ?

      Merci d’avance de ton aide... je sais je fais le boulé... mais une fois que tu m’auras expliqué je me débrouillerai ;-)

      Cordialement,

    Répondre à ce message

  • Bonjour,

    Je découvre votre plugin menus en même temps que zpip et le thème arclite.
    Le menu barre de navigation, identifiant barrenav prévu dans zpip fonctionne correctement.

    Je souhaite afficher un menu latéral personnalisé dans la colonne de droite. Je souhaite ne sélectionner que certaines rubriques.

    J’ai donc créé un menu avec l’identifiant barrenavsecteurs.
    Dans plugins/menus/inclure j’ai envoyé un fichier barre-nav-secteurs.html avec ce contenu

    Ensuite dans le squelette rubrique.html, j’ai ajouté

    J’ai donc ajouté des classes CSS dans le champ prévu à cet effet.
    #navigation .menu ul li a:hover color : #0071bb ; #navigation .menu ul li a color :#000000 ; display:block ; font-size:120% ; padding:3px 30px 3px 12px ; text-decoration:none ; text-transform:uppercase ; et ensuite j’ai tenté d’appeler ces classes à partir de plusieurs fichiers : d’abord via le rubrique.html ensuite via le barre-nav-secteurs.html mais :

    Le menu fonctionne et apparaît avec les rubriques choisies mais la mise en forme n’est pas ce que je souhaite.

    Qn pourrait-il m’expliquer comment habiller ce menu comme dans le thème arclite d’origine ?

    Voir fichier joint

    Un très grand merci pour votre aide.
    Bonne soirée

    Répondre à ce message

  • 2

    N’hésitez pas à en proposer d’autres !

    J’ai des idés (menu article par mot clé).

    Mais suffit il d’ajouter 2 fichiers dans menus/menus ?
    Par exemple articlemot.xml et articlemot.html .

    articlemot.html étant le menu public proprement dit ?

    Merci

    • Oui il suffit bien d’ajouter deux fichiers :

      • Un XML décrivant le type d’entrée
      • Un HTML décrivant non pas l’apparence public mais celle public ET privé (dans l’interface de config).

      Regardez les fichiers existants pour comprendre. Une documentation a aussi été écrite : Ajouter des types d’entrées pour les menus

    • Une documentation a aussi été écrite : Ajouter des types d’entrées pour les menus

      Comme quoi on ne regarde jamais assez, merci

    Répondre à ce message

Ajouter un commentaire

Avant de faire part d’un problème sur un plugin X, merci de lire ce qui suit :

  • Désactiver tous les plugins que vous ne voulez pas tester afin de vous assurer que le bug vient bien du plugin X. Cela vous évitera d’écrire sur le forum d’une contribution qui n’est finalement pas en cause.
  • Cherchez et notez les numéros de version de tout ce qui est en place au moment du test :
    • version de SPIP, en bas de la partie privée
    • version du plugin testé et des éventuels plugins nécessités
    • version de PHP (exec=info en partie privée)
    • version de MySQL / SQLite
  • Si votre problème concerne la partie publique de votre site, donnez une URL où le bug est visible, pour que les gens puissent voir par eux-mêmes.
  • En cas de page blanche, merci d’activer l’affichage des erreurs, et d’indiquer ensuite l’erreur qui apparaît.

Merci d’avance pour les personnes qui vous aideront !

Par ailleurs, n’oubliez pas que les contributeurs et contributrices ont une vie en dehors de SPIP.

Qui êtes-vous ?
[Se connecter]

Pour afficher votre trombine avec votre message, enregistrez-la d’abord sur gravatar.com (gratuit et indolore) et n’oubliez pas d’indiquer votre adresse e-mail ici.

Ajoutez votre commentaire ici

Ce champ accepte les raccourcis SPIP {{gras}} {italique} -*liste [texte->url] <quote> <code> et le code HTML <q> <del> <ins>. Pour créer des paragraphes, laissez simplement des lignes vides.

Ajouter un document

Suivre les commentaires : RSS 2.0 | Atom