Google Maps in Weebly

If you would like to include a map on your page to show a specific location, you can do so easily as Weebly has a built-in Google Maps element that helps you do just that. The configuration is simple, but there are some advanced options also. You may also wish to place your map in a layout for readability.

Adding and Configuring the Map

Start by dragging the Maps element to a page on your site.

Showing the location of the google maps element

The default map starts off in a small part of central San Francisco (home of Weebly!). You can easily change the location shown by clicking on the map. This opens up the Map toolbar.  You can make a number of changes from here:

The Toolbar for the Google Maps element in Weebly

  • Change the address
  • Change the size of the map using width and height
  • Position the map to the left, center or right of the element
  • Determine if you want a marker showing your address on the map
  • Set the initial zoom level

Advanced Map Configuration

You can also change a few of the less used settings via the Advanced menu.

The Advanced options in the Weebly Google Maps element toolbar

Layout and Embed Options

The Multiple Columns element is very useful in conjunction with the map element for placing visitor information right next to the map.  As seen in the example below:

San Francisco Public Library
100 Larkin St, San Francisco, CA
 

To access the library via Bus or lightrail:
 

The following buses stop near the library:
9,19,6,14,49,5,31 and 71L

The following lightrail trams stop near the library:
F,M,KT,N,J,S and L


View Larger Map

You can also embed a map you've created in Google Maps directly to your site. Just grab the embed code from Google and paste it to your site using using the Custom HTML element.

how to retrieve embed code from Google Maps