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 SPIP3.
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
<div class="spip_accordeon">
<h3>Titre du premier accordéon</h3>
Voici le contenu du premier accordéon.
<h3>Titre du deuxième accordéon</h3>
Voilà le contenu du deuxième accordéon. etc
</div>
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.
https://git.spip.net/spip-contrib-extensions/accordion/src/branch/master/wheels/accordeon.yaml
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
function accordion_jqueryui_plugins($plugins){
$plugins[] = "jquery.ui.accordion";
return $plugins;
}
En SPIP4
SPIP4 ne chargeant plus jquery_ui, il faut télécharger le plugin jquery_ui https://git.spip.net/spip/jquery_ui.git et l’installer si celui-ci ne s’installe pas automatiquement.
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.
Aucune discussion
Ajouter un commentaire
Avant de faire part d’un problème sur un plugin X, merci de lire ce qui suit :
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.
Suivre les commentaires : |