Documentation

Description

A responsive Google map that allows multiple markers per map and multiple maps per page. Includes fullscreen view and marker clustering. No API key required. Easy simple setup. No long complex shortcodes to generate by hand. As simple as creating a map, quick add a location, copy the simple shortcode to the page you want the map on, and you’re done.

Requirements

  • WordPress 3.5 or later
  • jQuery (included with WordPress)

Compatible With

  • Chrome
  • FireFox
  • Safari
  • Opera
  • IE 7+

Installation

To install this plugin, simply decompress the zip file and upload to the plugins folder in your WordPress site. You may also refer to the WordPress documentation on installing plugins.

Setup

After installation, go to the “Map Settings” page under the “Google Maps” tab. Here you can customize the global settings for the maps. You can also go to the “Location Settings” page under the “Map Locations” to customize the global location settings.

A brief not to multi-site admins. DO NOT “network activate” this plugin. It needs to be activated on each individual site for default settings to take effect.

Getting Started

Note : On all plugin admin pages, there is more information under the “Help” link in the upper right corner. There is also shortcode help on pages and posts.

  1. Once you have set the global settings, you can then start to create map locations. Go to “New Location” under the “Map Locations” tab to create your first location.
  2. In the “Address to use for geocoding” field, enter the address of the location. If the marker is not accurate, you can drag the marker on the map to where you would like it. This will update the geographical coordinates of the marker. This field is also used for the directions services. The address saved in this field will be used when the user clicks on directions “to here” or “from here”. If the marker was not accurate with the address you used, you can delete the address and the map will use the marker’s coordinates for the address services.
  3. If you would like to categorize your locations, you can do so by creating new categories on this page or by going to the “Categories” page under the “Map Locations” tab.
  4. Once you have created a location, you can either use the shortcode provided and place that into a page or post, or you can move on to create a new map.
  5. If you choose to use the location shortcode, that map will use the global map setting when being displayed. If you choose to create a new map, you can override the global settings if allowed.
  6. To create a new map, go to “New Google Map” under the “Google Maps” tab. The map will display with the global map settings. If allowed the map will override options below.
  7. To the right side under “Map Locations” there will be a checkbox list of locations that you created. Check the boxes of the locations you would like to display on this map.
  8. Below the map is also a “Quick Add A Location”. Here you can add a location on the fly. Just enter the address you would like to display. This will create a new location with the name of the address with basic global settings. These settings and name can then be updated as needed in map location section.
  9. Once you have created a map, you can copy the shortcode provided and place that into any page or post.

Options Pages

Plugin Settings

  • Disable administrative localization for this plugin: This will revert all translations to English for the administrative view only.
  • Disable browser based front-end localization for this plugin: This will disable the non-Google navigation terms from beinging translated based on the users browser settings.
  • Enable front-end AJAX caching: This will tell the browser to cache AJAX request by the map for a period of 60 minutes. This will help with users that navigate to the same or multiple pages with maps.
  • API key: You do not need an API key, but if you would like to add an API key, you can obtain one here. There are a few benefits to using one.
  • Fade Speed: The speed in which the map will transition from regular fullscreen and back. Values in milliseconds.
  • Allow map pages to be viewed publicly: This allows individual map pages to be viewed on the front-end.
  • Exclude map pages from search results: This excludes individual map pages from showing up in front-end search results. This is not necessary unless the map pages are viewed publicly.
  • Allow individual maps to override default settings.: This allows individual maps to override the global map settings set below.

Map Default Settings

  • Default Map Type: Options are “Roadmap”, “Satellite”, “Hybrid”, and “Terrain”
  • Enable Map Zoom Controls: Enables the zoom controls on the left side of the map.
  • Enable Infowindow Zoom Controls: Enables zoom links to be added the bottom of the infowindow content.
  • Disable Double click Zoom: Disables double click zooming
  • Enable Scrollwheel Zoom: Enables scrollwheel zoom.
  • Default Tilt Angle: The angle of tilt for the map view. Only available in satellite and at high zoom.
  • Autocenter Map – Overrides Map Center Options and default zoom level.: This will auto center and zoom the map when looaded to show all markers.
  • Enable Directions: Enable the directions.
  • Enable Directions Links In Infowindows: Enable the direction “to here”, “from here” links. Requires directions to be enabled.
  • Show Overview Map Control: Enable the overview map on the lower right corner on the map.
  • Overview Map Control Opened: Opens the overview map control by default.
  • Enable Scale Control: Show the scale controls when applicable.
  • Enable Rotate Control: Show the rotate controls when applicable.
  • Enable Pan Control: Show the pan controls when applicable.
  • Enable Street View Control: Show the street view controls when applicable.
  • Enable Map Type Control: Enables the user to choose between different map types.
  • Enable Auto Fit Button: Enables the auto fit button on the map.
  • Enable Map Reset Button: Enables the map reset button on the map.
  • Enable Fullscreen View: Enables the fullscreen button on the map.
  • Infowindow Max Width – In Pixels: This is the maximum width of the infowindow. Any content larger than this will be wrapped and scrolled if needed.
  • Map Background Color: The HEX color behind the map canvas. This will be seen during loading and transitions.
  • Enable Map Nav Backgroud: Enables the background color behind the map navigation buttons.
  • Map Nav Backgroud Color: The HEX color behind the map navigation.
  • Show User’s Location (You are here.): This will show the user’s location if they allow the use of their geolocation. This is handy for mobile users.
  • Enable Marker Clustering: This will cluster map marker together to keep the map cleaner.
  • Enable Weather Layer: This will enable a weather map layer over the map.
  • Display Temperature As: Cosse either fahrenheit or celsius.
  • Display Wind Speed As: Choose the unit of measer for the wind speed.
  • Enable Cloud Layer: This will enable a cloud layer over the map.
  • Enable Panoramio Layer: This will enable a Panoramio layer of images over the map.
  • Filter Panoramio Images By User ID: Images may be filtered by user ID. The user ID in NOT the username, but the number associated with that username.
  • Filter Panoramio Images By Tag: This will filter the images in the Panoramio layer. This will override the user ID set above.
  • Default Center Latitude: Displays the default center latitude.
  • Default Center Longitude: Displays the default center longitude.
  • Zoom: Displays the default zoom.
  • Find an address or move the map to the center of your choice.: Type in an address to use as the default center location.

Location Settings

  • Allow location pages to be viewed publicly: This allows individual location pages to viewed on the front-end. This is not recommended unless you need to add additional content to each location that cannot fit into the info window.
  • Exclude location pages from search results: This excludes individual location pages from showing up in front-end search results. This is not necessary unless the location pages are viewed publicly.
  • Default Marker Image. (Remove to use Google default image): You can set a global default location marker. This is be the default image for all markers that do not use custom markers.
  • Asynchronously load locations on the front-end. This will decrease page load time, but slightly increase map rendering time. This effect is noticable with large numbers of locations.

Map Style Settings

  • These settings allow the map style names to be localized based on the user’s browser settings.
  • Allow localization based on user’s browser language: This will enable/disable localization of map style names based on the user’s browser settings.
  • Folder path to language files within your theme: This is the folder wher your map style name localization files are kept. You may create seperate localizations files for the front-end map style name translations. see the help.html for more info.
  • Default text domain for map style name translation: This is the default text domain used in your theme. If the localization is not based on the user’s settings the translation will be set by this text domain from your theme.

Page Metaboxes

Map Location

  • Address to use for geocoding: Use this input to place a marker on the map. You can drag the marker to a more accurate location if needed. This input field is also used for the direction service on the map. If this is saved with no input, the directions service will use the geographic coordinates.
  • Info Window Open: Set this to have the info window open by default.
  • Default marker image. (Remove to use site default image): You can upload your own marker image. Images are not resized. Please upload the correct size. Smaller images work best (30px X 30px).
  • Info Window Content: Use this editor to add your custom info window content.

Location Shortcode

  • This is the shortcode to display that location only, with the global defaults.

Location Info

  • Displays the geographical coordinates of the marker.

Map Shortcode

  • This is the shortcode to display that map only.

Map locations

  • This is a list of available locations to add to the current map.

Quick add a location

  • Use this to add a location to this map. This will create a new location page with the same name as the address searched for. You can then update this location later.

Map Settings

Map:

  • Default Map Type: Options are “Roadmap”, “Satellite”, “Hybrid”, and “Terrain”
  • Enable Map Zoom Controls: Enables the zoom controls on the left side of the map.
  • Enable Infowindow Zoom Controls: Enables zoom links to be added the bottom of the infowindow content.
  • Disable Double click Zoom: Disables double click zooming
  • Enable Scrollwheel Zoom: Enables scrollwheel zoom.
  • Default Tilt Angle: The angle of tilt for the map view. Only available in satellite and at high zoom.
  • Autocenter Map – Overrides Map Center Options and default zoom level.: This will auto center and zoom the map when looaded to show all markers.
  • Enable Directions: Enable the directions.
  • Enable Directions Links In Infowindows: Enable the direction “to here”, “from here” links. Requires directions to be enabled.

Controls:

  • Show Overview Map Control: Enable the overview map on the lower right corner on the map.
  • Overview Map Control Opened: Opens the overview map control by default.
  • Enable Scale Control: Show the scale controls when applicable.
  • Enable Rotate Control: Show the rotate controls when applicable.
  • Enable Pan Control: Show the pan controls when applicable.
  • Enable Street View Control: Show the street view controls when applicable.
  • Enable Map Type Control: Enables the user to choose between different map types.

Style:

  • Enable Auto Fit Button: Enables the auto fit button on the map.
  • Enable Map Reset Button: Enables the map reset button on the map.
  • Enable Fullscreen View: Enables the fullscreen button on the map.
  • Infowindow Max Width – In Pixels: This is the maximum width of the infowindow. Any content larger than this will be wrapped and scrolled if needed.
  • Map Background Color: The HEX color behind the map canvas. This will be seen during loading and transitions.
  • Enable Map Nav Backgroud: Enables the background color behind the map navigation buttons.
  • Map Nav Backgroud Color: The HEX color behind the map navigation.

Features:

  • Show User’s Location (You are here.): This will show the user’s location if they allow the use of their geolocation. This is handy for mobile users.
  • Enable Marker Clustering: This will cluster map marker together to keep the map cleaner.
  • Enable Weather Layer: This will enable a weather map layer over the map.
  • Display Temperature As: Cosse either fahrenheit or celsius.
  • Display Wind Speed As: Choose the unit of measer for the wind speed.
  • Enable Cloud Layer: This will enable a cloud layer over the map.
  • Enable Panoramio Layer: This will enable a Panoramio layer of images over the map.
  • Filter Panoramio Images By User ID: Images may be filtered by user ID. The user ID in NOT the username, but the number associated with that username.
  • Filter Panoramio Images By Tag: This will filter the images in the Panoramio layer. This will override the user ID set above.

Info:

  • Default Center Latitude: Displays the default center latitude.
  • Default Center Longitude: Displays the default center longitude.
  • Zoom: Displays the default zoom.

Map Styles

  • Enable Changes To: This will enable/disable their respective styles.

Map, Administrative, Landscape, (POI) Points of Interest, Road, Transit, Water:

  • Hue: Sets the hue of the feature to match the hue of the color supplied. Note that the saturation and lightness of the feature is conserved, which means that the feature will not match the color supplied exactly.
  • Invert Lightness: Invert the lightness of the feature while preserving the hue and saturation.
  • Saturation: Shifts the saturation of colors by a percentage of the original value if decreasing and a percentage of the remaining value if increasing.
  • Lightness: Shifts lightness of colors by a percentage of the original value if decreasing and a percentage of the remaining value if increasing.
  • Gamma: Modifies the gamma by raising the lightness to the given power.
  • Label Text Fill Color: Color of the label text
  • Label Text Fill Visibility: Sets the visibility of the feature.
  • Label Text Stroke Color: Color of the stroke of the label text
  • Label Text Stroke Weight: Sets the weight of the feature, in pixels.
  • Label Text Stroke Visibility: Sets the visibility of the feature.

JSON:

Google Map Shortcodes

[google_map]

location_id: Show a single location on a map. Example:
[google_map location_id="12"/]

map_id: Show a group of locations on a map. Example:
[google_map map_id="15"/]

category_name: Show a group of locations by category name or a comma separated list of categories. Example:
[google_map category_name="Businesses"/]
or
[google_map category_name="Hotels,Restaurants"/]

category_slug: Same as above but uses the slug instead of the name. Example:
[google_map category_slug="businesses"/]
or
[google_map category_slug="hotels,restaurants"/]

width: Sets the width of the map in either pixels or %. Example:
[google_map location_id="12" width="500px"/]
or
[google_map location_id="12" width="50%"/]

height: Sets the height of the map in either pixels or %. Example:
[google_map location_id="12" height="500px"/]
or
[google_map location_id="12" height="50%"/]

Template Files

Public Map Pages

  • If you want to override the template files that displays the individual map pages from selecting the “Allow map pages to be viewed publicly” options, create a file named “single-google-map.php” and place it in your themes folder.

Public Location Pages

  • If you want to override the template files that displays the individual location pages from selecting the “Allow location pages to be viewed publicly” options, create a file named “single-location.php” and place it in your themes folder.

Location Category View

  • If you want to override the category view for location pages, create a file named “taxonomy-location-category.php” and place it in your themes folder.

Internationalization

  • The two folders in this directory hold the translation files (.po, .mo, .pot) needed to translate both, front-end and back-end terms.

Front-end Translation

  • The front-end terms are those shown to the user while using the map. These terms include the navigation and directions terms. The plugin is setup to translate the front-end based on the users browser language. If the .mo file for that language is not found it will revert to the WordPress install language. If that translation is not found than it will then revert to English.
  • If you would like to make a .mo file for the front-end, please name them responsive-google-maps-(two letter language).mo
  • Example for English: responsive-google-maps-en.mo
  • You can also make a file that is region specific. Just add and _(REGION)
  • Example: responsive-google-maps-en_US.mo
  • Depending on the users browser the language detected may, or may not, include the region. Be sure to create both files if at all possible.

Back-end Translation

  • The back-end translation is only based on the WordPress install language. Currently there are no translations for this, yet. The .pot file in the back-end folder include all of the terms used. Fell free to create your own translations and save the .mo file in that directory. The plugin is already setup to include the proper .mo file if it is available. Please name those responsive-google-maps-(two letter language_REGION).
  • Example: responsive-google-maps-en_US.mo

Submitting Translations

  • If you would like to submit your translations to be included in future releases please submit those to support@markadvertising.com. Please include both the .po and .mo files

Filters

“infowindow_content”

  • A filter is now applied to the infowindow content prior to being outputed. This filter is run after the content has run through the “wpautop()” function.

Example

function your_filter_function( $content, $post_id )
{
	return 'Post ID #' . $post_id . ' content = ' . $content;
}
add_filter( 'infowindow_content', 'your_filter_function', 10, 2 );

“rgm_metabox_{metabox_id}”

A filter is now applied to the metabox content prior to being output. This filter is run on all metaboxes created by this plugin.

Example

function your_filter_function( $content )
{
	return 'Your content ' . $content . ' around the metabox';
}
add_filter( 'rgm_metabox_map_locations', 'your_filter_function', 10, 2 );

“rgm_metabox_{metabox_id}_{field_id}”

A filter is now applied to the metabox field prior to being output. This filter is run on all inputs in all metaboxes created by this plugin.

Example

function your_filter_function( $content )
{
	return 'Your content ' . $content . ' around the metafield';
}
add_filter( 'rgm_metabox_map_settings_zoom_level', 'your_filter_function', 10, 2 );

Visual Composer Block

  • Select the “Responsive Google Map” block to begin. Select from the “Map” dropdown, already created map or locations. If the only option is “None”, you need to create a map or location.
  • Enter the height and width. Please inlude units (px, %) or leave blank to use the default.