How to Create Interactive Custom Maps on WordPress Using Google My Maps

Your website adds Google Maps with basic interactive features.Google My Mapsis a much more appropriate tool. This article will detail how to use Google My Maps to create and post on a WordPress websiteEmbedded interactive mapsThe

What is Google My Maps?

Google My Maps is a free online service that allows users to customize Google Maps. Maps can beAdd unique markers, points of interest, driving directions, etc., and embed it in your website through code.No need to install a separate WordPress pluginThe

Step 1: Create a new map

First, visit the Google My Maps website and click on "Create a new map".

Select base map

Once in the map editor, you can select the base map and add points of interest and layers.

Click on the three dots next to "Untitled layer" and select "Rename this layer". Enter the desired name and click "Save".

Changing the map style

You can change the appearance of your map by selecting an existing style. Click on the arrow next to "Base Map" to browse and select a style that suits you.

Step 2: Add Points of Interest

Search and add tags

If you just want to create a simple map, you can skip to step four. However, to add richness to the map, points of interest may need to be added. When a visitor clicks on a point of interest, a tooltip pops up that displays the name, description, photos, and video (if available) for that location.

Enter the address in the search field and click the "Search" icon Google My Maps will zoom in on the area. If the location already exists in the map, simply click on it and select "Add to map" is available. You can edit this default message, add your own photos and videos, and click the little pencil icon to edit.

Customizing Point of Interest Information

Titles and descriptions can be entered, and images and videos can be added to enrich information about points of interest. For example, when creating a map for a restaurant website, you can add photos of the restaurant's exterior to help customers find it, or upload a photography portfolio for a photography studio.

Step 3: Add a route

Travel routes can also be added to the map, which can be useful for helping attendees find event locations or recommending sightseeing routes to travel blog readers.

Add a driving, walking or cycling route

Click on the "Add Route" icon at the bottom of the search bar and enter the start and end addresses on the left side of the screen. By default, driving routes are displayed, but you can choose to ride or walk.

Drawing customized routes

Click on the "Draw a Line" icon below the search bar to select a driving, walking or cycling route. Click on the starting point and draw a line along the route, then click to place a marker when you reach your destination.

Step 4: Publishing Interactive Maps in WordPress

When the map is set up to your satisfaction, you can use theEmbedding iFrame CodeAdd it to the site. First, click on "share (joys, benefits, privileges etc) with others" button to make the map public, enter a map title and description, and then click "recognize".

Configuring Shared Settings

Enable the "Anyone with this link can view" switch and click "Share on Drive".

Get Embed Code

Click on the three dots icon in the left menu, select "Embed in my website" and copy the generated iFrame code.

Adding Custom HTML Blocks in WordPress

In the WordPress dashboard, go to the post or page where you want to add an interactive map, open the Gutenberg editor, click the "+" button and search for "HTML" to add a custom HTML block. Paste the Google Maps code into the HTML block and click the "Update" or "Publish" button.

reach a verdict

With the above steps, it is easy to create and customize interactive maps using Google My Maps and embed them into your WordPress website. This not only improves the interactivity of your website, but also provides visitors with a more intuitive geographic information service.

Contact Us
Can't read the tutorial? Contact us for a free answer! Free help for personal, small business sites!	Customer Service
① Tel: 020-2206-9892
② QQ咨询：1025174874
(iii) E-mail: [email protected]
④ Working hours: Monday to Friday, 9:30-18:30, holidays off