Add3.com

How to Create, Customize, & Embed a Google Map

Despite having been out since March 27, 2013, Google’s Maps Engine map creator is still unfamiliar to many. Maps Engine provides a higher level of versatility than the classic “My Maps” creator while greatly simplifying the customization process of your own Google Map. This guide will walk you through the steps to creating, customizing, and embedding your own map.

Getting Started

1. If you are creating a map for commercial use (e.g. to list your store locations), you must upgrade to the Pro version of Maps Engine.
2. Sign in to your Google account (or create a Google account)
3. Go to https://mapsengine.google.com/map/ & click “Create a new map”

Google-Maps-Engine

Below is the blank slate that you begin with.

Maps-2-web

4. Click “Untitled map” and write in the title and description of your map.

Maps-3-web

Importing & Editing Your Location Data

If you have multiple locations to pinpoint on your map, then the best way to drop pins on all their locations may be to import a spreadsheet (.csv, .xlsx, Google Drive) that at least contains the locations & location titles and may also contain extra information that you want displayed for each pin. Location can be indicated by providing an address or latitude & longitude coordinates.

Maps-4-web

This information will make up your first “layer” of data. Layers are used to organize your pins, lines, shapes and control visibility & styling between different sets of data. You can have up to three layers per map on Maps Engine Lite.

Import your data by clicking “Import” and locating your spreadsheet of data. After successfully importing your data, you will be asked to select the column(s) that that indicate the position of your pins.

Maps-5-web

Once you click “Continue,” you will be asked to choose the column that provides the titles for each pin. Note that if you click the tooltip next to each column name, you can see a sample of the data in that column, as seen below.

Maps-6-web

Click “Finish” to place the pins. Rename the data layer from the filename to something more appropriate.
Maps-7-web

 

Editing the Data Layer

Changing the appearance of your data is essential to customizing your map and making the information intelligible. There are three basic changes you can make to a layer:

1. Style
2. Data
3. Labels

Style

Style allows you to customize the appearance of the pins on that particular data layer. This becomes especially useful in differentiating multiple layers of data. The four general customization options are:
• Uniform style
• Sequence of color and letters
• Individual styles
• Style by data column

I chose Uniform Style for this layer of my example. Click the paint bucket to the right of the items to customize the icons on the map.

Maps-8-web

A window appears with various icon shapes & colors, but there’s a plethora of other icon choices under “More icons,” as seen below.

Maps-9-web

Data

When you click “Data,” all of the information from your places appears in a spreadsheet where you can edit and add information. If you notice a name or address is incorrect, you may fix it here. Similarly, if information is missing, you may add it here. I chose to add URLs for each of my items by adding another column with URL information.

Maps-10-web

You can see that the information was added by clicking on an icon to view all information for that specific location.

Maps-11-web

Labels

This allows you to add labels to each map pin based on a column of spreadsheet information, e.g. the title of a location.

Maps-12-web

Adding More Data Layers

To add a layer, simply click “Add layer” and follow the previous instructions for importing data & editing the data. Adding data layers may be essential to illustrating a map that expresses a more correct idea of what you are trying to depict. Google’s go-to example map for “shark sightings” puts beach locations on one layer and locations of shark sightings on a second layer. This allows them to more easily differentiate beach icons from shark sighting icons.

My map is a bit shallower with one layer expressing places I like and the second layer expressing places I dislike.

Maps-13-web

Note: Adding directions to your map (by clicking the diverging arrow) takes up a layer of its own.

Adding Lines & Shapes

Adding lines is useful for marking routes while adding shapes is useful for highlighting an area. Lines and shapes are added to the currently-selected layer and can have the same information categories as items in that layer (e.g. address, notes, URL, etc.). Start by clicking the tool marked in the image below.

Maps-14-web

Your cursor will change to a “+”. Move your cursor to where you wish to start your line or shape and left-click. Each subsequent click will add a joint to your line. Add joints wherever you wish to change direction of your line or shape. If you wish to complete your line, simply double-click. If you are creating a shape, then your shape is complete when you click on the starting point.

The Base Map

There are 9 base map style options, each of which give the map a different appearance, from satellite to terrain and more. The ideal base map style may change based on what you wish to highlight.

Maps-15-web

 

Sharing & Embedding Your Map

Privacy & sharing options are under the “Share” button at the top-right corner of the screen. In order to embed the map onto your website, click the folder icon, click “Embed on my site,” and copy and paste the given code where you wish to embed the map.

Maps-16-web

 

 

There you have it. 99% of everything you need to know about creating your own map on Google’s Maps Engine. Here is a link to the map I created for this post.

Now go! Create! Have fun! Comment with any maps that you create yourself.

Miles Rossow

About Miles Rossow

Miles is generally in the top 5 best SEO’s within a 10 block radius wherever he goes. Being from Seattle, an SEO-savvy city, that means he’s pretty darn decent, statistically speaking. Ever since Miles started cleverly adding keywords to his emails in college to more easily locate those emails in the future, he knew he was destined to become the best SEO of all time, objectively speaking. He is Google Analytics certified, which means a lot. Follow him on Twitter @MilesRossow.