SPIP-Contrib

SPIP-Contrib

عربي | Deutsch | English | Español | français | italiano | Nederlands

286 Plugins, 197 contribs sur SPIP-Zone, 300 visiteurs en ce moment

Accueil > Rédaction > Affichage dans texte > Accordion JQuery > Accordion JQuery

Accordion JQuery

22 février 2016 – par touti

4 votes

Un plugin qui permet d’activer la librairie Jquery accordion https://jqueryui.com/accordion/ et de l’utiliser directement dans votre contenu rédactionnel ou même ailleurs comme dans un menu.

Obtenez des paragraphes repliables en accordéon avec le raccourci <accordeon> et les {{{intertitres}}} SPIP.

1. Prérequis et activation du plugin

-  Ce plugin fonctionne à partir d’un version de SPIP 3.1 pour raisons de compatibilité de version JQuery préchargée.
-  Activez ce plugin comme tous les plugins SPIP dans l’interface privé.
-  Il n’y a aucune dépendance, la librairie JQuery et JQueryUI étant préinstallées dans SPIP.

2. Rédigez votre texte

Dans le texte d’un article en rédaction, encadrer les intertitres et leurs paragraphes de la balise <accordeon> comme ceci

<accordeon>
{{{Titre du premier accordéon}}}
Voici le contenu du premier accordéon.
{{{Titre du deuxième accordéon}}}
Voilà le contenu du deuxième accordéon.
{{{Titre du troisième accordéon}}}
<div>
Et le contenu du troisième accordéon avec des paragraphes et/ou des images.
</div>
</accordeon>

Le rendu de l’accordeon

En dehors d’un contenu SPIP, dans une FAQ par exemple
Respecter l’écriture suivante pour ouvrir les blocs qui suivent chaque titre h3 cliquable

Comprendre le plugin

Merci à Arno* qui m’a mis sur la voie du Yaml très simple de TextWheel pour traiter le raccourci <accordeon> qui génére un
<div class="spip_accordeon"> pris en compte par le javascript.
http://zone.spip.org/trac/spip-zone/browser/_plugins_/accordion/wheels/accordeon.yaml?rev=95047

Le plugin utilise également le pipeline de chargement des effets UI de JQuery « jqueryui_plugins » très simple d’usage une fois déclaré dans le paquet.xml

Pour aller plus loin

Les options de la librairie JQuery UI Accordion sont sur https://jqueryui.com/accordion/

On peut utiliser accordion JQuery où l’on veut, dans son propre dossier de squelettes, il suffit de dupliquer javascript/spip_accordion.js et de réécrire les options du fichier js.

Todo

Modifier le yaml pour qu’il n’y ait plus à ajouter à la main un div juste après un intertitre si l’on souhaite paragrapher ou insérer des images dans les soufflets de l’accordéon.

Voir en ligne : http://plugins.spip.net/accordion

Dernière modification de cette page le 23 février 2016

Retour en haut de la page

Répondre à cet article

Qui êtes-vous ?

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 Les choses à faire avant de poser une question (Prolégomènes aux rapports de bugs. )
Ajouter un document

Retour en haut de la page

Ça discute par ici

  • Mode portail Communiquant pour SoyezCréateurs

    29 septembre 2010 – 19 commentaires

    5e mode d’affichage de la page d’accueil, ce mode se distingue des autres par une animation proposant un fondu/enchaîné des logos des articles à la une. Zonage Configuration Zone d’entête Nom du site Slogan si plugin bandeau présent (...)

  • Plugin Logo SVG : pouvoir utiliser des logos SVG

    17 octobre – commentaires

    Le SVG est un format vectoriel donc très léger et redimensionnable sans pertes, mais SPIP ne l’acceptait pas sur les logos. Ce plugin comble ce manque. Comment ça fonctionne ? Vous installez ce plugin, vous l’activez, et c’est tout. Crédits Une (...)

  • Utilisez le framework Foundation dans vos squelettes !

    13 août 2013 – 58 commentaires

    Foundation est un framework CSS et Javascript très complet pour réaliser des sites sur une grille propre et homogène. Mais surtout, il permet de rendre un site responsive très facilement ! Ce plugin ajoute le framework Foundation sur l’espace (...)

  • LinkCheck : vérificateur de liens

    13 février 2015 – 65 commentaires

    Ce plugin permet de chercher et tester l’ensemble des liens présents dans les objets. Vous pourrez donc en quelques clics connaître les liens brisés ou défectueux qui se sont immiscés dans le contenu de votre site SPIP. La vérification s’effectue en (...)

  • GIS 4

    11 août 2012 – 1288 commentaires

    Présentation et nouveautés La version 4 de GIS abandonne la libraire Mapstraction au profit de Leaflet. Cette librairie permet de s’affranchir des librairies propriétaires tout en gardant les mêmes fonctionnalités, elle propose même de nouvelles (...)

Ça spipe par là