Wordpress · Wordpress Setup

How to Add Google Maps to WordPress Post

Wordpress Tutorial – If you are running any type of business that has a store front and requires people to search for your location, it’s best to have a link or image of your location on a map.  My Wordpress tutorial will show you how to add a Google Maps into your WordPress website without a WordPress plugin.  It’s very simple and only requires 4 steps.  Afterwards you will have a post that looks like the screenshot below:

Add Google Maps to WordPress Post / Page
Add Google Maps to WordPress Post / Page

Overview of Steps to Add Google Maps to WordPress Post / Page:

  1. Go to Google Maps
  2. Search for Address & Click on Link
  3. Copy Google Maps HTML to Paste into WordPress
  4. Paste into WordPress Post / Page
  5. See Google Map in WordPress Post / Page

Steps:

1.  Go to Google Maps

Google maps is the best choice for linking people to.  It’s the most popular and the map site people most go to when searching for places.

  • Go to your browser and type in the address – maps.google.com

2.  Search for Business Address  & Click on Link

You can search for a business address or the business name in the search box.  Google maps will pin points on a map.  Click on the pin on the Google map that you want to display on your site.  In my example, I’m searching for the ‘Empire State Building’.

Search Google Maps & Click on Pin to Add to your WordPress Website
Search Google Maps & Click on Pin to Add to your WordPress Website
  • Search for Business Address or Business Name in Google Maps Search box
  • Click on the pin ‘A’ if if that is the correct address
  • Click on the infinity ‘link‘ symbol beside the printer icon

3.  Copy Google Maps HTML to Paste into WordPress

A Google Maps window will pop up to either copy a link to Paste into an email or into a website.  You will select the link to embed into a website.

Copy Google Maps HTML To embed into WordPress Post / Page
Copy Google Maps HTML To embed into WordPress Post / Page
  • Go to the ‘Paste HTML to embed in website’
  • Copy all the contents of that text box
  • If you want to customize the size of your map, you can click on ‘Customize and preview embedded map’

4.  Paste into WordPress Post / Page

Now you can go to your WordPress and either creating a new post/page or edit an existing one.  You will go to the ‘Text’ view which also means ‘HTML’ view to paste in the code you copied in step 3.

Paste Google Maps HTML into WordPress Post/page
Paste Google Maps HTML into WordPress Post/page
  • Login to your WordPress Administrator Backend
  • To Add / Edit to a Post – Go to Posts, ‘Add New’, or edit an existing post
  • To Add/ Edit to a Page – Go to Pages, ‘Add New’, or edit an existing page
  • Click on ‘Text
  • Paste the code copied from Step 3 into the Post/Page
  • Click  on ‘Save Draft’ or ‘Publish’

5.  See Google Map in WordPress Post/Page

Now you can refresh your WordPress Website and view your post.  You will see that the Google maps is now embedded into your WordPress page or post.  You can see the Google map example I embedded here.

Hope that helps.  Please leave a comment if you have any questions.

Thanks,

Elaine

Leave a Reply

Your email address will not be published. Required fields are marked *

Captcha Captcha Reload