Aller au contenu
Support de Zwii
  • 0
schoune

Soucis avec Lightbox

Question

Bonjour à tous,

 

J'ai en effet des soucis avec l'application du lightbox pour un projet. Je travail sur le site du parcours d'artistes que ma compagne organise. Je souhaite donc afficher les flyers des années précédentes. 

 

Pour ce faire, je vais sur la page, j'y place une image (de base), je la sélectionne (comme décrit dans le tuto), je choisis la fonction "liens".

 

Puis je sélectionne toutes les images (pour l'instant 4 ) et clic sur lightbox dans relations...

J'enregistre les modifications de la page, et la surprise rien ne se passe!?!?

 

Ai-je oublié qq chose???

 

Merci

Partager ce message


Lien à poster
Partager sur d’autres sites

Messages recommandés

  • 0

Bonjour @schoune,

Je viens de vérifier dans une 9.2.18 et ça fonctionne... chez moi.

Mais je ne me retrouve pas dans tes explications !

Il faut faire la démarche image par image et pour chaque image il s'agit de la sélectionner, puis cliquer droit et dans le menu qui apparaît cliquer sur Liens et enfin dans la fenêtre Insérer un lien choisir Afficher dans Diaporama d'images (impleLightbox).

Philippe

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0

Bonjour Auras, déjà merci pour ta réponse. Je vais essayer d'être clair….

 

J'aimerais avoir une image sur mon site qui ouvre un ensemble d'image avec la fonction lightbox...

 

Je sais insérer un image, mais quand je veux choisir mes autres images pour avoir le simplelightbox, je ne vois que la dernière choisie, et pas toutes….

 

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0

Voici le truc le plus étrange, cela fonctionne sur une nouvelle page, mais pas sur ma page de garde!?! 

 

@ Augra, @Fred

 

 

Cela ne fonctionne pas quand je suis sur une page parent…. voulez-vous bien essayer?

merci

Modifié par schoune

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0

Je viens d'essayer sur une page enfant, une page parent, et pas de soucis : ça fonctionne.

Tu ne peux pas choisir les images en une seule fois : il faut insérer une image et indiquer que tu la mets dans simplelightbox, puis une autre idem, et ainsi de suite....

Pour ta page de garde as-tu un lien ?

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0

Non pas encore car le site n'est pas actif.

 

J'ai beau essayer je n'y arrive pas! Ma méthode est celle-ci:

 

1- je clic sur le "+" et ajoute une image (je change la taille en 400)

2- je sélectionne l'image avec le bouton de gauche

3- clic droit -> "liens"

4- URL …. images (tu me dis une seule), puis le choix "Afficher dans" simplebox puis ok

4'clic "lien" -> choisir URL …. images (tu me dis une seule), puis le choix "Afficher dans" simplebox puis ok

4'' …. ainsi de suite 

5- Enregistrer

 

 

est-ce bien cela????

 

 

 

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0

Pour chaque image il faut tout refaire depuis le point 1 ! Quand tu répètes le point 4 sans recommencer depuis le début tu te contentes de remplacer l'image par la dernière sélectionnée.

Ce diaporama permet de faire défiler des images présentes dans une page.

Mais si je comprends mieux ce que tu veux ce n'est pas ce que tu recherches : tu veux cliquer sur une image et ouvrir une lightbox qui va faire défiler plusieurs images ? Si oui c'est plutôt ce que j'appellerai une galerie.

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0

Heu…. j'ai pas réussi. mais à l'époque PetterRabit l'avais fait pour moi, et j'ai repis le code que j'ai modifié… Et j'essaye autre chose mais pas avec le même rendu.

 

Et pour répondre, effectivement je voulait faire une espèce de galerie en lightbox.

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0

On a un très beau slider qu'a réalisé @sylvainlelievre, on a également le module galerie refait par @Gilux mais ce que tu souhaites reviens régulièrement sans que l'on ai une solution toute prête : en fait si je comprends bien ta demande c'est le module galerie sans l'affichage vignette ? On clique sur l'image de la galerie et c'est la lightbox qui apparaît directement sans passer par l'étape affichage des vignettes ?

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0

C'est exactement cela... 

Pour l'ajout des modules et autres bidouille, je suis très frileux de modifier le code en profondeur, car, ayant déjà eu l'expérience, je perds toutes mes modifs a chaque mise à jour.

Pour moi, le plus important c'est de garder mon site a jour et de pouvoir profiter pleinement des améliorations qui sont proposées.

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0

Je comprends ta frilosité...

Le besoin étant identifié il s'agirait effectivement de créer un nouveau module à partir du module galerie existant en supprimant l'affichage des vignettes ou alors peut-être mieux, de modifier le module existant en ajoutant une case à cocher pour activer/désactiver l'affichage des vignettes  pour chaque galerie ?

Ce n'est pas moi qui saurai faire ça et il y a peut-être d'autres solutions auxquelles je ne pense pas. Peut-être que @Gilux qui a déjà bien travailler le sujet aura une idée ou saura modifier ce qu'il a fait pour obtenir ce que tu souhaites et améliorer son module ?

 

PS : ou si cette fonction est à généraliser c'est peut-être dans le module intégré à zwii qu'il faut ajouter cette possibilité ?

Modifié par augras
PS

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0

En fait il y a une solution toute "bête" : SimpleLightbox intégré a zwii fait ça très bien !

Il faut simplement ne pas afficher toutes les images, seulement celle que l'on veut pour entrer dans l'album.

Avec ce code

<p style="text-align: center;"><a href="/zwii91dev59/site/file/source/robot.gif" rel="gallery"><img src="/zwii91dev59/site/file/source/robot.gif" alt="Robot" width="180" height="180" /></a></p>
<p><a href="/zwii91dev59/site/file/source/diaporama_accueil/espace.jpg" rel="gallery"></a></p>
<p><a href="/zwii91dev59/site/file/source/diaporama_accueil/espace2.jpg" rel="gallery"></a></p>
<p><a href="/zwii91dev59/site/file/source/diaporama_accueil/polenord2.jpg" rel="gallery"></a></p>

seule l'image robot.gif est affichée et au clic dessus simplelightbox s'ouvre et on peut visualiser les 4 images.

 

Pour faire "simple" on fait comme indiqué plus haut pour préparer la lightbox et on édite le code pour supprimer toutes les balises <img/>, sauf celle de l'image que l'on veut afficher pour entrer dans l'album.

 

Le résultat du code ci-dessus https://augras.eu/zwii91dev59/album-simplelightbox

Modifié par augras
  • J'aime 1

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0

De rien.

Il y a toutefois 2 inconvénients :

- c'est apparemment possible d'avoir plusieurs lightbox sur une même page mais je n'y suis pas arrivé : ça doit pouvoir se résoudre ;

- la description de l'image est prise dans le alt="description" qui se trouve dans la balise <img/>... sauf qu'il n'y en a pas, sauf pour la première image, et donc je n'ai pas trouvé comment faire.

Philippe

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0

En cherchant à me dépatouiller du problème de l'affichage systématique des vignettes avec une autre lightbox j'ai trouvé comment le résoudre : dans la balise img il suffit d'ajouter style="display: none;" et c'est ok... la vignette ne s'affiche pas mais l'image est bien dans la lightbox. Et cerise sur le gâteau on peut ainsi compléter le alt="description" pour afficher une légende sur l'image.

En reprenant l'exemple donné plus haut ça donne :

<p style="text-align: center;">
  <a href="/zwii91dev59/site/file/source/robot.gif" rel="gallery" title="Album"><img src="/zwii91dev59/site/file/source/robot.gif" alt="Robot" /></a>
  <a href="/zwii91dev59/site/file/source/diaporama_accueil/espace.jpg" rel="gallery"><img src="/zwii91dev59/site/file/source/diaporama_accueil/espace.jpg" alt="C'est grand !" style="display: none;" /></a>
  <a href="/zwii91dev59/site/file/source/diaporama_accueil/espace2.jpg" rel="gallery"><img src="/zwii91dev59/site/file/source/diaporama_accueil/espace2.jpg" alt="Une image d'espace" style="display: none;" /></a>
  <a href="/zwii91dev59/site/file/source/diaporama_accueil/polenord2.jpg" rel="gallery"><img src="/zwii91dev59/site/file/source/diaporama_accueil/polenord2.jpg" alt="glagla" style="display: none;" /></a>
</p>

Le résultat du code ci-dessus https://augras.eu/zwii91dev59/album-simplelightbox

 

Ne reste plus que la question des albums multiples sur une même page : pas trouvé avec simplelightbox, mais avec l'autre galerie que je suis en train de tester ça fonctionne et plutôt très simplement... la suite quand je serai au point.

 

Philippe

Modifié par augras
  • J'aime 1

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0

Oui, il est possible d'afficher plusieurs galeries "SimpleLightbox" dans la même page, mais il faut d'abord mettre à jour le script en remplaçant le fichier "core/vendor/simplelightbox/simplelightbox.min.js" par celui joint (version 2.1.2).

 

Ensuite il faut éditer "core/vendor/simplelightbox/int.js" et ajouter autant de classes supplémentaires que vous voulez. Ici pour deux galeries :  

 // Paramètres d'initialisation
    $(document).ready(function() {
            // Ajouter des classes Gallery afin de faire la liaison avec simplelightbox


        $("a[rel='gallery']").addClass(
            "gallery",""
        );
        $('.gallery').simpleLightbox({closeText:"&times;",captionsData:'alt'});

        $("a[rel='gallery2']").addClass(
            "gallery2",""
        );
        $('.gallery2').simpleLightbox({closeText:"&times;",captionsData:'alt'});

    });

Editez le code de votre page et remplacez rel="gallery" par rel="gallery2" pour les images que vous voulez mettre dans le deuxième galerie.

Avec l'astuce d'Augras, c'est parfait : juste deux vignettes sur la page, mais deux galeries.

 

Modifié par McGregor
Erratum
  • Merci 1

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0
Il y a 7 heures, McGregor a dit :

Oui, il est possible d'afficher plusieurs galeries "SimpleLightbox" dans la même page, mais il faut d'abord mettre à jour le script en remplaçant le fichier "core/vendor/simplelightbox/simplelightbox.min.js" par celui joint (version 2.1.2).

 

Ensuite il faut éditer "core/vendor/simplelightbox/int.js" et ajouter autant de classes supplémentaires que vous voulez. Ici pour deux galeries :  ........

Editez le code de votre page et remplacez rel="gallery" par rel="gallery2" pour les images que vous voulez mettre dans le deuxième galerie.

Avec l'astuce d'Augras, c'est parfait : juste deux vignettes sur la page, mais deux galeries.

simple-lightbox.min.js 25 Ko · 0 downloads

C'est à peu près ce que j'avais compris mais là c'est parfaitement clair : merci @McGregor.

Le but est effectivement d'avoir une seule vignette par album.

Mais pour répondre complètement au besoin d'un copain j'ai utilisé une autre lightbox : lightGallery.

Le post correspondant

Quand on a moins d'une dizaine d'images par album on peut se passer des vignettes dans la lightbox mais au-delà c'est bien de pouvoir savoir où l'on va et où on en est : il fallait avoir, entre autres,  la possibilité de pouvoir afficher un panel avec les vignettes dans la lightbox. Il doit y avoir d'autres lightbox qui font ça mais j'ai choisi lightGallery car on ne modifie pas de fichiers : tout se passe au niveau des scripts dans head et body et ça reste "simple", alors que les possibilités sont immenses, même pour des vidéos.

Restera à faire un générateur de code automatique à partir des images dans un dossier, comme ce qui avait été fait pour swiper et unitegallery : en me basant sur ces scripts je pense pouvoir le faire... sans vouloir trop m'avancer.

La suite sur lightgallery dans le post indiqué ci-dessus.

Philippe

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0
Il y a 21 heures, McGregor a dit :

Oui, il est possible d'afficher plusieurs galeries "SimpleLightbox" dans la même page, mais il faut d'abord mettre à jour le script en remplaçant le fichier "core/vendor/simplelightbox/simplelightbox.min.js" par celui joint (version 2.1.2).

 

Ensuite il faut éditer "core/vendor/simplelightbox/int.js" et ajouter autant de classes supplémentaires que vous voulez. Ici pour deux galeries :  


 // Paramètres d'initialisation
    $(document).ready(function() {
            // Ajouter des classes Gallery afin de faire la liaison avec simplelightbox


        $("a[rel='gallery']").addClass(
            "gallery",""
        );
        $('.gallery').simpleLightbox({closeText:"&times;",captionsData:'alt'});

        $("a[rel='gallery2']").addClass(
            "gallery2",""
        );
        $('.gallery2').simpleLightbox({closeText:"&times;",captionsData:'alt'});

    });

Editez le code de votre page et remplacez rel="gallery" par rel="gallery2" pour les images que vous voulez mettre dans le deuxième galerie.

Avec l'astuce d'Augras, c'est parfait : juste deux vignettes sur la page, mais deux galeries.

simple-lightbox.min.js 25 Ko · 0 downloads

 

Ne fonctionne pas sur un 9.2.23 fraîche. Fonction simpleLightbox non trouvée...

Un truc m'aurait échappé ?

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0
Il y a 3 heures, McGregor a dit :

@Fred

 

  J'ai fait avec 9.221. Fonctionne comme expliqué au-dessus.

 

Tu aurais des pouvoirs magiques ? Déposez une archive de ton dossier vendor/simplelightbox, l'astuce est sûrement dedans.

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0
Il y a 4 heures, augras a dit :

Par contre ça fonctionne parfaitement avec le fichier d'origine livré avec zwii...

 

Augras est juste : je me suis mélangé, pas besoin de mettre à jour. Fonctionne aussi sur 9.223 avec le script d'origine. 

simplelightbox.zip

Modifié par McGregor
Erratum

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0

@McGregor as-tu réussi à installer l'update ?

 

Étrangement, la version 2.1 est installée ce matin sans erreur de script.

 

Pour éviter de modifier des fichiers qui seront écrasés lors d'une mise à jour, il est préférable d'utiliser les fichiers d'inclusion et de saisir le script dans body au  niveau de la config du site :

 

<script type="text/javascript">
        $("a[rel='gallery2']").addClass(
            "gallery2",""
        );
        $('.gallery2').simpleLightbox({closeText:"×",captionsData:'alt'});
</script>

On peut ainsi ajouter autant de galeries que nécessaire.

Partager ce message


Lien à poster
Partager sur d’autres sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Invité
Répondre à cette question…

×   Collé en tant que texte enrichi.   Coller en tant que texte brut à la place

  Seulement 75 émoticônes maximum sont autorisées.

×   Votre lien a été automatiquement intégré.   Afficher plutôt comme un lien

×   Votre contenu précédent a été rétabli.   Vider l’éditeur

×   Vous ne pouvez pas directement coller des images. Envoyez-les depuis votre ordinateur ou insérez-les depuis une URL.


×
×
  • Créer...