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

Image[1]-How to Create Interactive Custom Maps on WordPress Using Google My Maps - Photon Fluctuation Network | Professional WordPress Repair Service, Global Reach, Fast Response

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".

Image [2] - How to Create Interactive Custom Maps on WordPress Using Google My Maps - Photon Fluctuation Network | Professional WordPress Repair Service, Worldwide, Fast Response

Select base map

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

Image [3] - How to Create Interactive Custom Maps on WordPress Using Google My Maps - Photon Fluctuation Network | Professional WordPress Repair Service, Worldwide, Fast Response

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

Image [4] - How to Create Interactive Custom Maps on WordPress Using Google My Maps - Photon Fluctuation Network | Professional WordPress Repair Service, Worldwide, Fast Response

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.

Image [5] - How to Create Interactive Custom Maps on WordPress Using Google My Maps - Photon Fluctuation Network | Professional WordPress Repair Service, Worldwide, Fast Response

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.

Image [6] - How to Create Interactive Custom Maps on WordPress Using Google My Maps - Photon Fluctuation Network | Professional WordPress Repair Service, Worldwide, Fast Response

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.

Image [7] - How to Create Interactive Custom Maps on WordPress Using Google My Maps - Photon Fluctuation Network | Professional WordPress Repair Service, Worldwide, Fast Response

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.

Image [8] - How to Create Interactive Custom Maps on WordPress Using Google My Maps - Photon Fluctuation Network | Professional WordPress Repair Service, Worldwide, Fast Response

Drawing customized routes

Image [9] - How to Create Interactive Custom Maps on WordPress Using Google My Maps - Photon Fluctuation Network | Professional WordPress Repair Service, Worldwide, Fast Response

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".

Image [10] - How to Create Interactive Custom Maps on WordPress Using Google My Maps - Photon Fluctuation Network | Professional WordPress Repair Service, Worldwide, Fast Response

Configuring Shared Settings

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

Image [11] - How to Create Interactive Custom Maps on WordPress Using Google My Maps - Photon Fluctuation Network | Professional WordPress Repair Service, Worldwide, Fast Response

Get Embed Code

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

Image [12] - How to Create Interactive Custom Maps on WordPress Using Google My Maps - Photon Fluctuation Network | Professional WordPress Repair Service, Worldwide, Fast Response

Adding Custom HTML Blocks in WordPress

Image [13] - How to Create Interactive Custom Maps on WordPress Using Google My Maps - Photon Fluctuation Network | Professional WordPress Repair Service, Worldwide, Fast Response

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.

Image [14] - How to Create Interactive Custom Maps on WordPress Using Google My Maps - Photon Fluctuation Network | Professional WordPress Repair Service, Worldwide, Fast Response

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
Customer Service
Tel: 020-2206-9892
QQ咨询:1025174874
(iii) E-mail: info@361sale.com
Working hours: Monday to Friday, 9:30-18:30, holidays off
© Reprint statement
Author: xiesong
THE END
If you like it, support it.
kudos0 share (joys, benefits, privileges etc) with others
commentaries sofa-buying

Please log in to post a comment

    No comments