SPIP - Contrib

SPIP - Contrib

[ar] [en] [es] [fr] [it]

73 visiteurs en ce moment

fontsizeup fontsizedown
Accueil du site > Contribs > Navigation > Menus dépliants > Menu "dépliant" comme dans l’administration de spip
[35 commentaires]

Menu "dépliant" comme dans l’administration de spip

jeudi 3 août 2006, par FranckA

0 vote

Un menu dépliant obtenu en adaptant le layer.js utilisé pour l’admin de spip.

C’est un article de plus proposant un menu "dépliant". L’intérêt ici est sa facilité de mise en oeuvre. Tous les fichiers seront à déposer dans le dossier squelette, les images dans le dossier images, le javascript dans un dossier js créé pour l’occasion s’il n’existe pas et évidemment le menu correspondant dans le dossier squelettte.

- Adaptation du layer.js : il s’agit juste de remplacer le nom des images choisies pour les flèches. Personnellement, j’ai choisi : deplierhaut.png, deplierbas.png, deplierhaut_rtl.png. Le fichier est renommé en deplier.js et placé dans : #DOSSIER_SQUELETTE/js (#DOSSIER_SQUELETTE correspondant au dossier où vous avez déposé votre squelette pour spip 1.8.3)

- Appel du script entre les balises <head> et </head> :

- Ecriture des boucles spip :

On obtient alors un menu qui se déplie à la façon de l’admin de spip. Evidemment, on peut améliorer les choses mais le but était que cela soit simple à mettre en oeuvre.

Le code spip se trouve dans le fichier menu et vous pouvez adapter les flèches deplierbas.png et deplierhaut.png à votre guise (les images données sont blanches et sur fond transparent, cela passe bien sous Firefox mais moins bien sous IE).

Retour en haut de la page

35 Messages de forum

Voir toute la discussion

Pages 1 | 2 | 3 | 4

  • Répondre à ce message

    15 septembre 2008 11:21 , par Draikhin
    Menu "dépliant" comme dans l’administration de spip

    Bravo pour ce menu !

    En l’état quand on est sur une rubrique, le menu n’est pas déplié, il faut cliquer sur le menu pour déplier. Comment pourrait-on faire pour que le menu soit automatiquement déplié sur la rubrique où on se trouve ?

    Merci pour tout.

    Bonne journée, Olivier

  • Répondre à ce message

    15 juillet 2008 14:59 , par ploufplouf1
    Menu "dépliant" comme dans l’administration de spip

    Très bien ce petit menu simple à mettre en place et facilement personnalisable.

    Petite question toutefois car pour ce qui est du js j’y connait pas grand chose.

    Est-il possible de refermer les sous-rubriques lorsqu’on clique sur une autre rubrique histoire de ne pas avoir tout déplier tout le temps mais juste la rubrique explorée ?

    Si oui merci de me dire comment je peux faire et que dois je modifier.

  • Répondre à ce message

    20 mars 2007 15:30 , par ratch
    Menu "dépliant" comme dans l’administration de spip

    la facon la plus courte est d’appeler swap_couche à l’ouverture de la page, donc dans la balise <body>. je recupere l’id_rubrique à partir de l’article courant (je fait une petite boucle). Ainsi, seul le "layer" correspondant à la rubrique de l’article sera déplié. Il convient de numéroter les "layer" avec les numéros de rubrique correspondant. je modifie <body> de la sorte et c’est tout :

    <body onload="javascript:swap_couche('<BOUCLE_article_rub(ARTICLES){id_article}>
    #ID_RUBRIQUE</BOUCLE_article_rub>','','#DOSSIER_SQUELETTE/',0)">

    Et merci à l’auteur des menus dépliants !

  • Répondre à ce message

    2 novembre 2006 15:13 , par popojcb
    Menu "dépliant" comme dans l’administration de spip

    J’ai trouvé ! C’est spip et la gestion de la BD en multilingues !

    Je m’explique :

    J’ai commencé un site en plusieurs langues. Celui-ci était en français par défault. J’ai commencé à remplir les articles...en plusieurs langues. (utilisation de d’un répertoire et de la balise multi et de la gestion de la traduction des langues sur les articles site)

    Puis il a fallut changer la langue par défault. Et c’est la que cela coince.... au nivau de la bd.

    Les articles par défault en français et rédigés en français sont passés automatiquement en anglais (nouvelles langue par défault) mais étaient toujours "physiquement" rédigés en français. J’ai donc benoitement changer manuellement les langues des articles par le menu langues et traductions de chaque articles.

    Le site lui fonctionnai trés bien, les traductions s’affichaient parfaitement , mais le balise#expose elle ne fonctionnai plus correctement avec ces articles et rubriques rédigées avant le changement de langue et ce malgré le travail de redéfinition des langue que j’avais effectué sur chaque article ! Mais je n’ai compris cela qu’à l’instant en confrontant les dates des articles et rubriques fonctionnantes avec celles défficientes

    Voilà, j’ai peut-être redécouvert l’eau chaude, mais je ne savais pas cela. (vais m’faire une tisanne pour fêter ça m’suis tellement aggassé sur ce truc...)

    Voilà !

    Pardon pour ces diférents posts mais je perdais mon latin, le changement de langue correspondant en date avec la mise en place du script, j’ai bêtement pensé qu’il pouvai y avoir une correlation.

    MILLE MERCI encore pour vos réponses et contribution.

    Et vive spip mais gaffe à #expose si vous changez de langue en cour de construction !

  • Répondre à ce message

    2 novembre 2006 13:36 , par FranckA
    Menu "dépliant" comme dans l’administration de spip

    Pour répondre, il me faudrait un exemple (un lien ou une copie d’écran) car j’ai du mal à bien localiser le problème. :-\

  • Répondre à ce message

    2 novembre 2006 11:18 , par popojcb
    Menu "dépliant" comme dans l’administration de spip

    Ok, je l’ai remis partout (dans chaque boucles) et il ne faut plus cliquer qu’une seul fois !

    Merci de votre réponse ! ;)

    Auriez-vous une suggestion concernant la non reconnaissance de #expose pour les trois première occurences appelées par les boucles rub-> articlec ?

  • Répondre à ce message

    2 novembre 2006 10:50 , par popojcb
    Menu "dépliant" comme dans l’administration de spip

    Bien en fait je l’ai supprimer juste avant l’envois et apparamment cela fonctionne de la même façon.

  • Répondre à ce message

    2 novembre 2006 09:29 , par FranckA
    Menu "dépliant" comme dans l’administration de spip

    Bonjour Je ne vois pas où est passé le code suivant :

    <script language="javascript" type="text/javascript">
    <!--
    vis['#ID_RUBRIQUE'] = 'hide';
    //-->
    </script>

  • Répondre à ce message

    1er novembre 2006 21:53 , par popojcb
    Menu "dépliant" comme dans l’administration de spip

    C’est normal lorsque l’on apporte quelque bienfaits à la communauté. !

    Toute fois je reprends la plume pour lever un petit soucis que je rencontre avec le script, peut être pourrez vous m’aider ?

    1 ) Il fonctionne super, mais il me faut cliquer deux fois pour accéder au lien (un clique de valide et un deuxième qui actionne le swap. N’utilisant pas l’image (flèche du script) je me dit que cela vient de là. Esct-ce exacte et si, zuriez-vous une soluce pour modifier cela (à mon niveau le javascrit et lisible pour moi mais de la à le modifier :^)

    2 ) Un bug arrive losque j’imbrique le code pour le menu. je pige pas voici le code : (en fait root>sourub>sousourub>aricle est ok mais root>sousrub>article ne reconnais pas exposé avant le quatrième bouton ?)/ Voici le code : si vous avez une suggestion je suis preneur, avis aux âmes charitables !

    <script language="javascript" type="text/javascript" src="#CHEMIN{js/deplier.js}"></script>
    <div id="navigation">

    <BOUCLE_rubbase(RUBRIQUES) {id_rubrique=1} ><!---On commence par appeler la rubrique qui contient les rubriques qui définiront la navigation que nous souhaitons-->




            <B_rub>
            <BOUCLE_rubr(RUBRIQUES) {id_parent}></BOUCLE_rubr>
           
           
            <ul class="menu">
            <BOUCLE_rub(RUBRIQUES) {id_parent} {par num titre}><!--puis les sous rubrique-->
                    <li class="item#EXPOSER"><a href="javascript:swap_couche('#ID_RUBRIQUE','','#CHEMIN{images/}',0)" class="item#EXPOSER" [title="(#DESCRIPTIF|textebrut|entites_html)"]>
                    <span class="flotement">[(#TITRE|supprimer_numero|couper{35})]</span>#LOGO_RUBRIQUE</a>
                   
                   
                    </li>
                   
                    <B_articlec>                 
                             <BOUCLE_articleb(ARTICLES){id_rubrique}>
                            </BOUCLE_articleb>
                                   
                            <div id='Layer#ID_RUBRIQUE'  class="[(#EXPOSE{affiche,cache})]">
                             <ul class="soussousmenu">
                             <BOUCLE_articlec(ARTICLES){id_rubrique}{par num titre}{lang}{doublons articleb} >
                             <li>
                                    <a href="#URL_ARTICLE" class="soussous#EXPOSER" title="[(#DESCRIPTIF|textebrut|entites_html)]"> [(#TITRE|supprimer_numero)]</a>
                                    </li>
                            </BOUCLE_articlec>      
                            </ul>
                            </div>
                    </B_articlec>
                           
                   
                   
                    <B_sous_rubriques>
                   
                    <BOUCLE_sous_rubriqueb(RUBRIQUES) {id_parent}></BOUCLE_sous_rubriqueb>
                   
                   
                    <div id='Layer#ID_RUBRIQUE'  class="[(#EXPOSE{affiche,cache})]">
                    <ul class="sousmenu">
                    <BOUCLE_sous_rubriques(RUBRIQUES) {id_parent}{doublons sous_rubriqueb}><!---là c'est au tours de la sous-sousrubriques-->
                    <li class="sousnav#EXPOSER">
                            <a href="javascript:swap_couche('#ID_RUBRIQUE','','#CHEMIN{images/}',0)" class="sousnav#EXPOSER" [title="(#DESCRIPTIF|textebrut|entites_html)"]>
                            [(#TITRE|supprimer_numero)]
                            </a>
                            <script language="javascript" type="text/javascript">
                           
                            </script>
                    </li>
                   
                             <B_article>
                             <BOUCLE_articler(ARTICLES) {id_rubrique}>
                                    </BOUCLE_articler>
                                   
                             <div id='Layer#ID_RUBRIQUE'  class="[(#EXPOSE{affiche,cache})]">
                                     <ul class="soussousmenu">
                                    <BOUCLE_article(ARTICLES) {id_rubrique} {par num titre}{lang}{doublons articler}>
                                    <li>
                                    <a href="#URL_ARTICLE" class="soussous#EXPOSER" title="[(#DESCRIPTIF|textebrut|entites_html)]"> [(#TITRE|supprimer_numero)]</a>
                                    </li>
                                    </BOUCLE_article>
                                    </ul>
                             </div>
                             </B_article>
                   
                   
                    </BOUCLE_sous_rubriques>
                   
                   
                    </ul> <!--fin de sousmenu-->
                    </div>
                    </B_sous_rubriques>
                   
             </BOUCLE_rub>

    </ul><!--fin de menu-->

    </B_rub>
    </BOUCLE_rubbase>

    </div>

  • Répondre à ce message

    29 octobre 2006 18:49 , par FranckA
    Menu "dépliant" comme dans l’administration de spip

    Très sympa ce petit supplément et merci pour les encouragements, cela fait toujours plaisir ! :-)

Pages 1 | 2 | 3 | 4

Répondre à cet article

Retour en haut de la page

Ça discute par ici

Ça Spip par là

SPIP Blog

SPIP Party

SPIP Forums

SPIP-Zone

SPIP Svn

SPIP | Squelette | | Plan du site | Suivre la vie du site RSS 2.0