Geolocation

Yes, some more custom js:

<script>
window.WPLeafletMapPlugin = window.WPLeafletMapPlugin || [];
window.WPLeafletMapPlugin.push(function () {
  var map = window.WPLeafletMapPlugin.getCurrentMap();
  L.control.locate({
    strings: {
      title: "Show me where I am, yo!"
    }
  }).addTo(map);
});
</script>

(not tested)

• This reply was modified 2 years, 7 months ago by hupe13.

Hello @hupe13,

Thank you for your help.

I tried to add the code you kindly suggested. I get the following error in the console: “TypeError: L.control.locate is not a function” with the following file as reference: /wp-content/plugins/leaflet-map/scripts/construct-leaflet-map.min.js?ver=3.0.4

Any idea ?

Open the Developer Console and look at any errors.

I tested it now, it works for me principally, but not perfect. Do you have an URL to your testpage?

Thank you very much for your help @hupe13. Back in front of my computer, here is a test url: https://url.dev/ZXtVfSL/

The map concerned is the main map (not the small ones).

I found the source of the problem. By disabling the multiple small cards, the button appeared… it works fine.

I thank you again for your precious help @hupe13 ??

Hello,
Sorry to come back to this topic, but I can’t add geolocation to my map.
Can you explain which codes should be added where please? My skills in this area very weak, and I need to be guided.
Thanks !

Hello @nonopinspins,

Simply add this code to the functions.php file of your theme:

add_action('leaflet_map_loaded', 'fs_leaflet_loaded');
function fs_leaflet_loaded() {
  wp_enqueue_script('locate_leaflet', 'https://cdn.jsdelivr.net/npm/[email protected]/dist/L.Control.Locate.min.js', Array('wp_leaflet_map'), '1.0', true);
  wp_enqueue_style('locate_leaflet_styles', 'https://cdn.jsdelivr.net/npm/[email protected]/dist/L.Control.Locate.min.css');
}

And this one on the page where you want to load your map under the shortcode [leaflet-map] :

<script>
window.WPLeafletMapPlugin = window.WPLeafletMapPlugin || [];
window.WPLeafletMapPlugin.push(function () {
  var map = window.WPLeafletMapPlugin.getCurrentMap();
  L.control.locate({
    strings: {
      title: "Me géolocaliser sur la carte"
    }
  }).addTo(map);
});
</script>

I hope this helps!

It works ! Thank very much @killiansantos.