Get fresh WordPress Content delivered in your inbox with warpspeed!

learn wordpress wplift wordpress rocket

If you run any kind of website with a physical presence then embedding a Google map on your site is a great way to allow customers to locate you. Adding a usable map to your contact page is a great way to boost usability as people can follow this on their smartphones to get directions, zoom out and move the map around to get a better feel for your location. There are other reasons for embedding a map on your site also, maybe you are a travel blogger who would like to show readers their destinations etc.

Google maps can be a little tricky to get working so thats where the MapifyPro plugin comes in handy – this plugin allows you to embed maps within WordPress by address or Longitude/Latitude and it allows you to setup custom markers, tooltips and even change the map graphic to something custom.

Google Maps Plugin

In this post Im going to be taking a look at how to install and setup this plugin and see how easy it is to use and what the results are.

Visit MapifyPro »

Installation & Setup

Once you have uploaded and activated the MapifyPro plugin you will see it has added a new menu item named “MapifyPro” with a few options – “Maps”, “Map Locations”, “Location Tags” and “Bulk Upload”. To get started you should visit the “Maps” link and then click “Add New” to get started creating your first map.

map-1

Here you have a chance to choose between an image map and a normal Google map, if you choose image you can then upload your own custom graphics for the map. You can choose to upload acustom map pin or use the built-in graphic, you can choose colors for things like background color, tooltip color, animations and so on.

After setting up your map options, you can then choose some Google Maps-specific options like the mode ( Road, Satellite, Hybrid, Terrain ) and a style and search radius.

Map Settings 2

Once you are done, hit “Publish” and then you can add a location to the map you just created.

Adding a Map Location

To add a location you visit the “Map Locations” link and click “Add New” where you can name the location, choose a map ( the one you just created ), add a tooltip for your location and enter the test for it, you can enable popups and even add a video within it from Youtube or Vimeo, add images, enable social sharing and finally you enter your address to add your location to the map.

Map Location

Displaying a Map

To display your map within a post or page, you simply visit the “Maps” link and grab the shortcode to use which looks like this :

[custom-mapping map_id=”2860″ height=”300″]

Save the page and visit it on your site to see the map :

Map displayed on site

Here is a shot from the demo site where you can see a range of custom markers and tooltips :

Customized Google maps

Features

This plugin has quite a lot of available options, here is a full run-down of what’s available:

  • Unlimited maps organized into intuitive libraries
  • Custom Image Mode! Use images instead of Google Maps, while maintaining all of Google Maps’ familiar features
  • Use Snazzy maps and other customizations in Google Maps Mode
  • Map Clusters group nearby locations and keep your maps nice and tidy
  • Create maps and locations via familiar posts/pages
  • Place maps on your pages/posts with a simple shortcode that is automatically generated for each map
  • Add locations via Address, Longitude/Latitude, or by simply clicking on the map
  • Plot off road pinpoints/markers
  • Filtering and sorting options via custom tags, dropdown filters, and Zip/City search
  • Location-based details: Add extended details, video, and photo galleries to any location.
  • Styling options for tooltip colors, and gallery backgrounds
  • You choose tooltip behavior to close automatically or manually
  • Unique pinpoint graphics on each location as needed (over 100 free map icons included!)
  • Social media sharing of map locations.
  • Provide directions to any direction via a simple shortcode
  • Bulk uploading via .CSV
  • No branding or linkbacks to MapifyPro
  • Latest Google API and other tech
  • Mobile and Tablet ready: Integrates within your responsive website and supports touch/tap/swipe interaction on devices
  • GPS support on mobile devices provides directions to any location on your maps

Pricing

There are two pricing options for this plugin, you can get a basic version from Codecanyon for $14 which is good for one site or you can get the pro version on the site for $49 which  has a load of extra options and if you need an unlimited site license of the pro version that is $199.

MapifyPro Pricing

Conclusion

This is a great example of a plugin which makes something quite complicated and simplifies it for the user – it was extremely easy to install and intuitive to setup. I like the fact you can use custom images for the map and markers etc – this gives you the option to really make your map unique and match it in with your site’s design.

Give this plugin a go if you are looking for something to add customized Google maps to WordPress for you.

Visit MapifyPro »

Published:

Last updated on:

Oliver Dale is the founder of Kooc Media, An Internet Company based in Manchester, UK. I founded WPLift and ThemeFurnace, find out more on my Personal Blog. Thanks!

0 thoughts on “How To: Add Customized Google Maps to WordPress with MapifyPro Plugin

  1. Pingback: WordPress Magic - TEN THINGS TRENDING Jul 18 2014 |
  2. Pingback: The WhiP Newsletter #43 | Dev
Join 40,000 WordPress Astronauts
AND GET OUR LATEST CONTENT IN YOUR INBOX WITH WARPSPEED

We will never spam you.
close-link
siteground coupon
Get 60% Off the No. 1 WordPress Hosting!