
Tous les billets sont listés ici et classés par titres et mois dans la boîte Archives.
Voici un exemple de diaporama simple, facilement intégrable dans GuppY, que ce soit dans un billet, comme ici ou dans un article - démonstration ici ; notez la possibilité de désactiver les boîtes latérales pour profiter d'un affichage élargi le cas échéant.
Préparation des images
Réunissez une série d'images, ayant la même extension (*.gif, *.jpg, *.png... ) et, de préférence, des dimensions identiques. (Notez toutefois que le diaporama fonctionnera même si vos images sont de tailles variées). Nommez les images avec un même radical suivi d'un chiffre incrémenté de 1 à partir de 1, comme ceci : test1.jpg, test2.jpg, test3.jpg, etc. Enfin envoyez-les par FTP dans le dossier img/ de GuppY.Le code à insérer
Non seulement le code à insérer est court, mais en plus, il est propre et valide ! Copiez-collez le code suivant à l'endroit où vous voulez voir le diaporama :<script type="text/javascript">idimg=1;total=3;function diapo(imgsuiv){idimg=idimg + imgsuiv;if(idimg > total){idimg = 1;} if(idimg == 0){idimg = total;};document.photo.src="img/test" + idimg + ".jpg";}</script>
<div align="center"><form name="form5" method="post" action="_self" id="form5"><img src="img/test1.jpg" id="photo" name="photo" alt="Photo" style="padding: 10px; border: 1px outset; margin: 10px;" />
« <a href="javascript:diapo(-1)" title="Précédent">Précédent</a> | <a href="javascript:diapo(1)" title="Suivant">Suivant</a> »</form></div>
Attention ! Vous ne pourrez insérer ce code dans GuppY qu'avec le mini-éditeur natif (le textarea en mode source), car les autres éditeurs ne le digéreront pas. J'ai surligné les valeurs à personnaliser :
- 3 : indiquez le nombre total de photos composant le diaporama
- test : indiquez le nom-radical de vos images
- jpg : indiquez l'extension de vos images
- test1.jpg : indiquez le nom de la première image du diaporama
- padding: 10px; border: 1px outset; margin: 10px : modifiez le style des cadres des images à votre guise