There are many reasons to integrate your Drupal site with Google map (GMap). You can create a business directory with company contacts and locations, or a list of local restaurants with directions. Good news is that it can be achieved using Gmap and Location Drupal modules. And we will show you how to use Gmap and Location modules in Drupal in this article.
Demo of GMap in a Drupal site
Let's take our Drupal theme ST Pipe as an example. Basically it is a restaurant review website. It shows restaurant information such as images, contact details and a Gmap block to show directions to the location. Very nice way to make the content more appealing to users.
Restaurant detail page with GMap
The following section is how we implement this feature in Drupal.
How to use Drupal Gmap and Location modules
- Download Drupal GMap and Drupal Location modules.
- Go to admin/build/modules page, enable Location, Gmap, and Gmap Location.
- Go to admin/settings/location, enable "Display of Locations", and check "Use a Google Map".
- Go to http://code.google.com/apis/maps/signup.html and get an API key for your URL.
- Back to admin/settings/gmap, paste in your API key, scroll to the bottom of the form, and save the configuration. (You must do this before the other configuration options will work.)
- On the same page, set your Default Map Settings - this is for zooming, marker or etc. You can ignore it for now.
- Go to admin/settings/gmap_location and adjust the settings for your user and node maps. If you're not going to use one or the other, just ignore it.
- Go to admin/user/permissions and set the permissions for the gmap_location and location modules.
- Go to admin/content/types, edit each content type that you want to show location information, and turn on the Locative Information settings.
- Edit or create a new node of a type that you want to set location. Under Location, click on the map to add a marker. Pick up and drop the marker repeatedly to zoom in so you can place it more precisely. (This is a lot quicker than zooming and panning)
- Go to admin/build/block, assign Location map block into Content region. In ST Pipe, we asign it into "Node Location" region.
This is done. Hope you have a great time with Drupal Gmap and Location modules.
| Attachment | Size |
|---|---|
| location_config_drupal.png | 22.24 KB |
| gmap_config_dupal.png | 13.94 KB |
| content_type_location_config.png | 30.02 KB |
| block_location.png | 28.11 KB |
| node_detail_location.jpg | 32.21 KB |
Comments
gmaps doesn't work
i have set in my site the option "private download" and gmaps doesn't work... why?
Is it necessary create new content type or can i use the blog content type appropriately modified?
tnks
You can change height and
Yes, you can change height and width of the map at Macro text box on admin/settings/gmap_location page.
To display more marker on a page, you need to create a view and then choise Gmap for Style at Basic setting.
It works fine, thank you. The
It works fine, thank you. The height of the map seems to be 200px - is there somewhere I can define height and width? Also can I have more than one marker?
Thanks,
Ju