How to Embed a Google Map onto a Hive Page

How to Embed a Google Map onto a Hive Page

Question

We would like to embed a Google map as part of one of our Hives. Is this possible?

Answer

It is possible to embed a Google map within Digital Hive through the use of the Web page element.
  1. Open Google Maps so that the required map is displayed
  2. Click on the Share option 
  3. From the Share menu, select the Embed a map tab
  4. Press the Copy HTML button
  5. Paste the copied text into a text editor
  6. Copy just the URL portion of the pasted text.
    For example, using this copied Google link: <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2800.116520712743!2d-75.69324795719496!3d45.42715243578801!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x4cce050224c6125d%3A0x6a8bfab83c15afa4!2s78%20George%20St%2C%20Ottawa%2C%20ON%20K1N%200A8!5e0!3m2!1sen!2sca!4v1698181447841!5m2!1sen!2sca" width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>

    Extract the URL so that just this portion remains: https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2800.116520712743!2d-75.69324795719496!3d45.42715243578801!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x4cce050224c6125d%3A0x6a8bfab83c15afa4!2s78%20George%20St%2C%20Ottawa%2C%20ON%20K1N%200A8!5e0!3m2!1sen!2sca!4v1698181447841!5m2!1sen!2sca

  7. Copy the extracted URL
  8. Launch Digital Hive
  9. Open the Hive where the Google Map needs to be embedded
  10. Click on the Hive Launcher icon  and select Open Designer
  11. From the Elements panel, drag a Web page element onto a Hive Story Board page
  12. In the Properties panel for the Web page element, locate the URL property
  13. Paste the copied URL into the URL field and press LOAD
  14. The Google map should load into the web page element and should dynamically resize to the correct size