Integrating a Leaflet.js map (without the plugin)

  • jonny cakes

    (@jonny-cakes)


    9 months ago

    Can someone please advise on how to incorporate a leaflet map into my WordPress site? I tested the Leaflet.js library and made the map in HTML… it has the basic map baselayers, layer overlays, and markers coming from a GeoJSON file. But I also created more advanced things using HTML/JavaScript, like HTML form elements to filter the data, and a table to display the feature’s data (for when the user clicks on a “read more” button in a marker popup). So I’m pretty sure the leaflet plugin doesn’t support those more advanced things. But it’s been a while since I’ve customized WordPress… would an iframe be the way to go? A custom page in a child theme?

    … I want to continue developing this with HTML/CSS/JS and not be forced into a plugin. Thanks!

Viewing 2 replies - 1 through 2 (of 2 total)
  • tugbucket

    (@tugbucket)

    You could just take all your code and make your own plugin to display it.

    Moderator bcworkz

    (@bcworkz)

    Placing all of your code in a bespoke plugin is the gist of it all right. Your plugin should enqueue all of its external JS and CSS files. For the necessary HTML, I suggest introducing it into post/page content with either a shortcode or custom block. Alternately the HTML could be included as part of a template’s code. Which is best depends on where you want the HTML to appear.

    An iframe is a possibility but it’s not necessary. IMO it’d needlessly complicate things.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Integrating a Leaflet.js map (without the plugin)’ is closed to new replies.