You will find there are many map related widgets - below we give a step by step guide to inserting the most popular choice, Google Maps, and a Multimaps alternative.
Below we give a step by step guide to inserting a Google Maps Widget. You can also find more information from Google Maps YouTube video.
| 1 |
|
Sign in to your Google Maps account. |
|
| 2 |
|
Now you can do one of three things: You can search for the saved maps by selecting the drop down menu next to search maps, or search the directory, or create a new map. Follow the YouTube video above for more information. |
|
| 3 |
|
Once you've created a map or found the map, click on 'link' in the top right side of the page. |
|
| 4 |
|
Click on the link 'Customize and preview embedded map'. |
|
| 5 |
|
A new window will open allowing you to customize the map as required prior to copying the HTML code provided. |
|
| 6 |
|
Next, copy (Ctrl + C) the HTML code provided. |
|
| 7 |
|
In Web Designer or Xtreme 5, open the web page in which you wish to embed your Google Maps. |
|
| 8 |
|
Use the Rectangle tool to create a placeholder sized to be the same size as the Google Maps widget being inserted. |
 |
| 9 |
|
Open the Web Properties dialog via Utilities > Web Properties (or by clicking on the icon in the web toolbar or Shift+Ctrl+W) and then click on the Placeholder tab. |
 |
| 10 |
|
Enable the radio button 'Replace with HTML code' and paste (Ctrl +V) the code you copied in step 6. |
|
| 11 |
|
Click on OK to apply the changes and close the dialog. |
|
Below we give a step by step guide to inserting a Multimaps Widget.
| 2 |
|
Now you can do one of four things: You can find a map, get directions, find a business or search for the saved maps by selecting the appropriate link from the main menu. |
|
| 3 |
|
Once you've located the map, click on 'link' in the top right side of the page. |
|
| 4 |
|
Select 'I accept the terms & conditions' and then click on the link 'Customize and preview map'. |
|
| 5 |
|
A new window will open allowing you to customize the map as required prior to copying the HTML code provided. |
|
| 6 |
|
Next, copy (Ctrl + C) the HTML code provided. |
|
| 7 |
|
In Web Designer or Xtreme 5, open the web page in which you wish to embed your Multimap. |
|
| 8 |
|
Use the Rectangle tool to create a placeholder sized to be the same size as the Multimap widget being inserted. |
 |
| 9 |
|
Open the Web Properties dialog via Utilities > Web Properties (or by clicking on the icon in the web toolbar or Shift+Ctrl+W) and then click on the Placeholder tab. |
 |
| 10 |
|
Enable the radio button 'Replace with HTML code' and paste (Ctrl +V) the code you copied in step 6. |
|
| 11 |
|
Click on OK to apply the changes and close the dialog. |
|
|