Having a map integrated into a website is a huge advantage for business owners, especially for those with brick-and-mortar locations. This helps your customers to find you easily. Google Maps is probably the most popular mapping service and having it embedded into your website will definitely be an advantage for your business.
Drupal has amazing possibilities to help you solve this issue. Whether you do this by using Drupal 8 modules or find other alternative technique, the process is going to be simple and easy. We’ve prepared a guide for you on how to implement Google Maps Data into your Drupal 8 website in different ways.
Methods to integrate Google maps into your Drupal 8 site
The first way to include Google Maps on your website is to embed them. It is maybe the easiest and the least time consuming way to have Google Map Data shown on your website.
How to embed Google Maps to your Drupal 8 website
The first step is to choose a location you want to show on your website. To do this, you should visit Google maps and find a place you’d like to provide.
After a searched location appears, press the Share button. In the opened window choose “Embed Map” and copy the whole <iframe> code.
Then you should create a basic page and give it a title.
The next thing to do is to insert a copied code into a created page. Note that it will work properly only if you choose Full HTML in the drop down Text format. After that, don’t forget to save changes.
The Map will be shown on your website as soon as the page is published.
Simple Google Maps Module
Simple Google Maps module is really easy to manage. The main advantage is that you only need to give the address of a place and a map will appear on your website. The module may be installed in different ways. Let’s look at how to downlaod and install it.
How to integrate Google Maps to your Drupal 8 website with Google Maps Module
Log in into your Drupal website as an admin. Go to Modules and click on Install new module.
Go to Install new module page and enter the copied link to Install from URL field and press the Install button.
After module installation, find this one, enable it and save changes.
The module is enabled and the next step is to create a new field to show a map. Go to Structure → Content type. After that, add a new content type, and give it a name.
As soon as a content type is created, go to Manage fields and add a new field with type Text (plain). Then save changes.
After the settings are saved, go to Manage fields, click Manage display and check whether it is displayed on your page. Select Google Map on the one-line format from a drop-down.
To manage the sizes of the map and addresses shown on your page by default, go to the config area (press the button on the right).
The next step is to add a node. Click on Content → Add content and choose the content type you’ve added. Insert the title for your page. After that, in the newly created field enter an address you’d like to show on your map and save changes.
After the page is created, Google Maps will be displayed on it.
Geolocation Field module
Geolocation Field module is probably the most frequently used module when we talk about Google Maps integration. In short, it brings special field types for storing information about geolocation. Moreover, it has extended possibilities and enables mapping, connecting it with the desired content types.
How to integrate Google Maps to your Drupal 8 website with Geolocation Field module
The first step is to install a module. You can use the method described above.
After installing it, all you need to do is to add the Geolocation field to the content type. For this, go to Manage fields while creating a new content type and choose the Geolocation field type.
The next thing to manage is how the map will be viewed. Go to Manage from display page and choose the Geolocation Google Geocoder from the drop-down menu.
After that, go to Manage display and choose Geolocation Google Maps API - Map from a drop-down in address field. Then a map will be displayed on your page.
After a node is created, the map will be shown.
We’ve described 3 ways to integrate Google Maps Data into your Drupal 8 website. Thanks to the simplicity and flexibility of Drupal CMF, it is quite easy to perform. In case you don’t want to do it on your own or have troubles with Google Map Data integration into your Drupal 8 website, let us know and our Drupal maintenance company will assist you.