wordpress – how let users add location on a map?

5 Views

I’m using WordPress to build my website, i want to add a form that will have: name, description, image and location on a map. that is letting the users add their own marker on a map.

and by pressing ‘submit’ the whole data (name, description, image, longitude, latitude) would be saved to a database.

Read More

how can i do that? which plugins should i use?

Post Views: 5

Related posts

Leave a Reply

4 comments

  1. You could use Google Placemarks and give them access to the creation of the ‘Placemarks’ custom post type that plugin utilises. You might have to hack the featured image..

    Alternatively, you’re looking at full custom post type creation and google maps API integration, a custom loop that utilises of the featured image.

  2. Plugin that comes closest to what you need is what SMacFadyen suggested – BGMP. But if you want to do that yourself you would need to look into this:

    For the first one there is lots of tutorials on how to display map and InfoWindows so you shouldn’t have much problem with that. For Custom Post Types there is an awesome generator which should do 99% of your work. For Meta Boxes you can go several ways:

    • plugin – easiest but you would depend on a plugin which I don’t like very much
    • from scratch – tutorial – which is a lot better than plugin but requires a lot of work
    • one of the meta box libraries – this is the way I usually go – I’m developing my own but it’s not ready yet so in the mean time I would recommend My-Meta-Box or Reusable Custom WordPress Meta Boxes

  3. Several times, when searching how to make this work, I stumbled upon this thread. Every time, I wasn’t really happy with the way existing plugins deal with this. So, I now put this together myself.

    Here’s an overview of my solution.

    1. Use the plugin Custom Post Type UI to create a custom post type for the markers on the map.
    2. Use the plugin Advanced Custom Fields to add a field to this custom post type which represents the location. The field type is of type ‘Google Map’.
    3. Copy the standard Google Maps API clustering example to the appropriate theme file in your theme.
    4. For showing your markers, generate the list of locations by, in your theme file, requesting the posts of your newly created custom post type.
    5. For each marker/location, pick up the ‘Google Map’ field and abstract the latitude and longitude.
    6. For each marker/location, construct the appropriate array element for the array with all locations, with, at least, the latitude and the longitude, and probably also the contents of an infowindow.

    This should give you a map with all locations plotted out.

    To allow users to add locations:

    1. Add a listener to your map that listens for clicks and returns the location clicked. Perhaps this listener is only running after the user has expressed his intent to add a location to the map.
    2. When the user has clicked, open a form, for example in a modal. The form should contain hidden fields with the latitude and longitude and could, for example, also contain a static image of the relevant location. Other form fields would be the fields you need for your purpose.
    3. Submit the form using AJAX. Refer, for example, to this tutorial. In your theme’s functions.php, you can then validate the submission and add the new submission to your WordPress database, matching your new custom post type.

    Depending on how you store your new location, on your next map reload, the new location will be included. (Or you perhaps need to authorise the new location, first.)
    You can also reload all locations through AJAX.