How to display Google maps

On your website, Google maps are displayed thanks to the Google API Key.

This key is linked to your Google account and will allow 25000 views/month for free.

In the past, once this limit was reached, the maps would have stopped working on your website unless you had a paying option on your Google account.

Please note these conditions have changed on July 16, 2018, Google has updated its conditions and you'll be requested to enter your credit card information in your Google account in order to get a Google API key. 

You will not get charged by Google unless you go over the amount of 25000 views/month.

You'll find more information about the changes to your Google Account here.

If your account is impacted and if you want to keep using the google map feature, it's important that you can follow the Google migration process here.

Once you have your Google API Key, you need to enter it in Website Builder app> Preferences>Integrations.

Certainly! Here is the English version of the technical article and the FAQ, tailored for your Smily (formerly BookingSync) Help Center.

IMPORTANT
🔒 Securing Your Google Maps API Key: Advanced Configuration Guide

To display Google Maps on your Smily website, an API key is required. By default, if this key is not properly restricted, it can be used by third parties on other websites or to access expensive Google Cloud services (such as Gemini AI) at your expense.

Following recent security alerts (see The Hacker News article), we strongly recommend following these technical steps.

Important: These settings must be configured exclusively within your Google Cloud Console. Smily does not have access to these security parameters, as they are tied to your personal or business Google account.

1. Apply "Application Restrictions" (HTTP Referrers)

This step prevents any other website from using your API key.

• Go to the Credentials section of your Google Cloud Console.

• Click on the name of the API key used for Smily.

• Under "Application restrictions," select Websites (HTTP referrers).

• Add your website URL using wildcards (*) to cover all your pages:

  • Example: *.your-domain.com/*

  • Note: If you use a specific subdomain, add it as well: your-domain.com/*

2. Apply "API Restrictions" (Principle of Least Privilege)

By default, an API key can often access all services enabled in your project. It is crucial to limit it to mapping services only.

• On the same key configuration page, go to the API restrictions section.

• Select Restrict key.

• In the dropdown menu, check only the following APIs required for Smily:

  • Maps JavaScript API

  • Places API (if you use address search/autocomplete)

  • Geocoding API

• Ensure that AI-related APIs (Generative Language API / Gemini) are NOT checked.

3. Set Up Billing Alerts (Highly Recommended)

To avoid financial surprises in case of high traffic or a security breach, set up a budget threshold.

• Go to the Billing > Budgets & alerts menu.

• Create a monthly budget (e.g., $20).

• Set alerts to be sent via email at 50%, 90%, and 100% of the amount.

• Reminder: Google typically offers a $200 monthly free credit, which covers standard usage for most users, but an alert remains your best protection.

❓ FAQ: Google Maps Security & Billing

1. Why is my API key visible in my website's code?

This is normal behavior. To display Google Maps in your customers' browsers, your website must "call" Google's API using your key. Since this key is technically public, you must use domain restrictions (Step 1) so that it only works on your site.

2. Can Smily configure these restrictions for me?

No. Your API key is linked to your personal Google Cloud account and your own billing information. For security and privacy reasons, Smily does not have access to your Google Cloud Console. This process must be completed by the Google account owner.

3. I’ve never paid for Google Maps before; why should I worry?

Google currently offers a $200 monthly free credit. For the vast majority of Smily customers, this covers 100% of the costs. However, if your key is unrestricted and someone uses it for expensive services (like Gemini AI), this credit can be exhausted in minutes, leading to actual charges on your credit card.

4. What happens if I don't restrict my key?

Your Google Maps will continue to work normally. However, you remain exposed to "quota theft." If a malicious user uses your key for their own projects, your Google Cloud budget could skyrocket, or your map service could be cut off if you reach consumption limits.

5. I received an email from Google about "unrestricted keys." Is it serious?

This is an automated warning from Google notifying you that your key is vulnerable. Simply follow the steps in our guide (Application and API Restrictions) to remove this warning and secure your account.

6. How do I know if my key is properly protected?

In your Google Cloud Console, look at your list of API keys:

• 🔴 Yellow warning icon: The key is unrestricted (Action required).

• 🟢 Green checkmark (or no alert): Your key is correctly configured.

Need more help? Check out the official Google documentation on API key best practices.