SPIP-Contrib

SPIP-Contrib

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

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

Accueil > Affichage multimédia > Galeries et diaporamas > Spip jQuery Cycle > Cycle2

Cycle2

7 août 2014 – par chankalan – 103 commentaires

14 votes

La seconde version de la librairie Javascript « jQuery Cycle », qui permet de produire des diaporamas, se nomme « Cycle2 » : http://jquery.malsup.com/cycle2/.

Voici cette nouvelle librairie mise en plugin pour SPIP.

Si vous utilisez déjà « jQuery Cycle », vous pouvez le garder tel qu’il est. Cette version est à considérer comme un nouveau diaporama.

Bien que les modèles et certains paramètres aient été conservés pour tenter de préserver une certaine compatibilité, le rendu n’est pas assuré entre la version 2 et cette version 3.

Le principal avantage de cette nouvelle version : l’affichage est adapté aux différentes largeurs d’écrans (responsive design) selon l’interface du site.

Il est nécessaire d’utiliser un squelette qui respecte la norme HTML5.

Pour une utilisation courante, le diaporama s’insère dans les textes par le modèle <articleN|cycle> où « N » est le numéro de l’article dont on veut afficher les images.

Pour la compatibilité avec le plugin « jQuery Cycle » le modèle <sjcycleN> est tout à fait fonctionnel. La différence est que ce dernier n’affiche les images de l’article « N » que lorsqu’il est inclus dans l’article « N » lui-même.

Paramétrage général

Si un paramètre de la librairie a été implémenté, il l’a été fidèlement, pour rester dans une logique simple par rapport à Cycle2. On retrouve toute la documentation de référence ici : http://jquery.malsup.com/cycle2/api/.

Par exemple : data-cycle-random=true est un paramétrage du plugin d’origine qui fait tourner les images dans un ordre aléatoire. Ce paramètre est transposé dans le plugin SPIP, et on lui donne une valeur à l’insertion du modèle comme ceci : <articleN|cycle|random=true>.

Si le paramétrage général du plugin prévoit déjà l’ordre aléatoire, toutes les insertions de <articleN|cycle> joueront le diaporama dans un ordre aléatoire. Mais dans ce cas, il est aussi possible d’insérer un diaporama sans ce paramètre avec l’écriture <articleN|cycle|random=false>-

La page de configuration (dans l’administration de SPIP, une fois le plugin installé comme les autres, se rendre dans « Squelettes > Cycle2 », accès limité aux webmestres du site) offre un certains nombre d’options qui s’appliqueront à toutes les inclusions du modèle <articleN|cycle> :

  • Largeur maximum (par défaut 640) : toutes les images seront retaillées en largeur à cette valeur, en pixels. Les diaporamas étant en taille proportionnelle, ils s’adapteront à la largeur définie par l’interface du site, mais dans la limite définie ici.
    • |largeurmax=350
  • Hauteur maximum : en laissant le champ vide, les images seront toujours à la largeur maximum possible. Sinon toutes les images seront retaillées en hauteur à cette valeur, en pixels. Si la largeur de l’image n’est pas suffisante, la couleur de fond configurée sera visible. La valeur de couleur de fond « transparent » rendra par contre un fond blanc.
    • |hauteurmax=240
  • Hauteur automatique : Choisissez ici la façon dont est déterminée la hauteur du diaporama. Par défaut (le champ vide), la hauteur de la première image sert de valeur, « calc » utilisera la hauteur de la plus haute image, et « container » ajustera la hauteur du diaporama à la hauteur de l’image courante. Il est possible de forcer le ratio hauteur/largeur avec une double valeur, par exemple « 600:400 ». La valeur « false » empêchera le script de gérer la hauteur automatiquement.
    • |autoheight=600:400 ou |autoheight=container
  • Temps d’affichage pour chaque image (en millisecondes) : choisir « 0 » pour faire un diaporama manuel (cf les boutons « précédent » et « suivant » pour activer le défilement manuel).
    • |timeout=4000
  • Temps de transition entre chaque image (en millisecondes)
    • |speed=1000
  • Temps d’attente : Temps d’attente avant le départ du diaporama (en millisecondes).
    • |delay=6000
  • Effet de transition : voir les exemples en ligne - fade - fadeout - scrollHorz - scrollVert - flipHorz - flipVert - shuffle - tileSlide - tileBlind - carousel - none
    • exemple : |fx=scrollHorz
    • pour |fx=tileSlide et |fx=tileBlind, option supplémentaire pour jouer l’animation verticalement
    • pour |fx=carousel, options supplémentaires pour :
      • choisir le nombre de diapositives affichées simultanément (carousel-visible) : |carouselvisible=3
      • le décalage (en pixels) de la première diapositive (carousel-offset) : |carouseloffset=30
      • définir la dimension des vignettes. Largeur (carousel horizontal) ou hauteur (carousel vertical) d’une diapositive (carousel-slide-dimension) : |carouselslidedimension=130
      • jouer le déplacement verticalement (carousel-vertical) : |carouselvertical=true ou |carouselvertical=false
      • adapter le carousel à la mise en page, seulement si horizontal (carousel-fluid) : |carouselfluid=true ou |carouselfluid=false
  • À l’envers : Joue le diaporama à rebours :
    • |reverse=true ou |reverse=false
  • Synchronisation des animations, l’arrivée d’une image est simultanée avec le départ de la précédente :
    • |sync=true ou |sync=false
  • Pause au survol : |pauseonhover=true ou |pauseonhover=false
  • Message lors de la pause au survol, laisser vide pour ne rien afficher :
    • |pauseonhovercontent=en pause
  • Ordre aléatoire :
    • |random=true ou |random=false
  • Bouton « suivant » : cibler un bloc html par sa classe ou son identifiant. Par défaut « .cycle-next » place une flèche à droite au survol de l’image. [1] :
    • |next=.cycle-next
  • Bouton « précédent » : cibler un bloc html par sa classe ou son identifiant. Par défaut « .cycle-prev » place une flèche à gauche au survol de l’image. [1] :
    • |prev=.cycle-prev
  • En boucle, à propos des boutons « précédent » et « suivant » : à la fin du diaporama, ne pas revenir au début, ou bien au début, ne pas suivre à la fin (n’empêche pas le diaporama automatique de tourner en continu) :
    • |allowwrap=true ou |allowwrap=false
  • Départ arrêté :
    • |paused=true ou |paused=false
  • Pagination : cibler un bloc html qui contiendra la pagination en nommant sa classe ou son identifiant css. Par défaut « .cycle-pager » place les boutons par-dessus l’image. [1] :
    • |pager=.cycle-pager
  • Afficher une légende pour chaque image [1]. Par défaut « .cycle-caption » :
    • |caption=.cycle-caption. Il est possible de choisir le contenu de cette légende (cf la documentation) :
    • Afficher le décompte/le total : par défaut
    • Afficher le titre du document : |captiontemplate="{{alt}}"
    • Sur-mesure : |captiontemplate="images {{slideNum}} sur {{slideCount}}"
    • Sur-mesure : |captiontemplate=image {{slideNum}} : {{cycleTitle}} {{cycleDesc}}
  • Afficher une seconde légende en surimpression [1], un calque noir/transparent sur le bas de l’image pour afficher une légende avec Titre et Description de l’image :
    • |overlay=.cycle-overlay
  • Format de la légende en surimpression, par défaut le titre et la description de l’image, vous pouvez personnaliser le contenu suivant les exemples :
    • |overlaytemplate="<span class=left>&nbsp;<br>{{slideNum}} / {{slideCount}}</span>{{date}} - {{title}}<br>{{desc}}"
  • Choisir une couleur de fond, une valeur de couleur hexadécimale avec le « # », ex « #C5E41C ». La valeur « transparent » rétabli la transparence. :
    • |backgroundcolor=#b5b5b5
    • en installant le plugin Palette vous pourrez piquer la couleur sur une palette.

Paramètres tooltip et mediabox

  • Info au survol avec Tooltip : peut être surchargé lors de l’inclusion avec |tooltip=oui ou |tooltip=non
  • Afficher les caractéristiques techniques de l’image : peut être surchargé lors de l’inclusion avec |tooltip_carac=oui ou |tooltip_carac=non
  • Mediabox : ouvre l’image d’origine suivant vos paramétrages de la mediabox (dans l’administration : Squelettes > Boîte multimédia. Peut être surchargé lors de l’inclusion avec |mediabox=oui ou |mediabox=non

Inclure le modèle <articleN|cycle>

On l’a déjà vu plus haut, pour une utilisation courante, le diaporama s’insère dans les textes par le modèle <articleN|cycle> où « N » est le numéro de l’article dont on veut afficher les images. On peut insérer ce modèle dans n’importe quel autre article que l’article N lui-même.

Chaque paramètre de la configuration générale est actif et en même temps corrigeable lors de l’inclusion. (cf. plus haut pour chacun d’eux)
En dehors de ces paramètres généraux, voici quelques paramètres optionnels pour ce modèle :

Alignement dans le texte

Comme un autre document, on peut aligner le diaporama : |left, |right ou |center comme ceci <articleN|cycle|left>
S’il n’est pas précisé, l’alignement est « centré ». L’effet rendu dépendra de la valeur saisie pour le paramètre « Largeur maximum » et de l’interface du site. L’alignement flottant est intéressant si le diaporama est significativement moins large que le texte lui-même.


Choisir les images
<articleN|cycle|docs=1,5> fait tourner les images 1 et 5 de l’article « N » en diaporama, dans l’ordre du titre des images.
« N » n’est pas obligatoire. On peut maintenant écrire <article|cycle|docs=1,2,3,6,9> pour demander les images 1,2,3,6,9 même si elles sont liées à des articles différents, voir des rubriques ou d’autres objets.

Attention : dans le cas d’une utilisation dans un squelette, l’écriture diffère :
[(#MODELE{article_cycle,id_article=N,docs=21|22|24})]
ou
[(#MODELE{article_cycle,docs=21|22|24})]

Plusieurs diaporamas par page
On peut inclure plusieurs diaporamas par page de la même façon :
<articleX|cycle>
<articleY|cycle>
<articleZ|cycle>

Dans ce cas, si les boutons « suivant/précédent » sont activés dans la configuration générale, ils actionneront tous les diaporamas en même temps. Pour corriger cet effet, il est préférable de personnaliser chaque diaporama comme ceci :

<articleN|cycle|prev=.pre1|next=.suiv1>
<a href="#" class="pre1">précédent</a>
<a href="#" class="suiv1">suivant</a>
<articleN|cycle|prev=.pre2|next=.suiv2>
<a href="#" class="pre2">précédent</a>
<a href="#" class="suiv2">suivant</a>
<articleN|cycle|prev=.pre3|next=.suiv3>
<a href="#" class="pre3">précédent</a>
<a href="#" class="suiv3">suivant</a>

Encore faut-il ensuite styler ces balises HTML aux couleurs de votre site...

Paramètre « lien_parent »
|lien_parent=oui
Crée un lien sur chaque image vers l’objet auquel elle est liée, que ce soit les images d’un seul article, ou bien sélectionnées individuellement |docs=1,2,3,6,9. Si une image est liée à plusieurs objets, ce sera le dernier en date qui sera utilisé.

Paramètres « lien_article » et « forcer_lien_reference »

<articleN|cycle|lien_article=XXX|forcer_lien_reference=oui>


Permet de poser un lien sur le diaporama vers un article, celui qui contient les images ou un autre. Dans le cas d’un site multilingue, fournir l’id de l’article de référence, le modèle se charge de trouver l’id de l’article correspondant à la langue du visiteur. Cette option désactive l’ouverture vers une box. Si l’article n’existe pas dans la langue courante on met ou pas un lien vers l’article de référence suivant que le paramètre forcer_lien_reference soit défini ou pas.

Exemple dans le cas d’une insertion dans un squelette sur une page sommaire :
-  [(#MODELE{article_cycle,id_article=16,lien_article=171})] : diaporama sur toutes les images de l’article 16 avec un lien vers l’article 171 (ou sa traduction)
-  

[(#MODELE{article_cycle,id_article=16,lien_article=171|forcer_lien_reference=oui})]

 : c’est pareil sauf que le lien ne se fera pas sur la traduction même si elle existe.


Paramètres « liens_individuels »
<articleN|cycle|liens_individuels=article>
Permet de poser un lien sur chaque image du diaporama vers un article, une rubrique ou un site externe suivant la valeur du paramètre (article, rubrique, externe). Si la valeur vaut article ou rubrique, l’identifiant de l’objet est pris dans le champ descriptif de chaque image. Si la valeur vaut externe, le champ descriptif de chaque image doit contenir un lien http. Cette option désactive l’ouverture vers une box.

Exemple :
-  <article16|cycle|center|liens_individuels=article> : diaporama sur toutes les images de l’article 16 avec sur chaque image un lien vers l’article dont l’identifiant est contenu dans le descriptif de l’image.

Paramètre « limite » :
<articleN|cycle|limite=3>
Sortira les trois premières images de l’article « N » dans le diaporama.

Diaporama des images d’une rubrique

Le modèle rubrique_cycle.html est fait pour ça.
<rubriqueN|cycle> où « N » est l’identifiant de la rubrique concernée.
Pour compatibilité, le modèle sjcycle_rubrique.html est conservé et permet d’inclure <sjcycle6|rubrique>

Diaporama des sites

Le modèle sjcycle_sites.html est conservé et transposé pour cette version du plugin.

Diaporama des albums

Le plugins Albums permet de regrouper des documents.
L’inclusion de <albumN|cycle> affiche un diaporama des images de l’album N.

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

Notes

[1Peut aussi prendre la valeur de la classe ou de l’identifiant (id) de n’importe quelle balise HTML... astuce : <articleN|cycle|next=.suivante><a href="#" class="suivante">avance rapide</a> dans un texte placera le bouton d’avance rapide sous l’image.

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

Retour en haut de la page

Tout afficher

Vos commentaires

  • Le 23 février à 08:44, par mirobolus En réponse à : Cycle2

    Bonjour chankalan,
    Est-il possible de faire évoluer ce plugin pour qu’un diaporama appelle des documents liés à un mot-clé, sans qu’on soit obligé de préciser un numéro d’article ou de rubrique ?
    Merci

    • Le 23 février à 12:08, par chankalan En réponse à : Cycle2

      Bonjour mirobolus,
      il faudrait au moins préciser l’id du mot-clef... je ne sais pas si ça peut être une évolution du plugin. Dans un premier temps il faudrait partir du fichier modeles/album_cycle.html, le renommer en mot_cycle.html et changer la boucle DOCUMENTS pour qu’elle sorte les documents du mot-clef :

      <BOUCLE_docs(DOCUMENTS){id_mot}{extension==jpg|png|gif}>

      Et ensuite appeler <motXX|cycle> dans un texte du site...

      C’est possible de tester ?

    • Le 23 février à 13:52, par mirobolus En réponse à : Cycle2

      Oh oui, je vais tester ça d’ici les prochains jours. Ça me donne une autre idée car j’ai un besoin récurrent : faire défiler des affiches d’événements dans une colonne, et que ce petit mode se trie tout seul (comportement donc à l’identique de la boucle événement).
      Je vais commencer par cette histoire de mot-clé et si je trouve, je partagerai ici.
      Merci !

    Répondre à ce message

  • Le 22 février à 22:50, par François Daniel Giezendanner En réponse à : Cycle2

    Bonjour,

    J’essaie de mettre en place les liens individuels aussi bien pour des articles que pour des rubriques mais sans succès.

    Dans le champ descriptif de chaque image je place une instruction du type
    [->art234] ou [->rub25]

    et le modèle utilisé est :
    <sjcycle234|center|liens_individuels=article>

    j’essaie aussi :

    <sjcycle234|center|liens_individuels=article|forcer_lien_reference=oui>

    et aussi cela :

    <article234|cycle|center|liens_individuels=article>

    Chaque fois j’obtiens une Erreur 404 avec l’URL suivante :
    http://monsite/spip.php?article0
    ou
    http://monsite/spip.php?rubrique0

    Avez vous une idée ?

    Cordialement

    FDG

    • Le 22 février à 23:30, par chankalan En réponse à : Cycle2

      Bonjour,
      en fait il faut que le descriptif de l’article ne contienne que et uniquement que l’identifiant de l’article, soit « 52 » s’il s’agit de l’article 52.
      Idem pour les rubrique...
      (Il ne faut pas rédiger le lien dans le descriptif de l’image...)

    • Le 23 février à 11:11, par François Daniel Giezendanner En réponse à : Cycle2

      Bonjour chankalan,

      Merci pour la grande réactivité et la pertinence.

      Maintenant, selon vos instructions cela fonctionne à la perfection.

      Cordialement

      FDG

      PS : il serait utile que cette information soit indiquée dans l’article.

    • Le 23 février à 11:24, par chankalan En réponse à : Cycle2

      Ça me semble déjà le cas, voir ici
       ;o)

    Répondre à ce message

  • Le 20 février à 23:16, par François Daniel Giezendanner En réponse à : Cycle2

    Bonjour,

    Merci pour et excellent plugin.

    Cependant j’ai utilisé Cycle2 comme bandeau avec avec l’instruction :

    <sjcycle232|center|liens_individuels=article>

    placée dans le champ « Slogan du site ». Ce bandeau-diaporarma fonctionne parfaitement avec les navigateurs :

    • Firefox 51.0.1
    • Safari 5.1.7
    • Internet Explorer 11.0.9600

    Par contre avec les navigateurs :

    • Opéra
    • Maxthon 4.4.8.2000
    • Chrome 56.0.2924.87

    à chaque appel de page le bandeau affiche d’abord toutes les images du diaporama les unes sous les autres puis les efface et ensuite le diaporama fonctionne normalement.

    Avez-vous une idée pour surmonter ce problème ?

    Cordialement FDG

    • Le 20 février à 23:55, par chankalan En réponse à : Cycle2

      Bonsoir,
      oui, j’ai une petite idée : c’est le temps de chargement de la page pendant lequel les images s’affichent, une fois toute la page chargée, le diaporama se met en route.
      Il faut chercher à placer les images en css de manière à ce qu’elles ne soient pas les unes sous les autres, mais les unes sur les autres peut-être avec une position:absolute ; ... à tester...
      Par contre si on navigue sans javascript, on ne verra qu’une seule image...

    Répondre à ce message

  • Le 23 août 2016 à 19:49, par joz En réponse à : Cycle2

    Bonjour,

    Depuis spip 3.1.1 les liens sur les image ne s’ouvrent plus, en tout cas pas avec un simple clique gauche. Si je clique droit et je choisi ouvrir dans un nouvel onglet ça marche, j’arrive bien sur l’article demandé. Mais avec le clique gauche je ne fais qu’avancer vers l’image suivant.
    J’ai ce problème sur deux site.

    Problème uniquement chez moi ou bug ?

    • Le 23 août 2016 à 20:25, par chankalan En réponse à : Cycle2

      salut,
      mais non, je reproduis pas avec <articleN|cycle|lien_article=XXX|forcer_lien_reference=oui> et les ID réels ça marche tout seul. C’est bien avec ces paramètres ?

    • Le 23 août 2016 à 20:47, par joz En réponse à : Cycle2

      c’est dans le squelette comme ceci

      1. [(#MODELE{article_cycle,docs=1,5,lien_parent=oui,pager=.cycle-pager,overlay=.cycle-overlay})]

      J’ai rajouté

      1. forcer_lien_reference=oui

      comme dans votre exemple, mais cela n’arrange rien.

    • Le 23 août 2016 à 21:14, par chankalan En réponse à : Cycle2

      le soucis doit venir de l’écriture, avec des « | » entre les docs ça devrait mieux marcher :
      [(#MODELE{article_cycle,id_article=N,docs=21|22|24,lien_parent=oui})]

    • Le 24 août 2016 à 10:33, par joz En réponse à : Cycle2

      Merci pour le conseil. Je vais essayer le | cet après-midi.

      Là je suis avec l’autre site qui montre le même problème, mais le code dans le squelette est différent :

      1. [(#MODELE{article_cycle,id_article=1961,liens_individuels=article,largeurmax=520,hauteurmax=200})]
    • Le 24 août 2016 à 15:01, par joz En réponse à : Cycle2

      Re-bonjour,
      en faite pour mon premier site : j’utilise déjà des pipes. J’ai posté un code erroné hier ici.
      Dans mes squelettes c’est bien

      1. [(#MODELE{article_cycle,docs=1|5,lien_parent=oui,pager=.cycle-pager,overlay=.cycle-overlay})]

      Donc retour à la case du départ...

    • Le 30 août 2016 à 00:09, par chankalan En réponse à : Cycle2

      Bonjour,
      pour moi ce code fonctionne, je viens de tester : on s’attend à ce que le lien renvoi vers le dernier objet auquel est liée l’image (si jamais elle est liée à plusieurs objets), par contre il ne faut pas inclure ce code dans une boucle article si les images ne sont pas celle de l’article. Sinon on n’a que les images de l’article lui-même et le lien est vers lui-même aussi...

      C’est une piste ?

    • Le 31 août 2016 à 09:32, par joz En réponse à : Cycle2

      Hmm non pas encore trouvé. Je fouille un peu partout.
      Je reçois un erreur concernant jquery dans l’inspecteur du navigateur..
      J’ai désactivé tout les autres plugins mais le problème persiste.
      J’ai installé un nouveau spip tout fraîche et là tout fonctionne. Le problème se trouve de mon coté visiblement..
      Je continue à chercher.
      Merci pour les réponses quand même ! C’est encourageant.

    • Le 7 octobre 2016 à 16:58, par joz En réponse à : Cycle2

      Salut,
      J’étais toujours coincé avec ce problème mais j’ai finalement trouvé !
      Le problème était dans la configuration du plugin ecrire/ ?exec=configurer_sjcycle : j’avais rempli les champs bouton « suivant » et « précédent » par > et <.
      Je viens de vider ces champs et le problème est résolu.
      ouff
       :)

    Répondre à ce message

  • Le 14 juillet 2016 à 11:51, par Pierrot En réponse à : Cycle2

    Bonjour,
    J’ai installé des diaporamas cycle2 dans différents articles. J’ai gardé le squelette d’origine de SPIP 3.1.1 [22913] avec écran de sécurité 1.2.4.
    J’ai systématiquement « .cycle-paused:after display:none ; .texte_infobulle text-align:left ; » en fin de chaque article en page d’accueil. En mettant cette ligne dans les moteurs de recherche, je constate que pas mal de sites on la même chose.
    Faut-il un squelette particulier ? Ne trouvant pas d’où vient ce bug je viens vers vous. Pouvez-vous m’orienter ?
    Merci à toutes et tous.

    • Le 15 juillet 2016 à 00:09, par Pierrot En réponse à : Cycle2

      Je me réponds en partie ... J’ai constaté qu’il faillait un minimum de caractères dans l’article pour que ce phénomène disparaisse (+ de 475 caractères semble une bonne base ...) mais je ne sais pas la cause exacte de ceci ...
      Désolé pour cet encombrement.

    • Le 15 juillet 2016 à 09:02, par chankalan En réponse à : Cycle2

      Bonjour,
      pourtant ce n’est pas normal... j’ai tenté de reproduire et j’y suis en partie arrivé : je propose de mettre à jour vers la version 3.4.14 pour voir si le problème persiste. Merci de refaire le test avec cette nouvelle version pour confirmer... ou non...

    • Le 15 juillet 2016 à 10:27, par Pierrot En réponse à : Cycle2

      Comment se procurer la version 3.4.14, je ne la trouve pas, merci

    • Le 15 juillet 2016 à 10:54, par chankalan En réponse à : Cycle2

      Elle n’est pas encore sur contrib, mais déjà sur plugins : http://plugins.spip.net/sjcycle?lang=fr

    • Le 16 juillet 2016 à 17:58, par Pierrot En réponse à : Cycle2

      Avec la version 3.4.14, au lieu d’avoir l’erreur systématique à tous les articles, elle apparait aléatoirement dans certains ... Bizarre quand même ... En mettant 8 lignes de points (.) en début d’article cela donne une seule ligne de ces mêmes points à l’affichage côté public ! Puis le reste du contenu est correct ...

    • Le 18 juillet 2016 à 22:47, par chankalan En réponse à : Cycle2

      Bonjour,
      désolé je n’arrive plus à reproduire, est-ce que vous avez d’autres plugins activés en même temps ? Est-ce possible aussi de savoir la configuration du plugin, quels paramètres vous utilisez, et si le problème persiste quels que soient les paramètres ?
      Merci de ces précisions !

    • Le 19 juillet 2016 à 15:23, par Pierrot En réponse à : Cycle2

      Effectivement, plus de souci. avec la 3.4.14 ... J’avais oublié de vider le cache ! J’avais également surchargé mon squelette ( ce qui est à éviter) Merci pour cet excellent plugin.

    Répondre à ce message

  • Le 21 juillet 2016 à 10:58, par  ??? En réponse à : Cycle2

    Bonnjour et merci ce plugin,
    Je rencontre un problème quand j’essaie d’afficher le titre des images
    J’ai deux article qui ont une galerie d’image et j’utilise ce modèle pour afficher le diapo dans chaque article concerné

    N1 et N2 sont les numéros d’article

    <articleN1|cycle|captiontemplate={{alt}}|caption=.cycle-caption|next=.cycle-next|prev=.cycle-prev>

    <articleN2|cycle|captiontemplate={{alt}}|caption=.cycle-caption|next=.cycle-next|prev=.cycle-prev>

    Mais sont les titres des images de N2 qui s’affichent partout même dans l’article N1...

    y’a t’il un bug ou j’ai loupé quelques choses ???

    Merci de votre réponse

    • Le 21 juillet 2016 à 12:15, par chankalan En réponse à : Cycle2

      Bonjour,
      c’est normal si les deux diaporamas sont dans la même page, c’est comme pour les boutons précédent/suivant, ils actionnent les deux diaporamas en même temps car ils ont la même classe. Voir plus haut pour le remède... il faudra que le paramètre caption ait une valeur différente pour chacun des diaporamas, et donc faire exister un nouvel élément html, peut-être un peu comme ceci :

      <articleN1|cycle|captiontemplate={{alt}}|caption=.cycle-caption>

      <articleN2|cycle|captiontemplate={{alt}}|caption=.cycle-caption2>
      <div class="cycle-caption2"></div>
    • Le 21 juillet 2016 à 12:34, par  ??? En réponse à : Cycle2

      Merci pour la réponse mais les deux diapo ne se trouvent pas dans la même page, les deux articles sont différents et chaque diapo a son propre article. La preuve chaque article affiche ces images correctement le seul problème c’est au niveau des titres qui se mélanges :)

    • Le 21 juillet 2016 à 12:41, par chankalan En réponse à : Cycle2

      ah, alors je reproduis pas, deux diaporamas dans des pages séparées affichent bien les bons titres, sans problème... je ne vois pas de possibilités...

    Répondre à ce message

  • Le 17 mai 2016 à 18:25, par Théo En réponse à : Cycle2

    Bonjour,

    Super plugin et je souhaitais faire défiler une vidéo en boucle. C’est un fichier .MPEG4

    J’ai essayé avec :

    <embN|center|allowwrap=true>
    et
    <embN|center|allowwrap=false>

    mais dans les deux cas la vidéo ne revient pas au début… :(

    Répondre à ce message

  • Le 17 mai 2016 à 16:45, par AlainF En réponse à : Cycle2

    Bonjour,
    je recherche ce genre de diaporama et je pense qu’il est très bien,
    mais je suis sous Spip 3.0.22 et dans ma page d’accueil, avec le premier code :

    - [(#MODELE{article_cycle,id_article=25})]
    - [(#MODELE{article_cycle,docs=36|37|38|39})]

    rien n’est visible, alors que la deuxième ligne affiche bien les docs !

    Mon article 25 permet de mettre et d’enlever, en document, des photos en fonction des saisons et ce ne sont jamais les mêmes identifiants ... ai-je fais une erreur ?
    Cordialement, Alain

    • Le 17 mai 2016 à 17:14, par chankalan En réponse à : Cycle2

      Bonjour,
      difficile de dire comme ça... l’article est bien publié ? Les docs 36, 37, 38, 39 sont ceux de l’article 25 ? Est-ce qu’il sort quelque chose en mettant dans le texte le diaporama avec <article25|cycle> ?
      ...

    • Le 17 mai 2016 à 17:41, par AlainF En réponse à : Cycle2

      Merci de la réponse rapide.

      Que les docs soient de l’article ou pas, il les affiche bien mais l’appel à l’id ne passe pas, même dans “l’article” :
      <article25|cycle> ne donne rien.
      étant en production, je ne peut mettre de lien.

    Répondre à ce message

  • Le 31 mars 2016 à 19:19, par DjackO En réponse à : Cycle2

    Vraiment très bien ce plugin. Je l’ai surchargé pour n’afficher que le portfolio

    1. {mode=documents}

    et ajouter l’option pour avoir les vignettes à coté dans l’appel du modèle

    1. pager=custom-pager#ID_ARTICLE

    Juste une remarque , pourquoi ne pas avoir mis les javaScript compressés ?

    • Le 31 mars 2016 à 23:11, par chankalan En réponse à : Cycle2

      Et bien ils sont tous compressés par SPIP dès qu’on active l’option de compression, dans « Configuration > Fonctions avancées », ce qu’on ne manque pas de faire dès que le site est en production... ;o)

    Répondre à ce message

  • Le 9 février 2016 à 16:53, par marie En réponse à : Cycle2

    Bonjour à tous,

    Je trouve ce plugin super, cependant je souhaiterais mettre des liens sur chaque image pour un article différent. (j’utilise le diaporama en page d’accueil pour présenter mon site)

    J’ai utilisé <articleN|cycle|center|liens_individuels=valeur> (j’ai mis rubrique pour valeur) mais cela ne fonctionne pas.

    J’aimerais savoir où dois-je mettre le numéro de la rubrique pour chaque image ? (descriptif de l’image ? c’est quoi et j’écris quoi exactement ?)

    Veuillez excuser mon ignorance, je débute sur SPIP.

    J’espère que vous avez compris ma requête.

    Merci d’avance

    Marie

    • Le 11 février 2016 à 23:00, par esteb En réponse à : Cycle2

      Bonjour,
      c’est une astuce propre au plugin cycle : mettre le numéro identifiant d’un article ou d’une rubrique dans le descriptif de l’image, et si on met la valeur « rubrique » le lien se fera sur la rubrique ayant cet identifiant, si on met la valeur article, le lien se fera sur l’article ayant cet identifiant...
      Le descriptif de l’image se renseigne en faisant « modifier » lorsqu’on survole un document joint à un article, depuis l’espace privé.
      Il faut donc vérifier si le système fonctionne efficacement... http://zone.spip.org/trac/spip-zone/browser/_plugins_/sjcycle/trunk/modeles/article_cycle.html#L156 le laisse supposer...

    Répondre à ce message

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

  • Newsletters

    16 janvier 2013 – 405 commentaires

    Ce plugin permet de composer des Info-lettres. Par info-lettre, on désigne ici le contenu éditorial qui va être composé et envoyé par courriel à une liste d’inscrits. Le plugin permet de composer une info-lettre à partir d’un modèle pré-composé, (...)

  • GIS 4

    11 août 2012 – 1335 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 (...)

  • Mailshot

    16 janvier 2013 – 252 commentaires

    Ce plugin prend en charge l’envoi en nombre d’info-lettres par email. Mailshot permet l’envoi en nombre d’emails au moyen d’un SMTP (ou d’un service externe) dédié à cet effet. Il permet de limiter la cadence d’envoi. Enfin, ce plugin implémente la (...)

  • Une loupe pour vos vignettes

    9 décembre 2005 – commentaires

    Voici un petit exemple de comment utiliser un javascript pour ajouter une loupe sur vos vignettes de documents.

  • Plugin Download Dump

    26 décembre 2007 – 26 commentaires

    Plugin qui permet de télécharger la sauvegarde SPIP de la base de donnée, depuis l’espace privé sans utiliser de client ftp.

Ça spipe par là