wp plugin manual june 2014

87
Advanced Google Maps Plugin for WordPress FlipperCode USER GUIDE ©2013-2014 Copyrights Reserved FlipperCode WP Google Map Pro wplocker.com

Upload: ritesh

Post on 22-Jul-2016

237 views

Category:

Documents


4 download

DESCRIPTION

k;kkl

TRANSCRIPT

Page 1: Wp plugin manual june 2014

WP Google Map Pro User Guide

Advanced Google Maps Plugin for WordPress

FlipperCode USER GUIDE

©2013-2014 Copyrights Reserved FlipperCode

WP Google Map Pro

wplocker.com

Page 2: Wp plugin manual june 2014

WP Google Map Pro User Guide

About User Documentation Version 1.O

Product Copyright © FipperCode

The FipperCode and its documentation are protected by copyright law and international

treaties. Unauthorized reproduction or distribution of this program, or any portion of it, may

result in severe civil and criminal penalties, and will be prosecuted to the maximum extent

possible under the law. The products described in this document are furnished under license

agreement by FipperCode. The information contained in this document is subject to change

without notice. Although every effort is made to update documentation in a timely manner,

FipperCode does not assume responsibility for the accuracy of the information presented.

Companies, names and/or data used in screens and sample output are fictitious unless

otherwise noted. All trademarks are the property of their respective owners.

Document Purpose

The purpose of this document is to help you to understand the FlipperCode product, WP

Google Map Pro and provides you the easy and best ways to utilize the potentials of the

product to the maximum.

Audience

This document is written for all users and support members who work and use WP Google Map

Pro.

Relevant URLs

Name URL

FipperCode Site www.flippercode.com

Support [email protected]

wplocker.com

Page 3: Wp plugin manual june 2014

WP Google Map Pro User Guide

Contents 1. Getting Started...................................................................................................................................... 6

1.1 Overview .......................................................................................................................................... 6

1.2 Features & Benefits ...................................................................................................................... 6

1.3 Installing WP Google Map Pro Plugin .................................................................................. 7

1.4 Activating the Plugin ................................................................................................................... 9

1.5 Support ............................................................................................................................................ 9

1.6 Logging Out ................................................................................................................................. 10

2. Using the Plugin ................................................................................................................................. 11

2.1 Finding the Plugin ...................................................................................................................... 11

2.2 Adding a Location ...................................................................................................................... 11

2.3 Quickly Creating a Location .................................................................................................... 13

2.4 Managing Locations .................................................................................................................. 16

2.4.1 Editing a Location ................................................................................................................... 16

2.4.2 Deleting a Location ................................................................................................................ 19

2.4.3 Exporting Locations ............................................................................................................... 20

2.5 Importing Locations .................................................................................................................. 21

2.6 Creating a Map ............................................................................................................................ 23

2.7 Managing Maps .......................................................................................................................... 39

2.7.1 Editing a Map ........................................................................................................................... 40

2.7.2 Deleting a Map ........................................................................................................................ 41

2.8 Drawing on a Map...................................................................................................................... 42

2.9 Adding a Marker Category...................................................................................................... 44

2.10 Managing Marker Categories ................................................................................................ 45

2.10.1 Editing a Marker Category .................................................................................................. 46

2.10.2 Deleting a Marker Category ............................................................................................... 47

2.11 Adding Route ............................................................................................................................... 48

wplocker.com

Page 4: Wp plugin manual june 2014

WP Google Map Pro User Guide

2.12 Manage Routes ........................................................................................................................... 51

2.12.1 Editing a Route ........................................................................................................................ 52

2.12.2 Deleting a Route ..................................................................................................................... 56

2.13 Configuring Google WP Map Pro Settings ....................................................................... 56

2.14 Using Shortcodes ....................................................................................................................... 58

2.15 Displaying Map Using Address ............................................................................................. 60

2.16 Displaying Map in a Post /Page ............................................................................................ 61

2.17 Displaying Map in Sidebar ...................................................................................................... 63

3. LIVE EXAMPLES ................................................................................................................................... 67

3.1 100% Responsive Google Map .............................................................................................. 67

3.2 Filter Locations by Categories ................................................................................................ 68

3.3 Styled Google Map Skins ......................................................................................................... 68

3.4 Google Map Street View .......................................................................................................... 69

3.5 Google Map Weather Layer .................................................................................................... 70

3.6 Google Map Transit Layer ............................................. Error! Bookmark not defined.

3.7 Google Map Traffic Layer ........................................................................................................ 72

3.8 Google Map Bicycling Layer ................................................................................................... 73

3.9 Google Map Panoramic Layer ............................................................................................... 74

3.10 Google Map Overlays using WordPress Plugin ............................................................... 75

3.11 Google Map Satellite with Overlays .................................................................................... 76

3.12 Google Map 45 degree Imagery ........................................................................................... 77

3.13 Google Map without 45 degree Imagery .......................................................................... 78

3.14 Turn Off Scrolling Wheel on Google Map ......................................................................... 79

3.15 Enable Visual Refresh on Google Map using WordPress Plugin ............................... 80

3.16 Google Map Marker Cluster ................................................................................................... 81

3.17 Google Map KML Layers using WordPress Plugin ......................................................... 82

3.18 Display Polygons on Google Map ........................................................................................ 83

3.19 Display Polylines on Google Map ......................................................................................... 84

wplocker.com

Page 5: Wp plugin manual june 2014

WP Google Map Pro User Guide

3.20 Display Route Direction on Google Map ........................................................................... 85

3.21 Remove Controls on Google Map .............................. Error! Bookmark not defined.

3.22 Location Listings on Google Map ......................................................................................... 86

3.23 Customize Info Window on Google Map ................ Error! Bookmark not defined.

3.24 Geolocation Testing on Google Map ........................ Error! Bookmark not defined.

wplocker.com

Page 6: Wp plugin manual june 2014

WP Google Map Pro User Guide

1. Getting Started

1.1 Overview

WP Google Map Pro is a complete plugin for WordPress that allows you to create very useful

Google Maps. It is incredibly easy to use and packed with lots of essential features. You can

create simple street view maps to the complex weather maps with marker clusters and overlays.

You can use custom skins and create unlimited maps for unlimited locations in multiple

languages.

This User Guide helps you to understand WP Google Map Pro and provides you the easy and

best ways to work with WP Google Map Pro. You will be able to understand the basics quickly

and you will also find that the plugin is very easy to use. If you still have questions, don’t worry!

We are always there to assist you. Contact our technical support team.

1.2 Features & Benefits

Compatible plugin for all standard browsers;

Use incredibly simple and intuitive interface;

Create unlimited maps for unlimited locations;

Easily add visually appealing maps to posts/pages/contact forms/sidebars;

Completely customized skins;

Use 500+ readymade markers;

Avail support of multiple info windows with title;

Display traffic real time conditions and overlays;

Use panoramic photos as layer;

Use any language map;

Customized polygons/polylines;

Export or import features;

Use searchable/paginated location listing;

Easily provide directions and route suggestions;

Add nearby locations based on user’s current location;

Reduced time, cost and effort;

wplocker.com

Page 7: Wp plugin manual june 2014

WP Google Map Pro User Guide

1.3 Installing WP Google Map Pro Plugin

To install WP Google Map Pro plugin, follow the steps given below.

1. On your WP account, navigate to Plugins section.

The Plugins page will be displayed.

2. To install the WP Google Map Pro plugin, click the Add New button.

The Install Plugins page will be displayed.

3. Navigate the Upload tab.

Click Add New

wplocker.com

Page 8: Wp plugin manual june 2014

WP Google Map Pro User Guide

The Upload section of the Install Plugins page will be displayed.

4. Click the Browse button to upload the zip version of the plugin from your computer.

The standard File Upload dialog will be displayed.

5. Select the zipped file of WP Google Map Pro plugin from your computer.

6. Click the Open button.

The file will be uploaded.

Click Install Now 5

Click Open

6

wplocker.com

Page 9: Wp plugin manual june 2014

WP Google Map Pro User Guide

7. Click the Install Now button.

The WP Google Map Pro plugin will be installed.

1.4 Activating the Plugin

To activate the WP Google Map Pro plugin, follow the steps given below.

1. Navigate to Plugins-> Installed Plugins.

The installed plugins page will be displayed.

2. Enter the search keyword as WP Google Map Pro in the search text entry box to the right.

3. Click the Search Installed Plugins button.

The WP Google Map Pro plugin will be displayed.

4. Check the box to select that plugin.

5. Click the Network Activate option to activate the plugin.

The WP Google Map Pro plugin will now be activated.

1.5 Support

For any questions or technical issues, you can contact us. Here are our contact details.

E-mail: [email protected]

Click Search Installed Plugins

2

wplocker.com

Page 10: Wp plugin manual june 2014

WP Google Map Pro User Guide

1.6 Logging Out

1. To log out of WordPress, click the Logout option from the user name menu in the topmost

right corner of the screen.

You will be logged out of WP application.

Click Logout

wplocker.com

Page 11: Wp plugin manual june 2014

WP Google Map Pro User Guide

2. Using the Plugin

2.1 Finding the Plugin

1. On your WP admin page, locate the WP Google Map Pro plugin in the left section.

The options within the WP Google Map Pro plugin will be expanded. You can explore the

options within the plugin.

2.2 Adding a Location

To add a location, follow the steps given below.

1. Navigate to the WP Google Map -> Add Location.

wplocker.com

Page 12: Wp plugin manual june 2014

WP Google Map Pro User Guide

The Add Location screen will be displayed.

It has the following fields.

Field Description Example

Location Title Refers to the name of the location. Fynsvej v Sl&oslash

Address Refers to the full address of the location. The

Geocode button allows Google to recognize

this address. If the address is recognized, then

the plugin will automatically retrieve the

corresponding latitudes and longitudes for the

location. You can also fill the values manually.

Fynsvej, Kolding,

Denmark

Click Save Location

2

6

7 8

9

3 4

5

wplocker.com

Page 13: Wp plugin manual june 2014

WP Google Map Pro User Guide

Message Refers to an info window message as additional

information of your location.

---------

Draggable Specifies whether your website/blog visitors

can move the marker location from one

position to another or not.

Checked

Disable Info

window

Specifies whether you can disable the display of

info windows or not.

Un-Checked

Choose Marker

Image

Refers to the marker image from the groups in

order to represent your new location in the

Google map.

Google Maps

2. Enter the name of the new location in the Location Title text entry box.

3. Enter the full address of the location in the Address text entry box.

4. Click the Geocode button to allow the Google to recognize the address. If Google

recognizes this address, then the plugin will automatically retrieve the corresponding

latitudes and longitudes for the location. Or else enter the latitude value manually in the

Latitude text entry box.

5. Similarly, enter the longitude value of the location in the Longitude text entry box.

6. Enter the info window message as additional information of your location in the Message

text entry box.

7. Specify whether your website/blog visitors can move the marker location from one position

to another or not by checking or un-checking the box in the Draggable field.

8. Specify whether you can disable the display of info windows or not by checking or un-

checking the box in the Disable Info Window field.

9. Select a marker image from the groups in order to represent your new location in the

Google map from the Choose Marker Image drop down list. The available options are

Google Maps, Select Group, Group Latest and Famous Places.

10. Click the Save Location button.

The new location will be saved.

2.3 Quickly Creating a Location

To quickly create a location, follow the steps given below.

1. Navigate to the WP Google Map -> Quick Locations.

The Quick Locations screen will be displayed.

wplocker.com

Page 14: Wp plugin manual june 2014

WP Google Map Pro User Guide

It has the following fields.

Field Description Example

Enter Title Refers to the name or title of the

location.

Ayer

Enter Message Refers to an info window message

to provide additional information of

the location.

Ayer information

Draggable Specify whether your website/blog

visitors can move the marker

location from one position to

another or not.

Checked

Disable Info window Specifies whether you can disable

the display of info windows or not.

Un-Checked

2

6

7

3

4

5

Click Add Marker

wplocker.com

Page 15: Wp plugin manual june 2014

WP Google Map Pro User Guide

Choose Marker Group Refers to the marker group from the

groups in order to represent your

new location in the Google map.

Google Maps

Note: This is a ready-to-use option to quickly create locations on map.

2. Click the correct position on the map at which you wish to create location.

The location dialog box will be displayed.

3. Enter the title of the location in the Enter Title text entry box.

4. Enter the message to be displayed on the info window message as additional information of

your location in the Message text entry box.

5. Specify whether your website/blog visitors can move the marker location from one position

to another or not by checking or un-checking the box in the Draggable field.

6. Specify whether you can disable the display of info windows or not by checking or un-

checking the box in the Disable Info Window field.

7. Select a marker group from the groups in order to represent your new location in the

Google map from the Choose Marker Group drop down list.

8. Click the Add Marker button.

The message box informing you about the successful saving of the new location marker on your

Google map will be displayed.

9. Click the OK button.

The new quick location will be added.

Click OK

wplocker.com

Page 16: Wp plugin manual june 2014

WP Google Map Pro User Guide

2.4 Managing Locations

To manage locations, follow the steps given below.

1. Navigate to the WP Google Map -> Manage Locations.

The Manage Locations screen will be displayed.

From here you can edit, delete and exporting the record. For more information refer to the

following sections.

Editing a Location

Deleting a Location

Exporting Locations

2.4.1 Editing a Location

To edit a location, follow the steps given below.

wplocker.com

Page 17: Wp plugin manual june 2014

WP Google Map Pro User Guide

1. Navigate to the WP Google Map -> Manage Locations.

The Manage Locations screen will be displayed.

2. Check the box in the location row that you wish to edit.

3. Click the Edit button.

The details of the selected record will be displayed in edit mode.

2

Click Edit

wplocker.com

Page 18: Wp plugin manual june 2014

WP Google Map Pro User Guide

4. Edit the name of your new location in the Location Title text entry box.

5. Edit the full address of the location in the Address text entry box.

6. Click the Geocode button to allow the Google to recognize the address. If Google

recognizes this address, then the plugin will automatically retrieve the corresponding

latitudes and longitudes for the location. Or else edit the latitude value manually in the

Latitude text entry box.

7. Similarly, edit the longitude value of the location in the Longitude text entry box.

8. Edit the info window message as additional information of your location in the Message text

entry box.

9. Specify whether your website/blog visitors can move the marker location from one position

to another or not by checking or un-checking the box in the Draggable field.

Click Update Locations

4

6

7

8

9

10

11

5

wplocker.com

Page 19: Wp plugin manual june 2014

WP Google Map Pro User Guide

10. Specify whether you can disable the display of info windows or not by checking or un-

checking the box in the Disable Info Window field.

11. Select a marker image from the groups in order to represent your new location in the

Google map from the Choose Marker Image drop down list. The available options are

Google Maps, Select Group, Group Latest and Famous Places.

12. Click the Update Locations button.

The changes made to the selected location will be updated.

2.4.2 Deleting a Location

To delete a location, follow the steps given below.

1. Navigate to the WP Google Map -> Manage Locations.

The Manage Locations screen will be displayed.

2. Check the box in the row that you wish to delete.

3. Click the Delete button.

2

Click Delete

wplocker.com

Page 20: Wp plugin manual june 2014

WP Google Map Pro User Guide

The selected location will be deleted.

2.4.3 Exporting Locations

To export a location, follow the steps given below.

1. Navigate to the WP Google Map -> Manage Locations.

The Manage Locations screen will be displayed.

Note: You can export all the location records to CSV, XML, JSON and Excel formats.

2. Select the required format from the drop down list above the list of existing locations. The

available formats are Export CSV, Export XML, Export EXCEL and Export JSON. In this

example, the location records are exported to EXCEL format.

3. Click the Apply button.

The standard Save dialog will be displayed. Save the file to the computer.

The selected locations will be exported to Excel format.

2 Click Apply

wplocker.com

Page 21: Wp plugin manual june 2014

WP Google Map Pro User Guide

2.5 Importing Locations

To import locations follow the steps given below.

1. Navigate to the WP Google Map -> Import Locations.

The Import Locations screen will be displayed.

2 Click Import

Locations

wplocker.com

Page 22: Wp plugin manual june 2014

WP Google Map Pro User Guide

2. Click the Browse button in the field to select the required file from the computer.

The standard dialog will be displayed.

3. Select the file that you wish to import, from your computer.

4. Click the Open button.

The selected file will be successfully uploaded.

5. Click the Import Locations button.

The selected file will be successfully imported.

Click Open

3

wplocker.com

Page 23: Wp plugin manual june 2014

WP Google Map Pro User Guide

2.6 Creating a Map

Creating a map is very easy. Simply follow the steps given below.

1. Navigate to the WP Google Map -> Create Map.

The Create Map screen will be displayed.

2

3

4

5

6

wplocker.com

Page 24: Wp plugin manual june 2014

WP Google Map Pro User Guide

The Create Map page has the following fields.

Field Description Example

Map Title Refers to the title of the map in your blog/ website. Chruches

Map Width Refers to the width of the map. 600

Map Height Refers to the height of the map. 500

Map Zoom Level Refers to the various zooming levels of map from 1 to 19. 11

Center Latitude Refers to the central latitude for the map. ---------

2. Enter the title of the map in the Map Title text entry box.

3. Enter the width of the map in the Map Width text entry box.

4. Enter the height of the map in the Map Height text entry box.

5. Select the zoom level of the map from the Map Zoom Level text entry box.

6. Enter the center latitude of the map in the Center Latitude text entry box.

Scroll down to more options.

7

8

9

10

11

13

12

14

15

wplocker.com

Page 25: Wp plugin manual june 2014

WP Google Map Pro User Guide

Additional fields on the Create Map page are given below.

Field Description Example

Center Longitude Refers to the central longitude of Google map. ---------

Choose Map Type Refers to the style of the map. The available

types are roadmap, satellite, hybrid, and terrain.

ROADMAP

Center by Nearest

Location

Specifies whether this location can be set to

center by nearest location or not.

Un-Checked

Turn Off Scrolling

Wheel

Specifies whether the scrolling wheel function

can be disabled or not. By default, Google Maps

are enabled to zoom in and zoom out the map

with mouse scrolls.

Un-Checked

Map Draggable Specifies whether the user can move the map to

a different location or not.

Un-Checked

Enable Visual

Refresh

Specifies whether to give a fresh style to your

Google maps or not. It includes giving new look

to base map tiles, markers, infowindows, and

controls keeping all the functionalities same.

Un-Checked

45° Imagery Specifies whether your satellite/hybrid map

alters its perspective views for 45° imagery

supported locations or not.

Un-Checked

Infowindow Open Specifies whether infowindow is open or not by

default.

Un-Checked

Choose Locations Specifies whether the user can choose a location

or not.

Group Latest

7. Enter the center longitude of Google map in the Center Longitude text entry box.

8. Select the style of the map from the Choose Map Type drop down list. The available

options are ROADMAP, SATELLITE, HIBRID and TERRAIN.

9. Specify whether this location can be set to center by nearest location or not by checking or

un-checking the Center by Nearest Location field.

10. Specify whether the scrolling wheel function can be disabled or not by checking or un-

checking the Turn Off Scrolling Wheel field. By default, Google Maps are enabled to zoom

in and zoom out the map with mouse scrolls.

11. Specify whether the user can move the map to a different location or not by checking or un-

checking the Map Draggable field.

12. Specify whether to give a fresh style to your Google maps or not by checking or un-checking

the Enable Visual Refresh field. It includes giving new look to base map tiles, markers,

infowindows, and controls keeping all the functionalities same.

wplocker.com

Page 26: Wp plugin manual june 2014

WP Google Map Pro User Guide

13. Specify whether your satellite/hybrid map alters its perspective views for 45° imagery

supported locations or not by checking or un-checking the 45° Imagery field.

14. Specify whether infowindow is open or not by default by checking or un-checking the

Infowindow Open field.

15. Specify whether the user can choose a location or not by checking or un-checking the

Choose Locations field.

Scroll down to more options.

16

17

18

21

22

23

24

20

wplocker.com

Page 27: Wp plugin manual june 2014

WP Google Map Pro User Guide

It has the following fields.

Field Description Example

KML Layers Specifies whether the KML layers to display the

geographic information given by the KML link be

enabled or not. The KML link can be entered in a

field that will be generated when you enable the

check box.

Un-Checked

Fusion Table

Layers

Specifies whether the fusion table layers can be

activated or not. If checked, enter the key in the

select field and table name in the from field. This

will generate a shortcode next to your map in the

Manage Maps list. Paste the shortcode in your

page/post to display your map with its

corresponding locations and their detailed

information.

Un-Checked

Traffic Layers Specifies whether the traffic layers can be

represented on your Google map or not. This layer

displays real time traffic conditions of supported

locations.

Un-Checked

Transit Layers Specifies whether the transit layers can be viewed

on Google maps or not. These layers show public

transit network of locations supported by transit

information.

Un-Checked

Weather Layers Specifies whether the layer to represent weather

conditions including temperature and wind speed

of your locations on the map be enabled or not.

The units of temperature and wind speed will

appear as per your selections.

Un-Checked

Bicycling Layers Specifies whether the bicycling layer can be

activated to find any bicycle, bike paths or other

bicycling specific overlays on the map or not. This

will depict bicycling routes by dark green lines and

streets with these routes by light green lines.

Dashed lines stand for paths recommended for

bicycling.

Un-Checked

Panoramio Layers Specifies whether the Panoramio Layer in Google

maps will display a layer of geotagged photos in

the form of photo icons or not. When you click on

any of the photo icons, an infowindow with its

larger photo and detailed information are drawn

out.

Un-Checked

wplocker.com

Page 28: Wp plugin manual june 2014

WP Google Map Pro User Guide

16. In the Layers section, Specify whether the KML layers to display the geographic information

given by the KML link be enabled or not by checking or un-checking the Kml Layer field.

The KML link can be entered in a field that will be generated when you enable the check box.

17. Specify whether the fusion table layers can be activated or not. If checked, enter the key in

the select field and table name in the field. This will generate a shortcode next to your map

in the Manage Maps list. Paste the shortcode in your page/post to display your map with its

corresponding locations and their detailed information by checking or un-checking the

Fusion Table Layer field.

18. Specify whether the traffic layers can be represented on your Google map or not by

checking or un-checking the Traffic Layer field. This layer displays real time traffic

conditions of supported locations.

19. Specify whether the transit layers can be viewed on Google maps or not by checking or un-

checking the Transit Layer field. These layers show public transit network of locations

supported by transit information.

20. Specify whether the layer to represent weather conditions including temperature and wind

speed of your locations on the map be enabled or not by checking or un-checking the

Weather Layer field. The units of temperature and wind speed will appear as per your

selections.

21. If you check the Weather Layer field, the Temperature Unit and Wind Speed Unit fields

are displayed. Select the temperature unit from the available units in the Temperature Units

field. The available options are Celsius and Fahrenheit.

22. Select the wind speed unit from the available units in the wind Speed Units field. The

available options are mph, km/h and m/s.

23. Specify whether the bicycling layer can be activated to find any bicycle, bike paths or other

bicycling specific overlays on the map or not by checking or un-checking the Bicycling

Layer field. This will depict bicycling routes by dark green lines and streets with these routes

by light green lines. Dashed lines stand for paths recommended for bicycling.

24. Specify whether the Panoramio Layer in Google maps will display a layer of geotagged

photos in the form of photo icons or not by checking or –un-checking the Panoramio Layer

field. When you click on any of the photo icons, an infowindow with its larger photo and

detailed information are drawn out.

Scroll down to more options.

wplocker.com

Page 29: Wp plugin manual june 2014

WP Google Map Pro User Guide

It has the following fields.

Field Description Example

Turn Off Pan

Control

Specifies whether to turn off the pan control or not.

The pan control also allows map to rotate 45°

imagery, if available.

Un-Checked

Turn Off Zoom

Control

Specify whether you wish to turn off the zoom control

or not. Normally mouse scrolls and "+/-" buttons on

the map are used to control zoom levels.

Un-Checked

Turn Off Map

Type Control

Specifies whether to turn off the map type control or

not. Keep the option turned-on in order to toggle

between map types, usually roadmap and satellite. By

default, the control appears at the top right corner of

map.

Un-Checked

Turn Off Scale

Control

Specifies whether to turn off the scale control or not. Un-Checked

Turn Off Street

View Control

Specifies whether to turn off the street view control or

not. This control appears on top left corner of the

map in form of a Pegman icon. The icon can be

dragged onto the map to enable street view. Check

mark the box to revoke the control.

Un-Checked

Turn Off

Overview Map

Control

Specifies whether you wish to turn off the overview

control or not. This control is used to display a

thumbnail overview map reflecting current map

viewport within a wider area. By default, the control

appears in its collapsed state in the bottom right

corner of map.

Un-Checked

25

26

27

29

30

28

wplocker.com

Page 30: Wp plugin manual june 2014

WP Google Map Pro User Guide

25. In the Control Settings section, specify whether to turn off the pan control or not by

checking or un-checking the Turn Off Pan Control field. The pan control also allows map to

rotate 45° imagery, if available.

26. Specify whether you wish to turn off the zoom control or not by checking or un-checking the

Turn Off Zoom Control field. Normally mouse scrolls and "+/-" buttons on the map are

used to control zoom levels.

27. Specify whether to turn off the map type control or not by checking or un-checking the

Turn Off Map Type Control field. Keep the option turned-on in order to toggle between

map types, usually roadmap and satellite. By default, the control appears at the top right

corner of map.

28. Specify whether to turn off the scale control or not by checking or un-checking the Turn Off

Scale Control field.

29. Specify whether to turn off the street view control or not by checking or un-checking the

Turn Off Street View Control field. This control appears on top left corner of the map in

form of a Pegman icon. The icon can be dragged onto the map to enable street view. Check

mark the box to revoke the control.

30. Specify whether you wish to turn off the overview control or not by checking or un-checking

the Turn Off Overview Map Control field. This control is used display a thumbnail overview

map reflecting current map viewport within a wider area. By default, the control appears in

its collapsed state in the bottom right corner of map.

Scroll down to more options.

It has the following fields.

30 31 32 33

wplocker.com

Page 31: Wp plugin manual june 2014

WP Google Map Pro User Guide

Field Description Example

Feature Type Refers to the type of feature used in map. Usually a map

consists of a set of features specified by categories like

roads, parks, schools, business etc.

administrative

Element Type Specifies the type of the element used in map. geometry

Color Specify a color of the map style. FFFFFF

Visibility Specifies the visibility of the map style. The available

options are Yes, No and Simplified.

Yes

For each of the selected style, set the following parameters.

31. In the Map Style Setting section, select the type of feature used in map from the Feature

Type drop down list.

32. Select the type of the element used in map from the Element Type drop down list.

33. Enter the color of the map style in the Color text entry box.

34. Select the visibility of the map style from the Visibility drop down list. The available options

are Yes, No and Simplified.

Scroll down for more options.

The Street View Setting section has the following fields.

Field Description Example

Turn On Street

View Setting

Specifies whether the street view control is enabled or

not. If this field is checked, additional options are

displayed.

Checked

Turn On Close

Button

Specifies whether the close button for the street view

control is available or not.

Un-checked

Turn Off links Specifies whether to turn off the link controls for the Un-checked

35

36

37

38

wplocker.com

Page 32: Wp plugin manual june 2014

WP Google Map Pro User Guide

Control street view control or not.

Turn Off Street

View Pan Control

Specifies whether to turn off the street view pan

control or not.

Un-checked

35. In the Street View Settings section, specify whether the street view control is enabled or

not by checking or un-checking the Turn On Street View Setting field. If this field is

checked, additional options are displayed.

36. Specify whether the close button for the street view control is available or not by checking or

un-checking the Turn On Close Button field.

37. Specify whether to turn off the link controls for the street view control or not by checking or

un-checking the Turn Off links Control field.

38. Specify whether to turn off the street view pan control or not by checking or un-checking

the Turn Off Street View Pan Control field.

Scroll down for more options.

The Route Direction Setting section has the following fields.

Field Description Example

Turn On Street

View Setting

Specifies whether the street view setting is enabled or

not. If this is checked, additional options are displayed.

Checked

Route Direction

Stroke Color

Refers to the route direction stroke color. F22800

Route Direction Refers to the route direction stroke opacity. 0.1

39

40

41

42

wplocker.com

Page 33: Wp plugin manual june 2014

WP Google Map Pro User Guide

Stroke Opacity

Route Direction

Stroke Weight

Refers to the route direction stroke weight. 1

39. In the Route Direction Setting section. specify whether the street view setting is enabled or

not by checking or un-checking the Turn On Street View Setting field. If this is checked,

additional options are displayed.

40. Select the to the route direction stroke color from the Route Direction Stroke Color pallet.

41. Select the route direction stroke opacity from the Route Direction Stroke Opacity drop

down list.

42. Select the route direction stroke weight from the Route Direction Stroke Weight drop

down list.

Scroll down for more options.

The Marker Cluster Setting section has the following fields.

Field Description Example

Marker Cluster Specifies whether the marker cluster can be or not. If this

field is checked, additional options are displayed.

Checked

Grid Refers to the grid value of the cluster. The default value

is 15.

--------

Style Refers to the style of the marker cluster. The available

options are Default, People, Conversation and Herat.

Default

Max Zoom

Level

Refers to the maximum zoom level of the marker cluster. 1

43

44

45

46

wplocker.com

Page 34: Wp plugin manual june 2014

WP Google Map Pro User Guide

43. In the Marker Cluster Setting section, specify whether the marker cluster can be or not by

checking or un-checking the Marker Cluster field. If this field is checked, additional options

are displayed.

44. Enter the grid value of the cluster in the Grid text entry box. The default value is 15.

45. Select the style of the marker cluster from the Style drop down list. The available options are

Default, People, Conversation and Herat.

46. Select the maximum zoom level of the marker cluster from the Max Zoom Level drop down

list.

Scroll down for more options.

The Overlay Setting section has the following fields.

Field Description Example

Overlay Specifies whether the overlay is enabled or not. If this field

is checked, additional options are displayed.

Checked

Overlay Border

Color

Refers to the border color of the overlay. The default color

is red.

F22800

Overlay Width Refers to the width value in pixels of the overlay. The ------

47

48

49

50

51

52

53

wplocker.com

Page 35: Wp plugin manual june 2014

WP Google Map Pro User Guide

default value is 200px.

Overlay Height Refers to the height value in pixels of the overlay. The

default value is 200px.

------

Overlay Font

Size

Refers to the font size in pixels of the overlay. The default

value is 16px.

------

Overlay Border

Width

Refers to the width value in pixels of the overlay border.

The default value is 2px.

------

Overlay Border

Style

Refers to the border style of the overlay. The available

options are Default, Solid and Dashed.

Default

47. In the Overlay Setting section, specify whether the overlay is enabled or not by checking or

un-checking the Overlay field. If this field is checked, additional options are displayed.

48. Select the border color of the overlay from the Overlay Border Color pallet. The default

color is red.

49. Enter the width value in pixels of the overlay in the Overlay Width text entry box. The

default value is 200px.

50. Enter the height value in pixels of the overlay in the Overlay Height text entry box. The

default value is 200px.

51. Enter the font size in pixels of the overlay in the Overlay Font Size text entry box. The

default value is 16px.

52. Enter the width value in pixels of the overlay border in the Overlay Border Width text entry

box. The default value is 2px.

53. Select the border style of the overlay from the Overlay Border Style drop down list. The

available options are Default, Solid and Dashed.

Scroll down for more options.

The Limit Panning and Zoom section has the following fields.

54

56

55

57

wplocker.com

Page 36: Wp plugin manual june 2014

WP Google Map Pro User Guide

Field Description Example

Limit Panning

and Zoom

Specifies whether the panning and zooming are limited or

not. If this field is checked, additional options are displayed.

Checked

From Refers to the starting latitude and longitude values for

panning and zooming.

-------

To Refers to the ending latitude and longitude values for

panning and zooming.

-------

Zoom Level Refers to the minimum zooming level. 1

54. In the Limit Panning and Zoom section, specify whether the panning and zooming are

limited or not by checking or un-checking the Limit Panning and Zoom field. If this field is

checked, additional options are displayed.

55. Enter the starting latitude and longitude values for panning and zooming in the From text

entry box.

56. Enter the ending latitude and longitude values for panning and zooming in the To text entry

box.

57. Select the minimum zooming level from the Zoom Level drop down list.

Scroll down for more options.

58

60

62 61

63

66

64

65

59

wplocker.com

Page 37: Wp plugin manual june 2014

WP Google Map Pro User Guide

The Tabs Settings section has the following fields.

Field Description Example

Display Marker

Category

Specifies whether displaying of market category is enabled

or not. If this field is checked, additional options are

displayed.

Checked

Display

Categories Tab

Specifies whether the displaying of categories tab is

enabled or not.

Un-checked

Display

Directions Tab

Specifies whether the displaying of directions tab is enabled

or not.

Un-checked

Display Nearby

Tab

Specifies whether the displaying of nearby tab is enabled or

not.

Un-checked

Tabs Font Color Refers to the font color of the tab. 818392

Category Font

Color

Refers to the font color of the category. 000000

Category Font

Size

Refers to the font size of the category. -------

Location Font

Color

Refers to the font color of the location. 9C9797

Location Font

Size

Refers to the font size of the location. -------

58. In the Tabs Settings section, specify whether displaying of market category is enabled or

not by checking or un-checking the Display Marker Category field. If this field is checked,

additional options are displayed.

59. Specify whether the displaying of categories tab is enabled or not by checking or un-

checking the Display Categories Tab field.

60. Specify whether the displaying of directions tab is enabled or not by checking or un-

checking the Display Directions Tab field.

61. Specify whether the displaying of nearby tab is enabled or not by checking or un-checking

the Display Nearby Tab field.

62. Enter the font color of the tab in the Tabs Font Color text entry box.

63. Enter the font color of the category in the Category Font Color text entry box.

64. Enter the font size of the category in the Category Font Size text entry box.

65. Enter the font color of the location in the Location Font Color text entry box.

66. Enter the font size of the location in the Location Font Size text entry box.

Scroll down for more options.

wplocker.com

Page 38: Wp plugin manual june 2014

WP Google Map Pro User Guide

The List Settings section has the following fields.

Field Description Example

Display Listing Specifies whether the displaying of listing is enabled or not.

If this field is checked, additional options are displayed.

Checked

Locations per

Page

Refers to the locations per page. -------

Display Search

Form Before

Listing

Placeholder

Specifies whether the displaying of search form before

listing placeholder is enabled or not.

Checked

Listing

Placeholder

Refers to the code of listing placeholder. -------

67. In Listing Settings section, specify whether the displaying of listing is enabled or not by

checking or un-checking the Display Listing field. If this field is checked, additional options

are displayed.

68. Enter the locations per page in the Locations per Page text entry box.

67

69

700

68

Click Save Map

wplocker.com

Page 39: Wp plugin manual june 2014

WP Google Map Pro User Guide

69. Specify whether the displaying of search form before listing placeholder is enabled or not by

checking or un-checking the Display Search Form Before Listing Placeholder field.

70. Enter the code of listing placeholder in the Listing Placeholder text entry box.

71. Click the Save Map button.

The new map will be saved.

2.7 Managing Maps

To manage maps, follow the steps given below.

1. Navigate to the WP Google Map -> Manage Map.

The Manage Map screen will be displayed.

It has the following fields.

Field Description Example

Title Refers to the title of the map. With 45 Imagery

wplocker.com

Page 40: Wp plugin manual june 2014

WP Google Map Pro User Guide

Map Width Refers to the width of the map. 600

Map Height Refers to the height of the map. 500

Map Zoom

Level

Refers to the zoom level of the map. 11

Map Type Refers to the type of the map. SATELLITE

Short Codes Refers to the short codes of the map. [put_wpgm id=22]

From here you can edit, delete and manage the map. For more information refer to the

following sections.

Editing a Map

Deleting a Map

2.7.1 Editing a Map

To edit a map, follow the steps given below.

1. Navigate to the WP Google Map -> Manage Map.

The Manage Map screen will be displayed.

2. Check the box in the row of the map record that you wish to edit.

Click Edit

2

wplocker.com

Page 41: Wp plugin manual june 2014

WP Google Map Pro User Guide

3. Click the Edit button.

The details of the selected map will be displayed in edit mode.

From here, you can edit the map details. For more details, refer to Creating a Map section.

2.7.2 Deleting a Map

To delete a map, follow the steps given below.

1. Navigate to the WP Google Map -> Manage Map.

The Manage Map screen will be displayed.

wplocker.com

Page 42: Wp plugin manual june 2014

WP Google Map Pro User Guide

2. Check the box in the row of map record that you wish to delete.

3. Click the Delete button.

The selected map will be removed.

2.8 Drawing on a Map

To draw on a map, follow the steps given below.

1. Navigate to the WP Google Map -> Drawing.

The Drawing on Maps screen will be displayed.

Click Delete

2

wplocker.com

Page 43: Wp plugin manual june 2014

WP Google Map Pro User Guide

It has the following fields.

Field Description Example

Select Your

Maps

Specifies the type of the map from the available list. Enable Visual

Refresh

Fill Color Specifies the fill color to apply for a more customized

experience.

1938FF

Opacity Refers to the opacity to apply for a more customized

experience.

1

Stroke Color Refers to the stroke color to apply for a more customized

experience.

323FB8

Thickness Refers to the thickness to apply for a more customized

experience.

2

2. Select the map that you wish to draw from the Select Your Map drop down list.

3. Select the color to be filled to the map from the Fill Color pallet.

4. Enter the opacity for the map in the Opacity text entry box.

5. Select the stroke color for the map from the Stroke Color pallet.

2

Click Save Drawing

3 4 5 6 7

wplocker.com

Page 44: Wp plugin manual june 2014

WP Google Map Pro User Guide

6. Enter the thickness of the map in the Thickness text entry box.

7. Click the Apply button.

8. Draw on the map to depict various routes and regions.

9. Click the Save Drawing button.

The drawing on the map will be saved.

2.9 Adding a Marker Category

To add a marker category, follow the steps given below.

1. Navigate to the WP Google Map -> Add Marker Category.

The Add Marker Category screen will be displayed.

It has the following fields.

Field Description Example

Category Refers to the name of the marker category title. Aircraft

2

3

Click Save Marker Category

wplocker.com

Page 45: Wp plugin manual june 2014

WP Google Map Pro User Guide

Title

Choose

Marker

Image

Refers to the marker image relevant to the category. You can

upload the required marker image file from your computer.

---------

2. Enter the title for the marker category in the Category Title text entry box.

3. Choose the image for the marker category by clicking the Upload Marker Image link. Select

the image file from your computer.

4. Click the Save Marker Category button.

The new marker category will be saved.

2.10 Managing Marker Categories

1. Navigate to the WP Google Map -> Manage Marker Categories.

The Manage Marker Categories screen will be displayed.

From here you can edit, delete and manage the marker category. For more information refer to

the following sections.

Editing a Marker Category

Deleting a Marker Category

wplocker.com

Page 46: Wp plugin manual june 2014

WP Google Map Pro User Guide

2.10.1 Editing a Marker Category

To edit a marker category, follow the steps given below.

1. Navigate to the WP Google Map -> Manage Marker Categories.

The Manage Marker Categories screen will be displayed.

2. Check the box in the row of the marker category that you wish to edit.

3. Click the Edit button.

The details of the selected category will be displayed in edit mode.

2

Click Edit

wplocker.com

Page 47: Wp plugin manual june 2014

WP Google Map Pro User Guide

4. Edit the title for the marker category in the Category Title text entry box.

5. Choose the image for marker category by clicking the Upload Marker Image link.

6. Click the Update Marker Category button.

The changes made to the selected marker category record will be updated.

2.10.2 Deleting a Marker Category

To delete a marker category, follow the steps given below.

1. Navigate to the WP Google Map -> Manage Marker Categories.

The Manage Marker Categories screen will be displayed.

4

5

Click Update

Marker Category

wplocker.com

Page 48: Wp plugin manual june 2014

WP Google Map Pro User Guide

2. Check the box in the row of the marker category that you wish to delete.

3. Click the Delete button.

The selected marker category will be deleted.

2.11 Adding Route

To add a route, follow the steps given below.

1. Navigate to the WP Google Map -> Add Route.

The Add Route screen will be displayed.

Click Delete

2

wplocker.com

Page 49: Wp plugin manual june 2014

WP Google Map Pro User Guide

It has the following fields.

Field Description Example

Route Title Refers to the title of the route. Sydney Street

Stroke Color Refers to the stroke color of the route direction. The

default color is blue.

8CAEF2

Stroke Opacity Refers to the stroke opacity of the route direction. 1

Stroke Weight Refers to the stroke weight of the route direction. 10

Travel Modes Refers to the travel modes used on the route. Driving

Unit Systems Refers to the unit systems used for the route direction.

2

3

4

5

6

7

8

9

11

10

12

wplocker.com

Page 50: Wp plugin manual june 2014

WP Google Map Pro User Guide

Draggable Specifies whether the marker can be draggable or not.

Metric

Display Custom

Marker

Specifies whether the custom markers can be displayed

or not.

Un-checked

Optimize

Waypoints

Specifies whether the waypoint optimization is enabled

or not.

Checked

Start Location Refers to the starting location of the route.

208, Broadway

End Location Refers to the ending location of the route.

208, Broadway

2. Enter the title of the route in the Route Title text entry box.

3. Select the route direction stroke color from the Stroke Color pallet.

4. Select the stroke opacity of the route direction from the Stroke Opacity drop down list.

5. Select the stroke weight of the route direction from the Stroke Weight drop down list.

6. Select the mode of the travel from the Travel Modes drop down list. The available options

are Driving, Walking, Bicycling and Transit.

7. Select the unit system from the Unit Systems drop down list. The available options are

Metric and Imperial.

8. Specify whether the marker is draggable by user or not by checking or un-checking the

Draggable field.

9. Specify whether the custom markers can be displayed or not by checking or un-checking

the Display Custom Marker field.

10. Specify whether the optimize waypoints are enabled or not by checking or un-checking the

Optimize Waypoints field.

11. Select the starting location of the route from the Start Location drop down list.

12. Select the ending location of the route from the End Location drop down list.

Scroll down for more options.

wplocker.com

Page 51: Wp plugin manual june 2014

WP Google Map Pro User Guide

13. In the Way Points section, select the type of the filter from the Filter drop down list. The

available options are Select Group, Church, Embassy and Aircraft.

14. Check the required route options that you wish to add.

15. Click the Save Route button.

The route will be added.

2.12 Manage Routes

1. Navigate to the WP Google Map -> Manage Routes.

The Manage Routes screen will be displayed.

13

14

Click Save Route

wplocker.com

Page 52: Wp plugin manual june 2014

WP Google Map Pro User Guide

It has the following fields.

Field Description Example

Title Refers to the title of the route. Newyork Street

Start

Location

Refers to the starting location of the route.

209 Broadway, New York,

US

End

Location

Refers to the ending location of the route.

1157 Lexington Ave, New

York city, US

From here you can edit, delete and manage the routes. For more information refer to the

following sections.

Editing a Route

Deleting a Route

2.12.1 Editing a Route

To edit a route, follow the steps given below.

1. Navigate to the WP Google Map -> Manage Routes.

The Manage Routes screen will be displayed.

wplocker.com

Page 53: Wp plugin manual june 2014

WP Google Map Pro User Guide

2. Check the box in the row of the route that you wish to edit.

3. Click the Edit button.

The details of the selected route will be displayed in edit mode.

2

Click Edit

wplocker.com

Page 54: Wp plugin manual june 2014

WP Google Map Pro User Guide

4. Edit the title of the route in the Route Title text entry box.

5. Select the route direction stroke color from the Stroke Color pallet.

6. Select the stroke opacity of the route direction from the Stroke Opacity drop down list.

7. Select the stroke weight of the route direction from the Stroke Weight drop down list.

8. Select the mode of the travel from the Travel Modes drop down list. The available options

are Driving, Walking, Bicycling and Transit.

9. Select the unit system from the Unit Systems drop down list. The available options are

Metric and Imperial.

2

3

4

5

6

7

8

9

11

10

12

wplocker.com

Page 55: Wp plugin manual june 2014

WP Google Map Pro User Guide

10. Specify whether the marker is draggable by user or not by checking or un-checking the

Draggable field.

11. Specify whether the custom markers can be displayed or not by checking or un-checking

the Display Custom Marker field.

12. Specify whether the optimize waypoints are enabled or not by checking or un-checking the

Optimize Waypoints field.

13. Select the starting location of the route from the Start Location drop down list.

14. Select the ending location of the route from the End Location drop down list.

Scroll down for more options.

15. In the Way Points section, select the type of the filter from the Filter drop down list. The

available options are Select Group, Church, Embassy and Aircraft.

16. Check the available options that you wish to add to the route.

13 14

Click Update Route

wplocker.com

Page 56: Wp plugin manual june 2014

WP Google Map Pro User Guide

17. Click the Update Route button.

The selected route will be updated.

2.12.2 Deleting a Route

To delete a route, follow the steps given below.

1. Navigate to the WP Google Map -> Manage Routes.

The Manage Routes screen will be displayed.

4. Check the box in the row of the route that you wish to delete.

5. Click the Delete button.

The selected route will be deleted.

2.13 Configuring Google WP Map Pro Settings

To configure Google WP Map Pro settings, follow the steps given below.

Click Delete

2 wplocker.com

Page 57: Wp plugin manual june 2014

WP Google Map Pro User Guide

1. Navigate to the WP Google Map -> Settings.

The Google WP Map Pro Settings screen will be displayed.

Click Save Changes

2

3

4

5

6

wplocker.com

Page 58: Wp plugin manual june 2014

WP Google Map Pro User Guide

It has the following fields.

Field Description Example

Zoom Level Refers to the zoom level value for your Google map. The zoom

level value ranges between 1 and 19, default being 14.

4

Center

Latitude

Refers to the latitude value for the center location of the map.

------

Center

Longitude

Refers to the longitudinal value for the center location of the

map.

------

Select

Language

Refers to the language to be used on the WP Google Map

Plugin supports multiple languages for Google maps. Default

language is English.

English

Choose Post

Types

Refers to the type of post in which map is displayed. The

available options are Post, News, Review and Events.

2. In the General Settings section, enter the zoom level value for your Google map in the

Zoom Level text entry box. The zoom level value ranges between 1 and 19, default being 14.

3. Enter the latitude value for the center location of the map in the Center Latitude text entry

box.

4. Enter the longitudinal value for the center location of the map in the Center Longitude text

entry box.

5. Select the language to be used on the WP Google Map Plugin supports multiple languages

for Google maps from the Select Language drop down list. The default language is English.

6. Select the type of post in which map is displayed from the Choose Post Types option. The

available options are Post, News, Review and Events.

7. Click the Save Changes button.

The changes made to the Google WP Map Pro Settings will be saved.

2.14 Using Shortcodes

The WP Google Map plugin provides shortcodes which are helpful for a non-programmer and

programmer to display maps dynamically. Below are the shortcode combinations you may use.

The possibilities are endless to create combinations of shortcodes.

To use short codes, follow the steps given below.

wplocker.com

Page 59: Wp plugin manual june 2014

WP Google Map Pro User Guide

1. Navigate to the WP Google Map in the left section.

The WP Google Map screen will be displayed.

The standard format for short code is as below.

[display_map marker1="latitude | longitude | infowindow message | draggable | clickable

| marker group id"]

Latitude - Enter latitude of the location.

Longitude - Enter longitude of the location.

Infowindow Message (optional) - Enter message to display by click on marker. HTML

Tags are allowed.

Draggable (optional) - Make this marker draggable. The available options are True and

False. Default is False.

wplocker.com

Page 60: Wp plugin manual june 2014

WP Google Map Pro User Guide

Clickable (optional) - Make this marker clickable. The available options are True and

False. Default is True.

Marker Group (optional) - Provides id of the group. You can retrieve id from Manage

Marker Categories page.

Note: You can display any number of markers using this shortcode.

Below are few examples to understand it better.

Single Location: [display_map marker1="39.639538|-101.527405 | This is first marker's

info window message | false | true"]

Multiple Locations: [display_map marker1="39.639538|-101.527405"

marker2="39.027719|-111.546936"]

2.15 Displaying Map Using Address

Standard format for shortcode is as below.

[display_map address1=" New Delhi, india | infowindow message | draggable | clickable |

marker group id"]

Address - Enter address of the location.

Infowindow message (optional) - Enter message to display by click on marker. HTML

Tags are allowed.

Draggable (optional) - Make this marker draggable. options is true/false. Default is false.

Clickable (optional) - Make this marker clickable. options is true/false. Default is true

Marker Group (optional)- Provides id of the group. You can retrive id from Manage

Marker Categories page.

So you can display any number of markers using this shortcode.

Below are few examples to understand it better.

Single Location : [display_map address1="New Delhi, india | This is first marker's info

window message | false | true"]

Multiple Locations : [display_map address1="New Delhi, India" address2="Mumbai,

India"]

wplocker.com

Page 61: Wp plugin manual june 2014

WP Google Map Pro User Guide

2.16 Displaying Map in a Post /Page

Note: In order to display a map in a post or page, you must use the shortcode of the map that

you created using the Google WP Map Pro plugin. Copy the short code and then paste it in

the post.

To do so, follow the steps given below.

1. Navigate to WP Google Map - > Manage Map.

The Manage Map screen will be displayed.

2. Copy the shortcode of the map that you wish to add in the post, under the Shortcodes

column. You can select the short code and then press Ctrl+C shortcut key on the keyboard.

The selected shortcode will be copied to the clipboard.

3. Now, navigate to the Posts -> Add New.

The Add New Post screen will be displayed.

wplocker.com

Page 62: Wp plugin manual june 2014

WP Google Map Pro User Guide

4. Enter the title for the map in the Title text entry box.

5. Paste the copied short code in the text entry box. You can press Ctrl+V shortcut key on the

keyboard.

Now you can add geo-tags to the post.

Geo-tagging is the process of adding geographical information (ADDRESS) to various media

(PAGES OR POSTS) in the form of metadata (CUSTOM FIELDS). It is known as Geo-tags because

you specify the address in the posts/pages using custom fields.

Click View Post

2

3

4

5

6

7

wplocker.com

Page 63: Wp plugin manual june 2014

WP Google Map Pro User Guide

6. Select the name of the location from the Enter Location drop down list.

7. The Latitude and Longitude fields will be automatically populated based on the location

you select.

8. Select the marker group from the Marker Group drop down list.

9. Select the type of map from the Select Map drop down list.

10. Click the View Post button to test the post.

The post with the map will be displayed.

11. Review the map and its function.

12. Then back on the post, save the post and publish it.

Your post with map created from the Google WP Map Pro plugin will be published.

2.17 Displaying Map in Sidebar

To display a map in the sidebar, follow the steps given below.

wplocker.com

Page 64: Wp plugin manual june 2014

WP Google Map Pro User Guide

1. Navigate to Appearance -> Widgets.

The Widgets screen will be displayed.

Scroll down to WP Google Map Pro option in the left column.

wplocker.com

Page 65: Wp plugin manual june 2014

WP Google Map Pro User Guide

2. Drag the WP Google Map Pro widget from left column to the Main Sidebar section in the

right column.

The WP Google Map Pro widget to display the map will be displayed.

wplocker.com

Page 66: Wp plugin manual june 2014

WP Google Map Pro User Guide

3. Select the map that you wish to add, from the Select Your Map drop down list.

4. Click the Save button.

The selected map from WP Google Map Pro will be added to the side bar.

Click Save

3

wplocker.com

Page 67: Wp plugin manual june 2014

WP Google Map Pro User Guide

3. LIVE EXAMPLES

3.1 100% Responsive Google Map

The Google WP Map Pro plugin provides 100% responsive Google Maps. It adjusts itself to any

window size and device.

For live example, refer to the following link:

http://www.flippercode.com/wp-google-map-pro-examples/

wplocker.com

Page 68: Wp plugin manual june 2014

WP Google Map Pro User Guide

3.2 Filter Locations by Categories

The Google WP Map Pro plugin allows you to display locations under the map with a search box.

You can search category, latitude, longitude, location title or address in the listing using this search

box. Listing is ajax based, paginated and configurable from the backend.

For live example, refer to the following link:

http://www.flippercode.com/filtration-using-categories-on-google-maps/

3.3 Styled Google Map Skins

The Google WP Map Pro plugin allows you to create styled Google map skins. You can display

and manage your custom map and implement your own map skin.

wplocker.com

Page 69: Wp plugin manual june 2014

WP Google Map Pro User Guide

For live example, refer to the following link:

http://www.flippercode.com/styled-google-map-skin/

3.4 Google Map Street View

The Google WP Map Pro plugin allows you to display street view of any location. The Street

View provides panoramic 360 degree views from the selected road throughout its coverage

area.

wplocker.com

Page 70: Wp plugin manual june 2014

WP Google Map Pro User Guide

For live example, refer to the following link:

http://www.flippercode.com/google-map-street-view-using-wordpress-plugin/

3.5 Google Map Weather Layer

The Google WP Map Pro plugin allows you to set the weather layer over your map. It displays

the current temperature and weather conditions with the help of icons denoting sun, clouds,

rain etc on your Google Map. An info window with detailed weather conditions for the next 4

days like humidity and wind conditions pops up when you click the weather icon.

wplocker.com

Page 71: Wp plugin manual june 2014

WP Google Map Pro User Guide

For live example, refer to the following link:

http://www.flippercode.com/google-map-weather-layer-using-wordpress-plugin/

3.6 Display Posts, Pages or Custom Post Types on Google Maps

The Google WP Map Pro plugin allows you to display posts, pages or custom post types on

google map.

wplocker.com

Page 72: Wp plugin manual june 2014

WP Google Map Pro User Guide

For live example, refer to the following link:

http://www.flippercode.com/display-postspages-or-custom-post-types-on-google-maps/

3.7 Google Map Traffic Layer

The Google WP Map Pro plugin allows you to enable traffic layer over your Google Map. The

traffic layers on Google Maps exhibit real time traffic conditions for locations that support it. The

Google map below shows very high traffic by black/red, yellow depicts average and green color-

codes show low traffic conditions.

wplocker.com

Page 73: Wp plugin manual june 2014

WP Google Map Pro User Guide

For live example, refer to the following link:

http://www.flippercode.com/google-map-traffic-layer-using-wordpress-plugin/

3.8 Google Map Bicycling Layer

The Google WP Map Pro plugin allows you to create the Bicycling layer to find any bicycle or

bike paths available. This layer displays bike paths, suggested bike routes and other overlays

specific to bicycling on top of the map. In the map depicted, the bicycling routes are indicated

by dark green lines and streets with these routes are shown by light green lines. Dashed lines

stand for paths recommended for bicycling.

wplocker.com

Page 74: Wp plugin manual june 2014

WP Google Map Pro User Guide

For live example, refer to the following link:

http://www.flippercode.com/google-map-bicycling%20-layer-using-wordpress-plugin/

3.9 Google Map Panoramic Layer

The Google WP Map Pro plugin allows you to create the Panoramic Layer in Google Maps. This

consists of a layer of geotagged photos in the form of large and small photo icons. You can click

on any photo icon to get an info window with a larger photo and detailed information about it.

wplocker.com

Page 75: Wp plugin manual june 2014

WP Google Map Pro User Guide

For live example, refer to the following link:

http://www.flippercode.com/google-map-panoramic-layer-using-wordpress-plugin-2/

3.10 Google Map Overlays using WordPress Plugin

The Google WP Map Pro plugin allows you to illustrate a normal 2D roadmap with overlays

bound to certain latitude/longitude coordinates. You can customize the overlays with options

like border color, border style, overlay width, overlay height, font size etc.

wplocker.com

Page 76: Wp plugin manual june 2014

WP Google Map Pro User Guide

For live example, refer to the following link:

http://www.flippercode.com/google-map-overlays-using-wordpress-plugin/

3.11 Google Map Satellite with Overlays

The Google WP Map Pro plugin allows you to create the satellite map that displays locations in

form of images from satellites. You can customize such maps with overlays.

wplocker.com

Page 77: Wp plugin manual june 2014

WP Google Map Pro User Guide

For live example, refer to the following link:

http://www.flippercode.com/google-map-satellite-with-overlays-using-wordpress-plugin/

3.12 Google Map 45 degree Imagery

The Google WP Map Pro plugin enables your map to alter its perspective view for the locations

that support 45° Imagery in Google Maps. It allows you to rotate the image using a compass

wheel around the Pan control, also rotate the map clockwise through supported directions by

means of a rotate control between the Pan and Zoom controls. You can use the toggle control

under the Satellite control/label to display the 45° perspective view. The 45 degree imagery is

supported only at high zoom levels in the satellite and hybrid maps. Zooming out will revert all

the changes.

wplocker.com

Page 78: Wp plugin manual june 2014

WP Google Map Pro User Guide

For live example, refer to the following link:

http://www.flippercode.com/google-map-45-degree-imagery-using-wordpress-plugin/

3.13 Google Map without 45 degree Imagery

The Google WP Map Pro plugin allows you to create maps without 45 degree imagery.

wplocker.com

Page 79: Wp plugin manual june 2014

WP Google Map Pro User Guide

For live example, refer to the following link:

http://www.flippercode.com/google-map-45-degree-imagery-using-wordpress-plugin/

3.14 Turn Off Scrolling Wheel on Google Map

The Google WP Map Pro plugin allows you to disable the scrolling wheel on Google Map. By

default, the scrolling wheel in Google maps is enabled that zooms in and zooms out the map as

mouse scrolls.

wplocker.com

Page 80: Wp plugin manual june 2014

WP Google Map Pro User Guide

For live example, refer to the following link:

http://www.flippercode.com/turn-off-scrolling-wheel-on-google-map-using-wordpress-plugin/

3.15 Enable Visual Refresh on Google Map using WordPress Plugin

The Google WP Map Pro plugin allows you to enable visual refresh on maps. This gives a new

look to Google maps including the base map tiles, default marker, info window style and style

refresh of the controls keeping the same functionalities of custom markers, overlays, and map

types.

wplocker.com

Page 81: Wp plugin manual june 2014

WP Google Map Pro User Guide

For live example, refer to the following link:

http://www.flippercode.com/enable-visual-refresh-on-google-map-using-wordpress-plugin/

3.16 Google Map Marker Cluster

The Google WP Map Pro plugin allows you to create marker Cluster in Google Maps indicating

multiple nearby locations marked up in an aggregated form in a map. You can create and

display marker clusters for multiple locations using draggable markers over the same Google

map.

wplocker.com

Page 82: Wp plugin manual june 2014

WP Google Map Pro User Guide

For live example, refer to the following link:

http://www.flippercode.com/google-map-marker-cluster-using-wordpress-plugin/

3.17 Google Map KML Layers using WordPress Plugin

The Google WP Map Pro plugin allows you to create KML layers on Google Map to display the

geographic information given by the KML link.

wplocker.com

Page 83: Wp plugin manual june 2014

WP Google Map Pro User Guide

For live example, refer to the following link:

http://www.flippercode.com/implement-kml-layers-on-google-map-using-wordpress-plugin/

3.18 Display Polygons on Google Map

The Google WP Map Pro plugin allows you to create a polygon in Google Maps for a clear

representation of a region with one or more paths. You can customize their border with

background color.

wplocker.com

Page 84: Wp plugin manual june 2014

WP Google Map Pro User Guide

For live example, refer to the following link:

http://www.flippercode.com/display-polygons-on-google-map-using-wordpress-plugin/

3.19 Display Polylines on Google Map

The Google WP Map Pro plugin allows you to create Polylines on Google Maps to display path

between different locations. You can also customize the style of polyline, stroke color, stroke

weight etc.

wplocker.com

Page 85: Wp plugin manual june 2014

WP Google Map Pro User Guide

For live example, refer to the following link:

http://www.flippercode.com/display-polylines-on-google-map-using-wordpress-plugin/

3.20 Display Route Direction on Google Map

The Google WP Map Pro plugin allows you to display route directions between different

locations on a Google map. Drag and drop the markers to change the end locations or the route

itself.

wplocker.com

Page 86: Wp plugin manual june 2014

WP Google Map Pro User Guide

For live example, refer to the following link:

http://www.flippercode.com/display-route-direction-on-google-map-using-wordpress-plugin/

3.21 Location Listings on Google Map

The Google WP Map Pro plugin allows you to create multiple location listings on Google Map.

wplocker.com

Page 87: Wp plugin manual june 2014

WP Google Map Pro User Guide

For live example, refer to the following link:

http://www.flippercode.com/filtration-using-categories-on-google-maps/

wplocker.com