How to Add a Google “Get Directions” Button in WordPress

A Get Directions button will enable visitors to get location information without leaving your website, all thanks to Google Maps!

If you run a business directory using WordPress, visitors will expect you to provide them with the physical address of each store. You can display anything from simple text to full-blown embedded maps. If you want to take things further, you can show users directions from their locations to each shop.

Providing store locations is straightforward if you use a service such as Google Maps. For this article, we'll show you how to add a Google Get Directions button to your WordPress website using our Business Directory plugin. Let's get to it!

How to add a Google Get Directions button in WordPress

Providing directions to online customers can be a challenge. However, Google Maps can give detailed instructions to your users in just seconds.

By integrating Google Maps with your directory, you can show visitors where businesses are located. You can also display a Get Directions button that users can click on.

To set up this button, you'll need three things:

A Google Maps API key
The Business Directory Pro plan or higher
The Google Maps add-on for Business Directory

For this tutorial, we're going to walk you through getting a Google Maps API key and using it alongside Business Directory Premium to display a Get Directions button.

Step 1: Get a Google Maps API key

An API key is a unique identifier. It enables external platforms and applications to pull data from a service. In this case, that service is Google Maps. Your API key lets you embed maps, show directions, and more. It's also completely free.

To get your API key, you'll need a Google account. Go to Google's Developer Console and log in using your details. Then jump to the APIs & Services tab and click on DASHBOARD.

Once you're in, find the option that says + ENABLE APIS AND SERVICES:

Using Google's Developer Console to set up a Google Get Directions button.

Clicking on that button will open Google's API library. There are many options to pick from, but let's focus on the map-related ones. Click on VIEW ALL next to Maps. On the next screen, select Directions API, Maps Embed API, and Maps JavaScript API:

Map-related APIs for your Google Get Directions button.

Select each option and go into its page. Then click on the ENABLE button at the top of the screen.

Keep in mind that some APIs aren't free. However, Google provides most accounts with credits to test its services. However, you will need to add billing information to access API keys, even if you have free credits.

Once you enable all three APIs, go to APIs & Services → Credentials. Then click on + CREATE CREDENTIALS → API key at the top of the screen:

Getting the API key for your Google Get Directions button.

Now Google will generate an API key for you. You should avoid sharing it with anyone. Copy the code or keep the tab open while you return to WordPress for the next step.

Step 2: Connect Business Directory with Google Maps

For this step, you should already have the Business Directory and the Google Maps plugins ready to go. Head to your WordPress dashboard and into the Directory → Settings → Module Settings tab.

You'll see a field at the top of the screen where your Google API key should go:

Entering your Google Maps API key to create a Google Get Directions button.

Paste your API key and save the changes to your settings. Once the Module Settings page reloads, scroll down until you see Allow visitors to get directions to listings?. Tick the box next to that option to enable it:

Enabling a Google Get Directions button.

Save the changes to your directory's settings once more. Then add the module to any relevant pages and listings in your index.

Note that the Get Directions button will only work if your website uses HTTPS. If users don't access your website through HTTPS, they'll need to enter their locations manually.

Conclusion

If you're going to set up a business directory using WordPress, you should provide as much information as possible with each listing. For example, you can display product data, contact information, and of course business addresses. Since you're using Business Directory Plugin, you can also give your visitors directions to each store.

This feature is possible if you're using the Google Maps module for Business Directory. Then you can add a Google Get Directions button by: