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

  • Hello. Ce plugin ne s’occupe pas de générer l’arborescence ul/li... C’est donc dans cette construction que tu dois intervenir.

    Reply to this message

  • Bonjour, et tout d’abord, que des louanges à faire sur ce plugin. Remarquable ! Je ne m’en lasse pas.
    Une question pour les sites multilingues : où peut-on glisser un &LANG dans le plugin pour que l’URL de pointage prenne ce paramètre en compte...

    En vous remerciant.

    Reply to this message

  • 5

    Rien compris ... excusez moi :(

    J’ai rajouté classe css sf_vertical et dans superfish classe sf_vertical, mais rien ne s’affiche sur ma page

    • Hello

      Y a t’il une url où on puisse voir le problème ?

      Si tu inspectes le code html généré, l’arborescence ul/li est-elle bien là ?

    • Bonjour,

      Merci pour ta réponse, la page est à l’adresse http://nh.enter-sect.com

    • voila quelques printscr de mes manips sur la config de menu et de superfish, si ça peut aider
      http://www.imagup.com/data/1140685070.html
      http://www.imagup.com/data/1140685118.html

    • Ta config de menu et de superfish semble correcte. Ce pendant tu n’as pas inséré dans ton squelette le menu “MonMenu” avec le code #INCLURE{fond=inclure/menu, env, identifiant=MonMenu}

      Actuellement ton menu est inséré avec <INCLURE{fond=inc-rubriques}>. Donc la classe sf_vertical n’y est pas.

    • Bizarrement l’inclusion avait sauté dans ma page sommaire merci ! Désolé pour le bruit sur le forum et le dérangement.

      Est ce que Muxort aurait trouvé la manip pour faire s’afficher les sous-menu à gauche ? ça me serait bien utile ! Merci

    Reply to this message

  • 3

    Bonjour,
    je voulais juste signaler une incompatibilité avec le plugin nochache...

    • Hello

      Peux tu donner un peu plus d’explications ? (Nocache est indiqué compatible spip 2.0 max et Superfish ne l’est qu’avec spip 2.1)

    • Bonjour Y,

      A l’activation de nocache, une longue suite d’erreurs (callstack) titrant par un
      Fatal error: Maximum function nesting level of ’100’ reached, aborting! in XXX\ecrire\inc\utils.php on line 155
      La liste des plugins ne s’affichent alors plus.

      Pour info, J’utilise les plugins saisie, yaml, cfg, bandeau, afficher_objets, court-circuit, encarts, et spip-bonux, mais aucun d’eux ne semble montrer d’incompatibilité.

      Une alternative est de prendre le plugin couteau suisse et de ramener le cache à 0. Ca fonctionne.

    • Hello

      Je ne sais pas si tu as trouvé une solution, mais j’ai eu le même problème en php 5.3. Et pas de souci en php 5.1. Je n’ai pas encore compris pourquoi...

    Reply to this message

  • Ok, merci beaucoup pour l’info.
    Bonne journée à vous,
    N

    Reply to this message

  • 3

    Bonjour,
    > J’ai créé mon menu (plugin Menus)
    > j’ai installé ce plugin
    > Je souhaiterai intégrer des mini-icones (en indiquant le lien)

    Pourriez-vous m’indiquer ce qu’il faudrait que je fasse svp ?
    Je fonctionne avec un squelette EVAweb, et ne sait pas intervenir dans les codes (malgré plusieurs tentatives avec skeleditor).

    Merci Beaucoup,
    N

    • Hello

      Tu voudrais avoir des icônes avant le texte de chaque élément de menu, c’est ça ? Il faudrait le faire en css... Enfin ça dépend un peu des icônes, y’en a une différente par élément de menu ?

    • Il y en a une par rubrique & sous rubrique (soit ≈ 25).

      J’y étais parvenu en trifouillant avec kompozer le code obtenu par le pluging menu , mais le squelette me signalait évidement des erreurs.
      A priori je pensais mettre les images en ligne (jpeg 25x25) et trouver un moyen de les appeler. Y a-t-il cette possibilité avec le pluggin ?
      Merci !

    • Non, ce n’est pas le rôle du plugin... Il faut que tu vois au niveau des css

    Reply to this message

  • 3

    Bonjour,

    Pensez-vous qu’il soit faisable d’afficher les menus (au moins du 1er niveau) avec une police non standard (comme on peut le faire avec Choix Police Typo) ? Et si oui... comment verriez-vous la chose ;-)

    • Je ne connais pas ce plugin, mais il m’a l’air de créer des images typo. Dans le principe ca peut fonctionner car le plugin superfish ne s’occupe pas de créer le contenu mais uniquement de son affichage. A toi de créer l’ensemble ul/li avec les images typo. Sinon tu peux essayer avec la directive @font-face en t’inspirant de ceci http://typographisme.net/post/Bonnes-pratiques-pour-les-d%C3%A9clarations-@font-face

    • Dommage (a priori) de ne pas pouvoir utiliser le filtre image_typo, puissant et tout navigateur.

      Effectivement, on peut passer par le CSS. Merci pour le lien !
      Pour info, après plusieurs essais (pour garder la compatibilité avec IE, FF, Opera et Safari), il semblerait que le bon ordre d’écriture soit : .eot, .eot?, otf, .ttf, .woff

    • Hello... Je n’ai pas dis que ce n’était pas possible. Au contraire. Vu que le plugin de s’occupe que de l’affichage, dans le contenu tu mets ce que tu veux en respectant la structure ul/li. Qu’il y ai du texte ou des images dans les li, c’est pareil.

    Reply to this message

  • 5

    problème d’installation :
    sur une 2.1.11, j’obtiens cela après installation dans la gestion des plugins
    Attention : un problème technique (serveur SQL) empêche l'accès à cette partie du site. Merci de votre compréhension.

    et sur 2.1.12 : pas de message, mais fait planter la partie gestion des plugins

    • Hello

      Je viens de tester sur une 2.1.11 et une 12.1.12, je ne rencontre pas de problème d’installation. Peut être as tu un soucis de nombre de connexions simultanées (http://forum.spip.org/fr_234934.html) ?

    • Je ne pense pas pour sql, C’est sur mon serveur de test.
      Je viens de faire un test sur un autre serveur dédié (ovh) sur 2.1.12 avec uniquement
      CFG 1.16.0
      Menu jQuery Superfish 0.2.0 -
      Saisies pour formulaires 1.18.0 -
      YAML 1.5.0 -

      Et j’ai une erreur sql à l’installation. Le plugin semble s’installer mais dans la config, il n’y a pas de paramètre...du moins pour le configurer.

    • Est-ce que tu vois quelque chose d’anormal dans les log ?

    • ok, nécessite spip bonux pour la boucle (POUR).

    • Arf, c’est pour Saisies... Merci, je rajoute le necessite

    Reply to this message

  • 3

    Bonjour,

    Merci pour ce plugin. J’avais moi-même commencé à le codé mais votre travail est bien supérieur au mien !

    Il y a une erreur à la validation W3C.
    Dans le fichier superfish_pipelines.php, lignes 9 et 10.
    Il manque un espace après le “de : ’”media=“all” />’ devient ’“media=”all" />’
    J’ai corrigé chez moi.

    • Hello

      Je ne vois pas d’espace qui manque a ce niveau la... Bizarre

      As tu un lien où l’erreur est présente ?

    • Voici les lignes avant corrections :

      function superfish_insert_head_css($flux){
      $flux .= '<!-- Debut Menu SUPERFISH -->
      <link rel="stylesheet" type="text/css" href="'.find_in_path('css/superfish.css').'"media="all" />'."\n";
      $flux .= '<link rel="stylesheet" type="text/css" href="'.find_in_path('css/superfish-navbar.css').'"media="all" />
      <!-- Fin Menu SUPERFISH -->'."\n";

      Le m est collé au ", il faut donc rajouter un espace

    • Groumf....
      L’erreur vient de la réactivation de mon plugin superfish et non du votre.
      Une fois le votre activé, il n’y a plus d’erreur.
      Désolé pour le bruit.

    Reply to this message

  • 3

    bonsoir
    Génial ce plug, propre et efficace, merci.
    Cependant, je souhaiterai savoir si il est possible d avoir lors d un menu horizontal, le menu dépliant également horizontal. Je tourne et retourne sans succès!! :(

    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