Google Maps

How do I add a Google Map to my website? How can I add a map with a mark/pin, descriptions, lines and more on it

You will find a lot of plugins for this. Personally I prefer doing it by myself without using plugins.

1. Go to Google Maps. If you’re logged in you can click on My Maps, Create new map

2. Enter a title and a description of the map. If you want people to collaborate on the map you can invite them. You can choose whether you want it to be public so everyone can see it or whether you want to share it only with the people you want to see the map.

3. On the right side you see the map.

On the top left side you see the tools. The hand to move the map, the pin to add a mark on the map and the line to draw a line on the map (draw a line, a line along roads or a shape)

Once you add a pin and place it on the map you will be able to write some text for the title and the description. Of course you can also add HTML instead of text in the description. Especially helpful to add links, images, ...

4. Once you’re done editing the map hit Save, Done. To embed the map into your site on the upper toolbar’s right hit “Link”. You can either copy the URL to the map to make a link or copy the iFrame code. By clicking on the “Customize and preview embedded map” under “Link” you can further customize what the map should look like once you embedded it into your site. Paste the code into your page or post. That's it.

Examples:

If you have a business instead of having only the address displaying you could also add an image displaying your logo or the building for people to better find it when on place, your phone number or e-mail, www, whatever.

Here's my Bicycle trip 2010 from Basel (Switzerland) to Amsterdam (Netherlands). In the descriptions on the map I could add a link for people to read more about each place I visited on my journey like a diary with images and so on...


View Bicycle trip 2010 in a larger map

Here's another example of a map I made for a restaurant which indicates how to reach the restaurant by bus, where to park the car, where you have to walk to and of course where the restaurant is. This ensures people find the place. By clicking on the bus and the other icons you get further instructions (it's in German but I guess you get the idea).


View Tschugga Restaurant in a larger map


This FAQ is also discussed in my WPFAQ.org E-Book (sample)


© WPFAQ.org - Tutorials, Tips & Tricks is made with WordPress and for WordPress.
It's an EBookStoretoday.com company. It’s presented by Cédric Giger and hosted by HostGator.com

Thank you for visiting and supporting my website,
- Cédric -




Now share it…

Share

Comments are closed.