Introduction
Do you want to add Google Map to the WordPress site to make the information clearer? If your answer is yes, we will provide you with 2 methods to do that in this blog today:
- Embedding a Google Map in WordPress manually
- Adding a Google Map via a plugin
Now, let’s explore each method one by one.
The ways to add Google Map to WordPress website
Embedding a Google Map in WordPress manually
This is one of the easiest ways to insert a Google Map in any post, page, or template. All you need to do is go to Google Maps website, then enter the name or address you want to add on the search bar. After that, let’s click on the Share icon.
A Share popup will appear on the screen. So, you can see 2 sections: send a link and embed a map. Let’s select Embed a map.
You can change the size of the map by clicking on the Medium button. There will be 4 options for you to choose: Small, Medium, Large, and Custom Size. After deciding the map’s size you need, just simply press on Copy HTML button to copy the embed code.
Now, let’s turn back to your WordPress admin dashboard and add the code in the post, page, or template you want.
For example, we want to add to a new post, so we just go to Posts -> Add New. Next, we select the Text part to paste the map code.
When we go back to the Visual section, we will see a google map displayed with the size we chose. After finishing the content of the post, don’t forget to press Publish for the new posts and Update for published posts.
Using a plugin to add a google map to WordPress
If you just want to insert a map to one location of your site, the method below is suitable for you. However, in case you hope to embed google maps frequently in most posts, it’s a good idea for you to use a plugin to do that.
Actually, there are many WordPress Google Map Plugins in the market, but we decide to guide you on the way how to use MapPress Maps for WordPress.
First of all, you need to install this plugin by choosing Plugins -> Add New. After that, search the name of the plugin on the search bar, then press the Install Now -> Activate button.
After activating the MapPress plugin, a Welcome popup will appear to ask you to confirm some information. In order to add the Google map to your site, let’s choose the Google section, then click on the Next button.
Now, you need to create and get Google API Key by pressing Get an API Key.
A new tab will appear to support you to get a Google Maps API Key. Just simply choose Create Project box.
In this part, you need to click the box to show your agreement with the service of Google Cloud Platform. Besides that, don’t forget to set the Country of residence. Then, let’s press on Agree and continue to move on to the next step.
Now, you are able to create a new API Key by going to Create Credentials -> API key.
You can freely change the name of the API key to easily remember. Moreover, in the application restrictions section, let’s choose the None option. Don’t forget to save all your changes. Finally, you can get your API key at the box API Key.
We will turn back to the admin area. With the aim of adding a Google API key, let’s go to MapPress -> Settings. In the Basic Settings part, you can paste the API key you copied in the box. Of course, you need to press the Save button to store your settings.
Besides the basic setting section, there are more options for you to set your maps, such as styled maps, POI settings, clustering, and more. Thus, you are able to customize the map and save the settings in your own way.
Conclusion
All in all, with the instruction above, we hope that you are able to add a google map to your site smoothly and effectively. If you want to contribute more information or have any query to ask, please leave your comment below. Furthermore, don’t forget to access our Free WordPress Themes to get more responsive and attractive ones for your site. Thanks for your reading.
- How to place menu items in helix joomla 5 ? - December 14, 2024
- How to reduce the size of helix 2 layout ? - December 14, 2024
- What’s J4 starter template and how to use it - December 3, 2024
Recent Comments