Google MapGoogle Maps plugin is used to display Google Map on different pages with all the available events added using WP Event Manager on your website. It also allows you to filter the events using different location filter options.
InstallationYou can install Google Maps plugin using 2 different ways:
How to set up Google Map API?After installing and activating the plugin, first of all you need to create API key from your Google Console account. You can refer to this link for how to get API key. Once you get Google API key, insert it into the backend of your website at WP-admin >> Event Listings >> Settings >> General >> Google API Key and save changes.
- Open your Google Console Account
- Go to APIs & Services >> Dashboard
- Click on “+ENABLE APIS AND SERVICES” link showing at top of the page, you will be on “Welcome to the API Library” page
Google Maps General SettingsGo to WP-admin >> Event Listings >> Settings >> Google Maps General Settings. Here, you can see these options:
- Google API language: This feature controls the language of the autocomplete results and Google maps. Enter the language code of the language you would like to use. List of available languages can be found here
- Google API default region: This feature controls the regions of Google API. Enter a country code; for example for United States enter US. You can find the country code here
- Google address autocomplete(For Backend submission form): Display suggested results by Google when typing an address in the location field showing on BACKEND add new/edit event submission form.
- Google address autocomplete(For Frontend submission form): Display suggested results by Google when typing an address in the location field showing on FRONTEND add new/edit event submission form.
- Autocomplete country restriction: Enter the country code of the country which you would like to restrict the autocomplete results to. Leave it empty to show all countries.
- Location Marker: URL of google map icon/marker which represents locations on the map.
Google Maps Search Form SettingsProximity search becomes even more helpful when you know what you are looking for. Using the filter options (Within, Miles, Order by) given on the search form, you can easily filtes the events within specific distance.
- Google address autocomplete: Display suggested results by Google when typing an address in the location field showing on search form on event listing page.
- Radius: To search events by radius. Enter single value to be the default or multiple values comma separated to be displaed as a dropdown (For ex: 5,10,15,25,50,100).
- Order By: Enter the values you want to use in the “Sort by” dropdown select box. Enter comma separated(,) in the order that you want the values to appear any of the values (For ex: distance,title,featured,date).
- Display maps: Enable this option if you want to display map with google_map location above the list of search results.
- Maps Width: Set map width in pixels or percentage (For ex. 100% or 250px).
- Maps height: Set map height in pixels or percentage (For ex. 100% or 250px).
- Maps Type: Set type of map – Roadmap, Satellite, Hybrid, Terrain.
- Enable Maps scrollwheel control?: Enable this option if you want to zoom maps in/out using mouse wheel.
Google Maps Single Page SettingsGoogle Maps plugin enables the map functionality on event detail/single page as well. The google map on event detail page will display exact location of the event on it.
- Display maps: Enable this option if you want to display the google map with event location on event detail page.
- Maps Width: Set the width of map in pixels or percentage (ex. 100% or 250px).
- Maps height: Set the height of map in pixels or percentage (ex. 100% or 250px).
- Maps Type: Set the type of map – Roadmap, Setellite, Hybrid, Terrain.
- Enable maps scrollwheel control?: Enable this option if you want to zoom maps in/out using mouse wheel.
- Zoom Level: Set the zoom level of map. Click Here for more info about this.
All In One MapDo you want to display all your events on single google map only? If so, you can do it just using a single line shortcode.
[events_map maps_type="ROADMAP" height="100px" width="100px" categories="Comma separate slugs" event_types="Comma separate slugs" featured="false" cancelled="false" location="location name" keywords="search keywords"]
- maps_type: Give map type like roadmap, satellite, hybrid or terrain. Click here for more info.
- height: Set map height in pixel.
- width: Set map width in pixel.
- categories: Give category slug separated by comma.
- event_types: Give event type slug separated by comma.
- featured: Featured events true / false.
- location: Set location value (ex: berlin,london).
- keywords: Set Keywords value (ex: party,meeting).
Single Event Location MapUsing Google Maps plugin, you can display google map on your event detail page as well. This is how the map will look on your page.
[single_event_location_map event_id="123" maps_type="ROADMAP" height="100px" width="100px"]
- event_id – Give perticular event id.
- maps_type – Give map type like roadmap, satellite, hybrid or terrain. Click here for more info.
- height – Set map height in pixel.
- width – Set map width in pixel.
- event_id – Give perticular event id.
Advanced: Overriding/Customizing the templatesFor overriding or customization template files can be found in the wp-event-manager-google-maps/templates/ directory. To override a template file, first you need to create directory “wp-event-manager-google-maps” under your theme folder and copy the template file to “/wp-content/yourtheme/wp-event-manager-google-maps/” directory. Your theme will use all the template files from the “/wp-content/yourtheme/wp-event-manager-google-maps/” directory instead of the plugin’s template file (/wp-content/plugins/wp-event-manager-google-maps/).
- event-google-maps.php template file lists the user’s maps.