Menu jQuery Superfish

Ce plugin est un portage pour Spip du plugin jQuery Superfish de Joel Birch : http://users.tpg.com.au/j_birch/plu...

Principe

Ce plugin permet l’affichage d’un menu déroulant horizontal ou vertical sur une structure de menu de type ul/li.

Ce plugin ne s’occupe pas du contenu du menu. Le travail peut-être délégué au plugin Menus ou à une noisette Aveline par exemple ou même géré indépendamment en squelette. Il suffira de donner au ul principal du menu la même classe que celle définie dans la page de configuration de ce plugin (Voir ci-dessous).

Installation

Comme tous les autres plugins, cf. https://www.spip.net/fr_article3396.html

Le plugin nécessite les plugins Saisies et YAML (+ Spip_Bonux pour Spip 2.1).

Activation du menu

Attention : Suite à un bug dans le plugin Saisies, le formulaire de configuration ne fonctionnera pas si vous activez l’option Permettre le HTML5 dans les pages de configuration avancée de SPIP.

La page de configuration du plugin permet de :

  • choisir le type de menu à activer : horizontal et/ou vertical
  • saisir la classe de l’élément ul principal du menu
  • saisir l’effet d’animation lors de l’affichage des sous-menus
  • saisir le délai entre la sortie du pointeur du sous-menu et la fermeture de celui-ci

Il ne reste plus qu’à définir vos couleurs en surchargeant la feuille de style du plugin.

Discussion

32 discussions

  • 3

    Bonsoir et bonne année

    Une version pour spip 3.1 est prévue?

    Merci d’avance

    • Bonjour,
      Est-ce que le plugin est maintenu, ou faut-il voir pour d’autres solutions ?
      En vous remerciant

    • Salut,

      le plugin n’est plus maintenu néanmoins, il est compatible 3.1 (V 0.5.4).

      jeanmarie

    • Bonjour Jean Marie,
      Quel dommage, c’était un bon petit plugin qui le faisait bien.
      A tout hasard, existe-t-il une jolie petite alternative (idéalement proposé en responsive) ?

    Reply to this message

  • 1

    J’utilise ce plugin depuis plusieurs années, mais ce qui lui manque, pour l’instant, c’est une capacité responsive.
    Or, il existe une déclinaison de Jquery Superfish qui, par l’utilisation de Media Query passe, en dessous d’une largeur d’écran de 800px, d’un menu JQuery surperfish de base à un menu vertical et apparaissant par glissement (un “slide menu”, en quelque sorte).

    Voilà l’URL du dépot Gitub:
    https://github.com/chrisdivyak/EasyAsPie

    et celui de la Démo:
    http://code-baker.com/demo/easyaspie/

    Comment l’adapter pour qu’il fonctionne avec le plugin “Menu jQuery Superfish”?
    Surtout que l’exemple s’appuie sur le JQuery Superfish de base et j’ai un peu de mal à voir comment faire en sorte de l’appliquer au “menu navbar” que j’utilise.

    Une idée?

    Est-il imaginable de l’intégrer au plugin?
    Et, soyons fou, d’ajouter à la config le seuil de largeur d’écran pour le basculement vers le menu mobile.

    Merci d’avance

    • Xenospip

      Salut, c’était exactement ce que je cherchais à faire, et j’ai bidouillé un peu pour avoir enfin un résultat qui marche avec EasyAsPie: https://github.com/chrisdivyak/EasyAsPie.
      Étant donné qu’il possède de base Superfish, j’ai carrément désactivé le plugin. J’ai par contre gardé le plugin Menus pour gérer mon contenu.

      Pour info j’utilise Spip 3.0.19 et le squelette Spipr-dist.

      Pour ceux que ça pourrait intéresser, vu que je n’ai pas trouvé d’aide à ce sujet sur le net, voilà comment j’ai fait (à peu près).

      -  J’ai désactivé Jquery superfish
      -  J’ai mis le dossier “assets” de EasyAsPie à la racine de mon spip
      -  Ensuite des modification au niveau du code: J’ai récupéré la structure du fichier index.html de EasyAsPie et je l’ai adapté à mon spip. J’ai modifié le plugin Menus, le fichier menus\v1.5.9\inclure\nav.html (j’imagine qu’il y a beaucoup plus propre comme façon de faire) afin qu’il ressemble à ça:

      <script src="assets/js/superfish.js"></script>
      <script src="assets/js/easyaspie.min.js"></script>
      <script type="text/javascript">
      
          $(document).ready(function() {
              $('nav').easyPie();
          });    
          </script>
      
      [(#REM) 
              
              ZPIP 2.x
              
      ]<nav class="menu-conteneur navbar-inner applePie">
              #INCLURE{fond=inclure/menu, env, identifiant=barrenav}
      </nav>

      Comme j’utilisais Spipr-dist qui gère le responsive, il passe le menu sous-forme d’un bouton tout seul en dessous d’une certaine résolution. Étonnamment, mon menu EasyAsPie se déroulait sous ce dernier, et pas sous le sien. Je me suis donc servi de celui là, et je n’ai pas implémenté la ligne: <div class="menubtn">Menu Button</div> autrement nécessaire.

      J’ai aussi touché au fichier menu.html du même dossier, pour rajouter un id à la balise ul. Le bon id est “nav”, mais le plugin Menus en possède déjà un du même nom. J’ai donc mis

    Reply to this message

  • 1
    Hélène Laulan

    J’ai installé les 3 plugins ; j’ai activé les 3 plugins ; j’ai configuré le plugin Menu Jquery Superfish.
    Le menu de mon site sous SPIP 3 n’est toujours pas déroulant. Qu’est-ce que je n’ai pas compris ?
    Merci beaucoup de m’éclairer.

    • Bonjour,
      J’ai le même problème que vous. L’aviez-vous résolu ?
      Je vous remercie d’avance.

    Reply to this message

  • 2

    bonjour, le bouton submit du formulaire de configuration n’actionne rien, impossible de configurer quoi que ce soit.
    testé sur plusieurs configurations , dont SPIP 3.0.11 [20757] vierge.
    Personne n’a ce problème? bonne journée, Pierre

    Reply to this message

  • 12

    Salut,

    Je n’arrive pas à paramétrer le type de menu dans l’admin. J’ai désinstallé et réinstallé ce plugin (Version : 0.5.3 SVN [61460]) sans succès sur un site en SPIP 3.0.7

    Lorsque je veux enregistrer une config une popup s’affiche tout en haut de l’écran à droite avec “veuillez compléter ce champ”

    dd

    • Salut, le problème est toujours d’actualité ? As-tu vidé le cache du site et essayé sans autres plugins que superfish et ses dépendances ?

    • Thibaut

      Effectivement, j’ai le même problème que DD sur spip 3.0.8 avec superfish en 0.5.3. Il ne prend pas en compte la radiobox NON des différents type de menus (dans la config du plugin) et oblige ainsi à remplir tous les champs après avoir coché les radiobox OUI de toutes les sortes de menus.

      Le message s’affiche chez moi tout en bas à gauche de la fenêtre de firefox, en dehors même ! Ce qui fait que j’ai eu du mal à comprendre pourquoi en cliquant sur enregistrer il ne se passait aucune validation.

      Bref, un petit bug pas méchant je pense mais qui bloque effectivement :/

    • Salut, comme je n’arrive pas à reproduire le bug avec les mêmes version de SPIP et du plugin, il va falloir que l’unE d’entre vous me file un accès à son site pour que j’observe le problème.

      Vous pouvez passer sur IRC pour qu’on en discute un de ces jours : http://www.spip.net/irc

    • Même problème en admin sous SPIP 3.0.10, la sauvegarde n’est pas prise en compte lorsqu’on clique sur “OK” (peut être le bouton radio ?)

    • Salut, même proposition que précédemment :p

      Il va falloir que l’unE d’entre vous me file un accès à son site pour que j’observe le problème.
      Vous pouvez passer sur IRC pour qu’on en discute un de ces jours : http://www.spip.net/irc

      ++

    • Semble être un bug venant de “Saisie” (cf post de bruno31 le 16h46) sur la page http://contrib.spip.net/Saisies

      Merci b_b, je peux te donner un accès dès ce soir pour test.

    • Raphaël

      Bonjour,

      Des fois que cela puisse aider : j’ai rencontré le même défaut et il m’a fallu désactiver le html5 de spip pour que ma config soit prise en compte. De base : Il vous faut être admin de SPIP...

    • Ha cool de partager cette piste intéressante avec les personnes qui rencontrent aussi ce pb. C’est fort possible que ça vienne de là car l’activation du HTML5 déclenche l’utilisation de nouveaux attributs sur certains éléments de saisies, du coup c’est peut être bien ça le pb.

      ++

    • Raphaël

      Rendons d’ailleurs à César ce qui lui appartient car c’est bien toi qui m’avait aiguillé ! ^^

    • Ha ben oui je l’avais oublié celle là ^^

      http://contrib.spip.net/Menu-jQuery-Superfish#forum462852

      Comme quoi il est bon de chercher dans le forum avant de poser une question mais aussi avant d’y répondre :p

    • Raphaël

      Je ne peux que confirmer : en souhaitant tout du moins que la vérité ne soit pas ailleurs ! =°)

    • Un énorme merci également !! Après être repassé en HTML4 ET après avoir supprimé le cache, ça fonctionne ! Bravo !

    Reply to this message

  • 2

    Bonjour,

    Dès que j’active ce menu mes cartes GIS disparaissent ! (SPIP3 / GIS 4)

    dd

    • Salut, testé à l’instant sur SPIP 3.0.7 SVN [20355] avec GIS4 et jQuery Superfish à jour, aucun problème chez moi.

      Comme souvent une url vers la page où le problème peut être observé serait bien pratique pour t’aider...

    • Salut,
      Résolu !
      J’avais fait une erreur en plaçant le #INSERT_HEAD_CSS au mauvais endroit.

      Merci
      dd

    Reply to this message

  • 1

    salut mes amis
    je veux créer un menu déroulant avec Le module superfish + libraries API ,mais lorsque je clique sur configuer de superfish ,il ne me donne pas l’etape suivante.

    aidez moi SVP

    • Salut, quelle version de SPIP utilises-tu ? De quelles librairies tu parles ? Le plugin n’en nécessite pas oO

    Reply to this message

  • 3

    Bonjour !

    Je n’arrive pas à accéder la page de configuration du plugin et je ne sais pas pourquoi :

    “Accès interdit - Vous n’avez pas le droit d’accéder à la page configurer_jquerysuperfish.”

    Est-ce que vous avez une idée ?
    Merci en avance !

    • Bonjour,

      Ce plugin fonctionne-t-il sur mon squelette “scolaspip” ?

      Merci

    • Salut, pour accéder à la page de config du plugin il faut être administrateur avec le statut webmestre. Tu peux vérifier que c’est bien le cas sur ta fiche auteur dans le privé.

      ++

    • Je l’ai vérifieé et je suis bien “webmestre” ... ;-o

    Reply to this message

  • Hélène Laulan

    J’ai réussi à installer le menu en transformant le code de nav de inclure ; mais j’ai encore un problème :
    il y a toujours un trait noir qui se balade à droite des titres (que je ne suis pas parvenue à enlever dans le code css de superfish)

    Reply to this message

  • Ploufplouf

    Bonjour,

    J’aurai voulu savoir si quelqu’un pouvais me donner une astuce pour que le menu ne s’ouvre pas vers le bas mais vers le haut ?

    Je cherche en vain mais tous mes essais sont pas concluant...

    Merci de vos astuces

    Reply to this message

Add a comment

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 / PostgreSQL
  • 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 apparait.

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.

Who are you?
[Log in]

To show your avatar with your message, register it first on gravatar.com (free et painless) and don’t forget to indicate your Email addresse here.

Enter your comment here

This form accepts SPIP shortcuts {{bold}} {italic} -*list [text->url] <quote> <code> and HTML code <q> <del> <ins>. To create paragraphs, just leave empty lines.

Add a document

Follow the comments: RSS 2.0 | Atom