The Contact Info widget allows you to display your location, hours, and contact information along with an optional map view.
Here’s an example of what it looks like when it’s activated on a blog sidebar:
Once you add the widget to your sidebar, you’ll see the following settings:
- Title – Set the title to be shown at the top of the widget above the contact information. (i.e. Hours & Info, Contact Us, Stop by our Office)
- Address – Enter your full address so Google Maps can find it. If you’d like a map to be displayed in the widget, follow the instructions here.
- Phone – Set the phone number as you want it to display to your visitors.
- Hours – Enter any text in this box. (HTML will be removed.)
Display a map in the Contact Info Widget
To display a map in the Contact Info Widget, start by enabling the “Show Map” checkbox. When you do so, a new field will appear, where you’ll be able to enter a Google Maps API key.
To get your own API key, you can follow the instructions on this page.
When creating a new API key, it’s best to restrict access to your site only. To do so, when creating the key, be sure to fill in the second field, like so:
Once you’ve created your key, copy it, and paste it in your Widget settings in your WordPress dashboard.
If the map doesn’t appear in the widget once you’ve added your API Key, try the following:
- Open this link.
- Make sure the correct project is selected in the top left corner of the page.
- Click on “Enable API” at the top of the page.
- In the list that appears, choose the “Google Maps Embed API” under “Google Maps APIs”.
- Once the description for this API is loaded, click the “Enable” button at the top.
If you’re having trouble with the map showing the correct location, be sure you enter your full address with no extra spaces or line breaks, and commas in the correct positions. You can also enter your address at Google Maps and see what the address corrects to, then enter that instead. Your address will appear as a clickable link that goes to your address on Google Maps.
If you see the following error in the widget…
Sorry. We can not plot this address. A map will not be displayed. Is the address formatted correctly?
… there are a few steps you need to take:
- The API key needs to be removed from the widget and saved as is. You’ll see an error message about API where the map should be now.
- The restrictions need to be removed from the key in the Google API Console and set to “none” and saved.
- Then add the API key back into the widget and save.
- Once the widget is working, then go back and enter restrictions as follows *.example.com/* just as they provide in their example where you replace “example.com” with your domain.