Google Maps not Displaying on the Live Site

Google Maps not Displaying on the Live Site


Google Maps is an external service that lets you display your business's location in an interactive way. You can add a Map element to any block on your website. However, if it appears to be not working properly on the live site, this article will help you troubleshoot most common issues.

1. Check that you added a Google Maps API key

For the Map to work, you have to add a unique API key obtained from Google. This key basically authorizes your website to use the Map and lets your visitors interact with the Map properly. More on this — in our article Adding the API key to Google Maps.


2. Check for the errors in the Console

Sometimes, even if the API key has been added properly, the Map still may not be working. This could be due to a billing issue on Google's end or missing authorization. Here's how you can check your issue.


1. Open the live site.


2. Open the Developer Tools in the browser you are using. If you are using Chrome, open the menu in the browser window, select the option "More Tools," and then "Developer Tools":

3. Navigate to the Console tab:

4. Find a message for the Google Maps error. Usually there is the error name and a link to the Google Maps Help Center that will give more clarifications on how to resolve the issue. For example, on the screenshot below you can see that the error is called ReferrerNotAllowedMapError. If you click on the link beneath that error, you'll get a clearer explanation: https://developers.google.com/maps/documentation/javascript/error-messages#referer-not-allowed-map-error.



5. Make sure to follow the guides from Google Maps to resolve any issues with displaying their service on your website.


If you are still struggling to resolve the error, contact us in chat.




    • Related Articles

    • Adding the API Key to Google Maps

      After you have added Google Maps to your SiteCliq site, make sure to retrieve and add Google API key. This key is essential for displaying the map on your live site. Tip: for more information on how you can set up the map on your site, check the ...

    • Adding Google Maps

      Adding Google Maps to your site will benefit both you and your customers, providing your visitors with a detailed visual guide on how to find your company. Adding Google Maps 1. Firstly, add a block which contains a map from the Contact tab in our ...

    • Changing Site's Font

      Once you pick a template, it will come with a pre-defined site font which you can change to your liking. SiteCliq allows you to change a font family for the whole website or set a specific font for various typography (e.g. headings, titles, etc.). ...

    • Creating a Multilingual Site

      In case you serve the international audience, creating a multilingual site can help you improve your brand image and prove a customer-centric mindset of your business. More languages available on your website will attract more potential clients as ...

    • Adding Your Own CSS to the Site

      At SiteCliq you can add your own styling to the elements with the help of a custom CSS script. With the help of our tools you can place your code either to a particular page or to the whole site. Important: this feature is available for Pro sites ...