This article will demonstrate how to embed Google Maps into your SharePoint page using the FREE ShortPoint Code Editor. Follow the quick walkthrough or see the detailed steps in Step-by-Step Tutorial to start your journey.
Quick Walkthrough
- Look for the Google Maps widget you want to use, customize it, and copy the embed code.
- Go to your SharePoint page and add the ShortPoint Code Web Part.
- Click the Edit Properties icon of the ShortPoint Code to edit it.
- Click Import Code to paste the code.
- Select the Edit HTML field to customize the code according to your needs. Once done, click Save.
- Close the ShortPoint Code window.
- Republish the page.
TABLE OF CONTENTS
Prerequisite
- You must already have the ShortPoint Code Web Part installed on your SharePoint page. To learn how to do this, check out How to Install ShortPoint Code Editor in SharePoint.
Step-by-step Tutorial
Follow the steps to embed Google Maps into your SharePoint site:
Step 1: Copy the Embed Code
- Look for the Google Maps widget you want to use. For this guide, we will be using embedmymap:
- Customize the Google map widget according to your preferences:
NOTEDifferent customization options may be available, depending on the Google Map widget you are using.
- Copy the embed code:
Step 2: Add the ShortPoint Code Web Part
- Go to the SharePoint page where you want to add the Google Maps widget and click Edit:
- Click the close icon to leave the Toolbox:
- Select the plus icon to add a web part:
- Use the search bar to look for ShortPoint Code, or scroll down until you see the Advanced section. Click ShortPoint Code:
Step 3: Edit the ShortPoint Code Web Part
- Click the Edit Properties icon:
Step 4: Paste the Code
- Click Import Code:
- You will get a pop-up asking if you want to overwrite the current code with the code in your clipboard. Click OK:
- You will get a notice that the code was successfully imported from your clipboard. Click OK again:
- You can directly edit the code in the ShortPoint code editor. Simply select the Edit HTML field, freely customize the code according to your needs, and click Save:
Step 5: Republish Page
- Once satisfied, click the close icon to leave the ShortPoint Code window:
- Click Republish once you’re ready to make your changes live:
Well done! You have successfully embedded Google Maps into your SharePoint page. Learn more about ShortPoint Code Editor’s capabilities by checking out the articles below:
- How to Add a Facebook Post to a SharePoint Page
- How to Add an Instagram Post to a SharePoint Page
- How to Add an X Post to a SharePoint Page
- How to Add a Viva Engage Feed to a SharePoint Page
- How to Embed a YouTube Video Playlist to a SharePoint Page
- How to Embed a Vimeo Video Playlist to a SharePoint Page
- How to Add a Stock Widget to a SharePoint Site
- How to Add a Web Page Animation to a SharePoint Page
- How to Embed a Weather Widget to a SharePoint Page