|
To get a Google Maps API Key:
1. Go to http://code.google.com/apis/maps/signup.html or if the address has changed, search Google for "Google Maps API Sign Up.”
2. Fill in the online form:
- Agree to Google's Terms of Use.
- Click the General Google API Key. Google will bring up the Key screen, as seen below.
|

ABQIAAAASvAlWWCVFsFjppJiWEjidkdo2893460zxwpjl
|
3. Copy the key to your clipboard. You can use the Copy commands on your keyboard by using the Control Key and C key. (Ctrl + C)
|
4. Next, go to the dropdown that is located in the gray panel to the left of your
screen.
5. Select Sites from the dropdown which will bring up the Site Administration screen,
as seen below.
|

|
 |
5. Enter the Google API Key in the lower right corner of the screen. You can use the "Paste Command," Control + V keys on your
keyboard.
6. Click Done to close the Site Administration screen.
Now, it's time to place the Store Locator onto a page.
1. To place the Store Locator, first go to the page in your site where you want the Locator to be.
2. Then, go to the gray panel to the left of your screen and click Add Content.
3. The Add Content wizard brings up the Content Type screen. Scroll down to Store Locator and click the radio button.
4. Click Next to go to the Placement tab. Choose the Content Placement and the Panel Location. Some of the
Templates seen below may or may not be the same Template selection you have available for your use. The needs of
individual websites vary. Webtreepro offers different selections to meet your website's particular needs.

5. Click Next to go to the Details tab. You can see there are two tabs at Details.
In the Common Properties tab, your Search options are:
1. Search By: allows you to select options in order to narrow the search for the store's location.
-
Geographic is the default option, but you can offer the visitors the ability to search for a store by entering a ZIP code. Your visitors would enter the ZIP code, and the approximate distance they would be comfortable in traveling to the store. Then, they would click on the Search . See bottom, below right.
|
Geographic View
 |
Zip Code View

|
2. Additional fields: The checkboxes can be checked if you want to offer more detailed information.
3. You can enter a Map Link Name. (Optional)
4. Display results as:
5. Choose whether you want the display to be on the Same Page, or as a Popup window.
6. Decide whether the child sites will be included.
7. You can adjust the display's Width and Height by entering a number of pixels.
8. Do not click on the Next button if you want to set the Style for the display. If you don't want to enter any Style
options, click Next to go to the other tabs of the Add Content wizard.
If you do want to enter Style options, click the Styles tab that is right next to the
Common Properties tab.

1. You have the ability to choose the Font Style and Font Color for each line. Line 1 has font options that are visible already. To make
font selections for Lines 2 - 8, just click on the text for each line.
- Font Style: Click the Font button
. The 3 dropdowns will let you choose a Font, a Font Style and Font Size, all of which can be seen in the preview box at the bottom of the Font Settings window.
-
Click OK  to save. Click Clear to make a different selection, or cancel any selection.
- Font Color: You can choose a color for your Font by clicking the square to see the color palette, or by entering the hex color code. If you don't choose a color, the Font will be in black. The example above has Font Color #00ff00 selected.
2. Once your Font Style and Font Color are chosen, click OK to save. Click Cancel to exit the Font Settings tab.
3. At this point, click Next to continue through the Add Content wizard, if need be. Otherwise, you can click Finish
and avoid going through the rest of the Add Content tabs.
4. Your Store Locator will appear on the page you've selected. As with all newly added Content, the Store Locator will be
first located at the bottom of the selected panel. You may want to move the Store Locator elsewhere. If so, do a right click
inside the area, and the Store Locator's Properties window appears, seen here. Click Move to... and another flyout
appears. Make a selection. In order to move the Store Locator to its perfect location, this process may need to be repeated.
5. To test the Store Locator, you must be in Published Mode, or click on Date Preview located in the gray panel to your left.
|