Embed or Link to a Google Map (WYSIWYG Editor)

Google Maps is a free service that provides an interactive map of your location as well as directions to your business address. You have the option of embedding the map on your webpage, linking to the full size Google map, or even both!

Start off by visiting https://www.google.com/maps.
Enter the name of your business in the search bar in the upper left. If your business is verified on Google My Business, it will begin to auto-fill with location(s) of the business name. If this is the case, just select it from the list below. If your business name is NOT displaying, you likely do not have a verified Google My Business listing. If this is the case, you may claim and your listing, although this requires about a week to verify. Alternatively, you can just type the physical address in.
When the proper address listing is brought up, click the Share icon, then continue with the appropriate section below:

Link Map

This will provide a link to the full-sized Google Map on the https://www.google.com/maps website only.

Select the COPY LINK text.
Next, you can select the appropriate text to link from on your website. For more information about hyperlinking, please see: Setting a Link.

Embed Map

This will provide an interactive map of your location on your website. Visitors can zoom in/out of the map, in addition, they can select a link to view the full map, which also provides driving directions.

Step 1: Selecting Dimensions

Select the Embed a Map tab near the top of the popup box.
Choose the size of the map from the drop-down picker in the upper left. Each standard selection will provide you an exact representation of its size after you click it. You can also choose a custom size.
If you select the Custom Size option, you will be prompted to enter in a set of pixel dimensions in the boxes that follow. The first is the width, second is the height. We recommend to try to keep a 16x9 or 4x3 aspect ratio. However, this is completely customizable to fit your needs, which may vary depending on where you are putting this and how much room is allotted.
To view an exact size representation of your Custom Size, click the Preview Actual Size option to see it in a popup window.
If you're unsure of what size to select, leave it at one of the default settings, preferably Small. This can always be adjusted later.
Select the COPY HTML text.

Step 2: Embedding Code

Open up your content page and select the Content Editor tab.
In the page, place your cursor where you would like the map to be located. If you plan on floating the map to the right side of your contact information, you can create a table and place it in the right column. For more information on tables, please see: Adding a Basic Table.
Type in your full name. This will help us identify the position in the source code.
Select the Source tab at the bottom of your editor window.
Locate your name (see 1st screenshot below). You may hold CTRL + F (CMD + F on a Mac) to perform a search for it.
Highlight the entire line your name is showing on and delete it. You should be left with a blank line.
Make sure your cursor is flashing on that empty line, then, on your keyboard, hold CTRL + V (CMD + V on a Mac) to paste the code you had copied from the "Step 1: Selecting Dimensions" section.
Click to the Preview tab to see how it will look on the page when it is saved. If it looks good, skip to step 12. Otherwise, continue below.
If you need to make adjustments to the map dimensions, go back to the Source tab.
At the beginning of the 3rd line of the code, you will see the dimensions. In this example, it is: width="600" height="400" (see 2nd screenshot below)
Change the respective numbers between the quotation marks and flip back to the Preview tab to see the update. Be sure NOT to delete or change any other part of the code.
Once you are all set, flip to the Design tab to make any other content changes, or you can just Save & Close.