Widget Library
      Back to home
      1. Help Center
      2. Google
      3. Widget Library

      Google Map

      Quickly place a Google Map onto your site using this widget.

      This widget lets you place a google map on the page. You will generate the map you want at Google, then pull the information provided by google into this widget to add a live map to the page.

      Recommendation - We recommend not using the Google Map widget inside an Accordion widget. This will allow for correct spacing and display of the map in the accordion.



      How do I add this widget to a page?

      1. Click Edit Page
      2. Click either + Content or the Settings icon (down-facing caret) to the right of Edit, where you will need to select either Insert above or Insert below.
      3. Choose the Google Map widget.
      4. Enter the address you would like to be at the center of the map. If no address is entered, a Latitude and Longitude will need to be entered instead.
      5. Additional fields that can be found in the Settings tab allow you to customize the widget. The fields and their descriptions are listed below;
        • Height - Enter the height of the widget. Leave blank to make it responsive.
      6. To add a marker to the map, click on Markers to the right of Settings. On the following screen, click on +Marker located at the top right-hand side of the screen.
        • Enter the address where you would like a marker to be placed. If an address isn't entered, Latitude and Longitude will need to be entered instead. Additional fields that can be found in the Markers tab are listed below;
          • Title - Title of the marker
          • Description
      7. When done, click on the green Create button, and your Google Map widget will show up on the page.
      8. Make sure to click either the Publish or the Save Draft option just as you would when you're editing pages.

      • How do I add a marker to the map?
        To add a marker to a Google Map widget. Edit the widget, then click on Settings located at the top of the screen, followed by the +Marker located to the top right-hand side of the screen. When you are done entering the necessary information, at minimum Title and Address, click Update.
      • How do I hide/show a marker on the map?
        Hiding a marker from being displayed by a Google Map widget can be done quickly. Edit the widget, click on Settings located at the top of the screen, click on the switch to the right of the slide that you would like to hide, switching it to gray (hidden), and finally Update. To show an item that has been hidden, click on the switch to the right of the slide that you would like to show, switching it to green (visible), and finally Update.
      • How do I change the order of the markers?
        To change the order of how a Google Map widget is displaying the markers. Edit the widget, click on Settings located at the top of the screen, click on the vertical directional arrow icon to the right of the marker you would like to move, choose either Move Up or Move Down and finally, Update when you are done.
      • How do I remove a marker from being displayed?
        To remove a marker from being displayed by a Google Map widget Edit the widget, click on Settings located at the top of the screen, and click on the trash icon to the right of the marker you would like to remove followed by Update.



      An alternative to using this widget - Another way to embed a Google Map on a page is by using the HTML Source widget.

      1. While on the Google map, click on Share. Then click on the Embed a map tab from the dialog box.

        We recommend changing the size from Medium to Small since Small fits the containers best.
      2. Copy the iframe snippet by clicking on COPY HTML.
      3. Return to the SchoolNow page and click on the Settings icon (down-facing caret) and select the Insert below option
      4. Choose the HTML Source Widget.
      5. After pasting the snippet of code that you received from Google, click the green Create button
      6. The google map should now appear on the page.
      7. Make sure to click either the Publish or the Save Draft option just as you would when you're editing pages.



      Additional Articles