Using the Google Maps Action

Google Maps is a great way to present a location. It allows you to place a fully interactive map on your website, use it to show where your offices are, where an event is being held, where you've just been on holiday... Whatever your needs, our Google Maps Action will save you a lot of time and effort.

Simply register for a Google API key*, and draw the Action on your page. To display the location you need, simply type in the Address and ZIP/Postal code, or latitude and longitude coordinates and you’re done. In Freeway, you’ll see a full preview of the map, so when you publish there won’t be any surprises!

Note: This Action requires an active internet connection to work as it uses live data from Google to create the preview.

Using the Google Maps Action:

  1. Click and hold on the Actions button in the toolbar and select the Google Maps Action and draw the Action item as you would any other item. This Action will generally work best if the item’s width and height are both larger than 200px
  2. Open the Actions palette by selecting Actions from the Window menu
  3. Enter your Google Maps key into the Site Key field in the Actions palette. If you have not already signed up for one, you can click on the Sign Up for Key button at the bottom of the palette.
  4. Now that your key is entered, you can start changing how your map will be displayed. The options available are as follows:
    • Location entry: If this pop-up is set to Simple, you just enter the location you want to display (for instance an address or zip/postal code) in the Town/Zip field. If this pop-up is set to Advanced, you can enter the exact geographical point you would like to display in the Latitude and Longitude fields.
    • Controls (click on the Controls disclosure triangle to show these options):
      • Map Type: Whether the map is a normal map, a satellite picture, or a hybrid of the two.
      • Show Type Control: Whether a control to change between the different map types is shown on the map
      • Default Zoom: How zoomed in the map should be when first shown
      • Map Controller: Whether to show a controller for users to navigate the map, and if so, what type it should be
      • Show Scale: If on, displays a scale indicator on the map, and an option to choose between Metric or Imperial measurements will be made available
      • Show Map Overview: If on, adds an extra small map in the corner indicating the overall position of the main map within a larger area
    • Marker (click on the Marker disclosure triangle to show this option):
      • Create Marker: If on, displays a marker at the exact location specified for the map. When on, you can enter the text to go with the marker in the Marker Text field, and the font for the marker text in the Caption font field.

*This is a unique ID for your website and is used so Google can keep track of the number of requests t their servers each day, these limits are pretty high but read through the terms and conditions first

Using the Google Maps Marker Action (Freeway Pro only):

A helper Action has also been included in Freeway to allow you to enter custom text and graphics into the map marker. To use this Action the Map must have the Create Marker option enabled.

Google Maps Marker Action in use

  1. Enable the CSS Layout button in your toolbar
  2. Draw a layer HTML item on your page
  3. Enter any text and/or images you want to be displayed in the marker
  4. With the item selected go to the Actions submenu in the Item menu and choose Google Maps Marker
  5. Open the Actions palette by selecting Actions from the Window menu
  6. In the Actions palette select the map item from the Map pulldown
  7. Preview the page in a browser to see the marker in action