“Embed Google Map” Documentation by “Petteri Kivimäki” v3.2


“Embed Google Map”

Created: 8.6.2014
Updated: 6.12.2014
By: Petteri Kivimäki
Email: dinky_jackson@hotmail.com

Thank you for choosing my Embed Google Map WordPress plugin. If you have any questions that are beyond the scope of this help file, please feel free to contact me. Thanks so much!


Table of Contents

  1. Description
  2. Features
  3. Installation
  4. Settings
  5. Basic Usage
  6. Overriding Default Settings
  7. Shortcode
  8. Examples

A) Description - top

Embed Google Map is a plugin for embedding one or more Google Maps to WordPress posts, pages text widgets and templates. Adding maps is very simple, just add the address or the coordinates which location you want to show an a map inside google_map tags to a post or a page or a text widget or a template, and that's it!

The plugin supports Google Maps, Google Maps Classic and Google Maps Embed API. The version to be used can be set by using the Version setting (supported values: new, classic, embed). Google Maps and Google Maps Classic do not require an API key, but for Google Maps Embed API an API key is required instead. Not all the parameters are supported by all the versions. Please see the supported parameters below.

It's possible to define the version of Google Maps, the type of the map (normal, satellite, hybrid, terrain), the size of the map, the language of the Google Maps interface, custom labels, zoom level, border layout and link to the full size map. Both HTTP and HTTPS protocols are supported. The default settings defined in the admin panel are used for all the maps in the site, and they can be overridden for individual maps.

Frontend

Frontend view

Image 1. Frontend view.

Backend

Backend view

Image 2. Backend view.

Settings

Settings page

Image 3. Settings page.


B) Features - top


C) Installation - top

Adding the plugin using the built-in plugin installer:

OR


D) Settings - top

The settings page can be accessed through the admin panel, and it can be found under the Setting menu (Settings > Embed Google Map) or in Plugins page.

Settings page

Image 4. Settings page.

Name Description Key Allowed values
version Google Maps version to be used: Google Maps (no API key), Google Maps Classic (no API key), Google Maps Embed API (API key required) version new, classic, embed
map type type of the map map_type Google Maps, Google Maps Embed API: normal, satellite.
Google Maps Classic: normal, satellite, hybrid, terrain.
zoom level defines the resolution of the map zoom_level numeric value between 0-21
language language of the Google Maps interface lang language codes
add link add link to the full size map add_link yes, no
link label link label of the link to the full size map link_label text
link full open link in full screen mode link_full yes, no
show info show/hide the info label show_info yes, no
info label custom info label info_label text
height map height height numeric value (pixels)
width map width width numeric value (pixels)
border map border width border numeric value (pixels)
border style map border style border_style none, hidden, dotted, dashed, solid, double
border color map border color border_color border color in hexadecimal format
HTTPS use HTTPS protocol https yes, no
Google Maps Embed API key When using Google Maps Embed API, all requests must include a free API key. How to retrieve your API key? When using Google Maps or Google Maps Classic no API key is required. - Valid Google Maps Embed API key

Table 1. Embed Google Map settings.

The plugin supports Google Maps, Google Maps Classic and Google Maps Embed API. The version to be used can be set by using the Version setting (supported values: new, classic, embed). Google Maps and Google Maps Classic do not require an API key, but for Google Maps Embed API an API key is required instead. Not all the parameters are supported by all the versions. Please see the supported parameters below.

Google Maps

Google Maps Classic

Google Maps Embed API


E) Basic Usage - top

To embed a map in a post or a page use the following code:

{google_map}address{/google_map}
*{google_map}latitude,longitude{/google_map}
**{google_map}url{/google_map}

* latitude,longitude = coordinates in decimal degrees

** URL of a map stored under My Places on Google Maps


F) Overriding Default Settings - top

The default settings can be overridden for individual maps by using the keys and values explained in the Table 1. To override one or more default settings use the following code:

{google_map}address|zoom:10{/google_map}
{google_map}address|zoom:10|version:classic{/google_map}
{google_map}address|zoom:10|lang:it{/google_map}
{google_map}address|lang:system{/google_map}
{google_map}address|width:200|height:200|border:1|border_style:solid|border_color:#000000{/google_map}
{google_map}address|width:200|height:200|link:yes|link_label:Label{/google_map}
{google_map}address|link:yes{/google_map}
{google_map}address|type:satellite{/google_map}
{google_map}address|show_info:yes|info_label:Label{/google_map}
{google_map}address|link_full:yes{/google_map}
{google_map}address|https:yes{/google_map}
*{google_map}latitude,longitude{/google_map}
**{google_map}url|width:200|height:200|border:1{/google_map}

* latitude,longitude = coordinates in decimal degrees

** URL of a map stored under My Places on Google Maps


G) Shortcode - top

To embed a map in a template use [google_map] shortcode. For example:

echo do_shortcode('[google_map]'.$address.'[/google_map]');

All the settings supported by Embed Google Maps plugin can be set as shortcode attributes. For example:

echo do_shortcode('[google_map version="classic" lang="en" link="yes" width="200" height="200"]'.$address.'[/google_map]');

In addition, [google_map] shorcode can be used inside pages, post and text widgets too.


H) Examples - top

Example 1

Replace the "address" string with the address which location you want to show on the map.

{google_map}Sunset Boulevard West Hollywood{/google_map}

Using [google_map] shortcode:

[google_map]Sunset Boulevard West Hollywood[/google_map]

Example 2

Replace the "latitude" and "longitude" strings with the coordinates which location you want to show on the map. The coordinates must be expressed as decimal degrees.

{google_map}60.1705,24.9384{/google_map}

Using [google_map] shortcode:

[google_map]60.1705,24.9384[/google_map]

Example 3

Embedding a map created on Google Maps under My Places. Go to Google Maps and open the map you want to embed. Click on "Link" and copy the URL of the map between googe_map tags.

{google_map}https://maps.google.com/maps/ms?msid=213.......|lang:en|width:600|height:600|zoom:14{/google_map}

Using [google_map] shortcode:

[google_map lang="en" width="600" height="600" zoom="14"]https://maps.google.com/maps/ms?msid=213.......[/google_map]

Petteri Kivimäki

Go To Table of Contents