| Drupal

drupal gmapSeveral times in the last few weeks, OSTraining students have asked us about maps in Drupal.

The students wanted to set up directories that would show Google maps for each location.

They also wanted to create larger maps that would display multiple locations at once.

We recommended that the students use the GMap module. However, although that module is powerful, it is poorly documented and can be confusing to use.

So, here's a beginners guide to the GMap module.

Adding a Location Field to Content

We need two key modules to make our maps work. Install and enable both of those modules:

After installing and enabling them, enable the Location CCK module too.

Now we need to select Google Maps for our maps.

  • Go to Configuration > Content authoring > Location > Geocoding Settings.
  • Select Google Maps for all the countries in which you want to list locations.
 
Google Maps in Drupal with the GMap Module
  • Go to Structure > Content types > Manage fields
  • Add an "Location" field to your content type:
 
  • On the field settings, choose what options you want to collect for each location:
 
  • Save the field.
  • Click the Manage Display tab
  • Choose a format for your field that will show the map. "Address with map" is a good choice.
 
  • Click "Add content"
  • Create a new content, including entering the address:
 

If everything has worked correctly, your content will appear with the map automatically generated, as in the image below.

We found a lot of people on the Drupal forums had problems with this step. They could manually enter their latitude and longitude settings, but GMap wouldn't generate them automatically. If you have this problem, you're not alone, and there are several possible solutions on the Drupal forums.

 
 

Controlling the Layout of Maps

By default, GMap provides a very small default map, but it also provides a great tool to solve that problem.

GMap has a "Build a GMap macro" option will allows you to design your map display:

 
  • The image below shows the macro that GMap will create for you. Copy the macro that you create.
 
  • Go to Structure > Content types > Manage fields > Edit your Location fields.
  • Paste your new macro into the field settings:
 
 

Creating the Large Map

Before you move onto creating the large map, make sure you have created more than one content item that uses your location field, otherwise you won't be able to see if this large map is working.

  • Go to Structure > Views > Add new view
  • Choose your view settings, but make sure to choose "GMap" for Display format:
 
  • Click Continue & edit
  • Click Settings next to GMap
 
  • Enter a macro for a large map:
 
  • Save your view and your markers will show on your map.
 

There is much more that can be done with GMap, including adding tooltips for each marker, but hopefully this beginners guide is enough to get you up and running.


About the author

Steve is the founder of OSTraining. Originally from the UK, he now lives in Sarasota in the USA. Steve's work straddles the line between teaching and web development.