Charitable Geolocation
Installing Charitable Geolocation is the same as installing any other Charitable extension. If you’re not sure how to do that, we recommend first reading our guide to installing Charitable extensions.
Setup
The Geolocation feature is built on Google Maps and requires a Google Places API Key to work. To create an API Key:
- Go to https://developers.google.com/places/web-service/
- If you have not logged in already, log in to your Google account.
- Click on the Get a Key button at the top right of the page.
- A popup will appear allowing you to select an existing project or a new project. Unless you already have a project for your website, select “+ Create a new project” and click on Next.
- Copy the API key and store this for the next step.
Next, open up your WordPress dashboard:
- Go to Charitable > Settings > Extensions.
- Paste in the API key you generated previously into the Google Places API Key field.
- Click on Save Changes.
Usage
Adding a Location to a Campaign
Once the plugin is setup, you can add a location to a campaign by editing the campaign in the WordPress dashboard. You will see a new Location tab in the advanced campaigns settings area:
Google Maps-powered location search for your campaigns
Type in an address or location for your campaign (it must be at least 8 characters long) and click Update to save the campaign.
Charitable Ambassadors integration
After installing the plugin, a new Location field is automatically added to your public campaign submission form.
A location field is added to the campaign form when you are using Charitable Ambassadors
Adding a Campaigns Map to a Page
Once you have set locations for your campaigns, you can add a Google Map displaying your campaigns by location, using the [campaigns]
shortcode.
A beautiful Google Maps-powered map displayed with `[campaigns map=1]`.
map=1
as a shortcode attribute. You can also set the width, height and zoom level of the map. Example:[campaigns map=1 width=900px height=600px zoom=5]
Read more about using the [campaigns] shortcode.
Troubleshooting
If you find that your maps are not loading as expected, there may be a problem with your Google Places API Key. To troubleshoot this, you can view what the specific error is by opening your browser’s Javascript console. If you’re not sure how to open your browser’s Javascript console, you can follow these instructions.
Error messages in the Javascript console will start with “Google Maps API error” and will include the specific error code and a link to find out how to fix the issue. An example is shown below:
An example of a Google Maps error message in the Javascript console.