InMotion Hosting Support Center

12/2/2013: The Area Map module has stopped working with Google Map's API, due to a recent update. We have notified Plesk, the developer of the web builder, in order to get this problem corrected. Unfortunately, there is no estimated time for a resolution to this issue.

The Premium Web Builder has a built in module for inserting maps into your website. This Module is called the "Area Map" module. Using the "Area Map" module will require you to use your Google Maps API key to display a map of your location. To obtain your Google Maps API key, click here. The following steps will explain how to insert a Map into your Premium Web Builder site.

How to add an Area Map:

  1. Log into your web builder.
  2. Select Module Area Map Premium Web BuilderSelect the "Area Map" Module in the left side module list.
  3. Drag the Area Map Premium Web Builder to pageDrag the module to the page you want to see it on your site.
  4. Add Google API key Area Map Premium Web BuilderThe Area Map will display "Before publishing your site, be sure to specify the Google Maps API key generated for your website url".

    Click "Service Provider Settings".

    Add API KEY Area Map Premium Web BuilderEnter your Google API key in the Google Maps API key text field and click OK.

    Important! To obtain your Google Maps API key, click here.

  5. Choose LocationArea Map Premium Web BuilderYou should see the Area map display "No location has been selected".

    Click "Choose Location".

  6. Find location Area Map Premium Web BuilderType your address in the text box at the top and click "Find Location".

    Location found Area Map Premium Web BuilderYour address will show up in the map with a pin point stuck in the map where you address is. In this example, the pin point is on the White House.

  7. Fill in address Area Map Premium Web BuilderClick the pin to open the title and address pop up. Type our address and title in the text fields and click Save.
  8. Zoom in and out Area Map Premium Web BuilderZoom into your address to make the map go closer to your map area.

    Finished view of Area Map Premium Web BuilderDrag the map around till you have your pin point positions in the spot you want to display it.

    Click OK.

  9. Builder view Area Map Premium Web BuilderOn the builder Edit page you will see your map in the Area Map module. The view is not what the visitors will see. To see the exact look of the Map module on your site, you will need to publish the site.

    Publish your builder site.

    Final view of site Area Map Premium Web BuilderWhen visiting your site where you placed the map, you will see it like the snapshot to the right.

    Address and title pop up Area Map Premium Web BuilderWhen clicking the pin point, you will see the information display that was entered for the pop up.

Continued Education in Course 104: Working with Modules in the builder
You are viewing Section 1: Adding an Area Map in the Builder
Section 2: How do I embed a YouTube video in my Builder?

Support Center Login

Our Login page has moved, Click the button below to be taken to the login page.

Social Media Login

Social Login Joomla

Related Questions

Here are a few questions related to this article that our customers have asked:
Ooops! It looks like there are no questions about this page.
Would you like to ask a question about this page? If so, click the button below!
Ask a Question

Post a Comment

Email Address:
Phone Number:

Please note: Your name and comment will be displayed, but we will not show your email address.

0 Questions & Comments

Post a comment

Back to first comment | top

Need more Help?


Ask the Community!

Get help with your questions from our community of like-minded hosting users and InMotion Hosting Staff.

Current Customers

Chat: Click to Chat Now E-mail:
Call: 888-321-HOST (4678) Ticket: Submit a Support Ticket

Not a Customer?

Get web hosting from a company that is here to help. Sign up today!