Integrating a Google Map of your Headquarter in the footer of the Customizr theme

Google Maps is a web mapping service offered by Google. Satellite imagery, street maps, street views, real-time traffic and route planning are some of the components of the service. It is increasingly being used for navigation in unknown areas. It can also help in giving directions or for locating a place.

These days, it is quite common for a business to add a Google Map of its headquarters along with its address in the footer of its website. So, if you own a business and you are trying to build a website for the same, it might be useful to add a Google Map of the location of your office. You can do it in just two steps. Here you go!

Generate the Google Map Code for your desired location

Firstly, you need to generate the Google Map Code for your headquarters.

Method 1:

  1. Go to Google Maps.
  2. Enter your location in the top left input box. For example, San Francisco. From the dropdown list that appears, you can choose the exact location and press enter.

  1. Now, you should see the map centered around your location.
  2. Click on the three-bar main menu on the top left corner.
  3. Choose Share or embed map.

  1. Choose the Embed Map tab on the top.

  1. Now, choose the size of the map that you want from the four options available - Small, Medium, Large or Custom Size.

  1. If you choose Small/Medium/Large you get a map of a small/medium/large size, but the size is predefined. If you choose Custom Size, you can provide the size you require. For instance, choose 300px x 200 px. You can also preview actual size by clicking on the link for it.
  2. Now, copy the code that is given below.

Method 2:

  1. Alternately, you can also you a site like map-embed.com. Go to map-embed.com
  2. Enter your address, map type, Zoom level, height and width required. User the preview next to it to decide.

  1. Click on Generate Code.
  2. Copy the code that is generated.

Insert the Google Map Code into the footer of your website

Now that you have generated the google map code and copied it, the second step is to insert it in the right place.

  1. Login to your site's admin account.
  2. From the Customiser, click on Widgets > Footer Widget Area One. You may also choose Footer Widget Area Two or Footer Widget Area Three as per your need.
  3. Click on the Add a Widget button.
  4. Choose Text from the available widgets.

    1. Give an appropriate Title if you want one. Paste the copied google map code in the input area for Content.

      1. Save and Publish.
      2. Visit your site to take a look at the footer.

Did you find that simple? It indeed is deadly simple!

Does that look professional? It sure does! So, why don't you add this simple feature to your site?