Title: Trigger Lightbox with The leaflet map plugin
Last modified: June 10, 2024

---

# Trigger Lightbox with The leaflet map plugin

 *  Resolved [totorosk8](https://wordpress.org/support/users/totorosk8/)
 * (@totorosk8)
 * [1 year, 12 months ago](https://wordpress.org/support/topic/trigger-lightbox-with-the-leaflet-map-plugin/)
 * Hi, i know this is not directly a Meow Lightbox problem, but if i could have 
   an idea, some clarification on why it doesn’t work and in which direction to 
   look it would help me a lot.
   I’m using Leaflet Map plugin (with Extensions for
   Leaflet Map) and i changed the ‘layer on click’ function to open a picture instead
   of a popup. And i want to open those pictures inside the Meow Lightbox, i added
   the ‘selector’ ‘.lightbox-map-image’ but that’s not working.I have a geojson 
   overlay on my plan and this is how i try to open the lightbox inside Leafleat
   Map :
 *     ```wp-block-code
           // Ajout d'une action personnalisée lors du clic sur une zone geojson    layer.on('click', function(e) {        // Récupérer les URL des images depuis le tableau imageUrls du fichier geojson        var imageUrls = props.imageUrls || [];        // Créer le contenu de la lightbox avec les images        var lightboxContent = '';        imageUrls.forEach(function(url) {            lightboxContent += '<a class="lightbox-map-image" href="' + url + '" data-lightbox="my-lightbox"><img class="lightbox-map-image" src="' + url + '" /></a>';        });        // Afficher la lightbox avec le contenu des images        var lightbox = document.querySelector('.meow-lightbox');        if (lightbox) {            lightbox.innerHTML = lightboxContent;        } else {            lightbox = document.createElement('div');            lightbox.className = 'meow-lightbox';            lightbox.innerHTML = lightboxContent;            document.body.appendChild(lightbox);        }        MeowLightbox.init({    selector: 'a[data-lightbox="my-lightbox"]',    navigation: true,    closeOnBgClick: true});        MeowLightbox.open(0);    });}
       ```
   
 * How can I trigger the opening of the image in the Lightbox ?
   Thanks

Viewing 3 replies - 1 through 3 (of 3 total)

 *  Thread Starter [totorosk8](https://wordpress.org/support/users/totorosk8/)
 * (@totorosk8)
 * [1 year, 12 months ago](https://wordpress.org/support/topic/trigger-lightbox-with-the-leaflet-map-plugin/#post-17814794)
 * edit : I think i understand that your plugin scan the page has its display to
   see the images and prepare them for the Lightbox, but how to do that for images
   that are not yet present in the page, because they will open when following a
   click event like i do on the first post ?
   Sorry if it’s a bit messy.
 *  Plugin Support [Val Meow](https://wordpress.org/support/users/valwa/)
 * (@valwa)
 * [1 year, 12 months ago](https://wordpress.org/support/topic/trigger-lightbox-with-the-leaflet-map-plugin/#post-17821710)
 * Hey [@totorosk8](https://wordpress.org/support/users/totorosk8/)! 👋
 * What you can do on the Lightbox side is call the `renderMeowLightbox();` function.
   This function is exported to your DOM and can be called by anything at any time.
   As the name suggests, it will re-render the lightbox, and everything should work
   properly. Also, make sure the images are coherent with your selector from the
   settings. Hope this helps!
 *  Thread Starter [totorosk8](https://wordpress.org/support/users/totorosk8/)
 * (@totorosk8)
 * [1 year, 12 months ago](https://wordpress.org/support/topic/trigger-lightbox-with-the-leaflet-map-plugin/#post-17823221)
 * Great i will try it !
   Many thanks for your help.

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Trigger Lightbox with The leaflet map plugin’ is closed to new replies.

 * ![](https://ps.w.org/meow-lightbox/assets/icon-256x256.gif?rev=3004933)
 * [Meow Lightbox](https://wordpress.org/plugins/meow-lightbox/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/meow-lightbox/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/meow-lightbox/)
 * [Active Topics](https://wordpress.org/support/plugin/meow-lightbox/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/meow-lightbox/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/meow-lightbox/reviews/)

 * 3 replies
 * 2 participants
 * Last reply from: [totorosk8](https://wordpress.org/support/users/totorosk8/)
 * Last activity: [1 year, 12 months ago](https://wordpress.org/support/topic/trigger-lightbox-with-the-leaflet-map-plugin/#post-17823221)
 * Status: resolved