Wednesday, April 15, 2020

How to Add Google Maps to WordPress (Beginners Guide)

Whether you run a business, organization, event, or just need to showcase a map for any other reason, it can be helpful to know how to add Google Maps to WordPress.Whats more, with the right plugin, you can even create customized and interactive maps that better showcase your physical location or other important information.In this guide, well introduce you to the Intergeo Google Maps plugin, an excellent and beginner-friendly tool. Then well show you how to use it to add Google Maps to WordPress. Lets take a look! Google Maps Plugin by Intergeo Author(s): ThemeisleCurrent Version: 2.3.1Last Updated: May 23, 2019intergeo-maps.zip 88%Ratings 621,748Downloads WP 3.5+Requires The easiest way to add Google Maps to WordPress is to use the right plugin, such as Intergeo. ThemeIsle built this plugin to help users quickly create and customize maps to meet their needs. The powerful UI map builder lets you create as many maps as youd like, as well as save, edit, and even clone them.Ke y Features:Customize many elements of your maps, including position, zoom level, and much more.Style your maps through color schemes and other options.Add multiple locations and markers to your maps.Easily organize a library of your maps.Price: The base Intergeo Google Maps Plugin is free. Theres also  a Pro version, with additional features such as map overlays, customizable routes, and AdSense integration.How to add Google Maps to WordPress (in 3 steps)Now, well show you how to create a map for your website. First, youll want to install the free version of Intergeo  on your WordPress site like you would any other plugin. Then, simply follow the steps below to add Google Maps to WordPress!Step 1: Add your Google Maps API key to WordPressOnce youve installed Intergeo, there will be a new section called Intergeo Maps under the Media tab in your dashboard. When you visit it, you should see an alert prompting you to add your API key, which must be done before you start creating map s:To get this key, visit the Google APIs Dashboard. Assuming you already have a Google account, you should be able to access this dashboard without needing to sign up for anything.Inside the Google APIs dashboard, select the blue Create Project button near the top of the page:Choose Create on the next screen. Then, youll be able to pick a name for your project:Click on Create once more, and youll be taken back to the dashboard. Select Enable APIs and Services near the top of the screen and search the API Library for Google Maps JavaScript API. Once youve found it, select Enable:On the next screen, click on the Create Credentials button in the top-right corner.Then on the next page, select What credentials do I need?  Youll be presented with an API key, which you can now copy.Return to your WordPress site and select the link in Please add an API Key here. Paste your key into the Maps API Key box:Dont forget to save your changes! Now, youre ready to start building your map.Step 2: C reate a new mapTo create your first map, select Add New from the Intergeo Maps section. Youll immediately be presented with a lot of options:The first thing youll probably want to do is select the Add Marker button. This lets you determine a location for the map and place a marker. You can give the marker a title, choose a style for it, and enter an address:In the text box, you can also add and format text that will display when a user clicks on the marker:After that, you can start customizing your map using some of the other options within the map builder. Lets walk through each tab one by one.Positioning ZoomingTo set a certain zoom level and position for your map, you can simply zoom the sample map in and out and drag it wherever youd like. The way you set it up in the editor is how it will display on your site.You can also change the type of map, and decide whether you want users to be able to drag and zoom it themselves.ControlsIn the Controls section, you can decide what kind of choices are available to users. This includes whether they can pan the map (pan means to drag the map to change its location) and if they have a street view option.StylesIn the  Styles section, you can tweak what your map looks like. You can change the width and height of the container, as well as add styling. You can also choose from several predefined map styles or even create your own.If you opt for the premium version of Intergeo, youll have access to additional tabs and settings. However, by tweaking the above settings, you should be able to create a map thats both stylish and useful to your visitors.Step 3: Place the map on your siteOnce your map is tweaked to perfection, dont forget to save it. Once you do, youll see it appear on the main Intergeo Maps page, along with buttons to edit, copy, or delete the map. There will also be a text field:This field contains a shortcode you can use to insert your map on your site. You can place it on a page or post, or even in your s idebar or footer using a Text widget. Simply copy the shortcode and paste it into an editor:Thats it! Your map will now display perfectly on the front end of your site:You can use this method to place the same map in multiple places or even add a variety of maps to your site. Thats all it takes to add Google Maps to WordPress.ConclusionShow, dont tell is a smart rule to follow on your website. Including a map, for example, shows visitors exactly how your business or organization fits into their community. Maps are a more compelling way to encourage people to visit your physical location than simply providing an address – especially when they are interactive.To take advantage of this technique on your own site, you can use the Intergeo plugin to add Google Maps to WordPress. Just follow these three steps:Add your Google Maps API key to WordPress.Create a new map and configure it using the plugins settings.Place the map on your site using the provided shortcode.Do you have any question about how to use the Intergeo Google Maps plugin effectively? Ask us anything in the comments section below! How to add customized Google Maps to #WordPress