Manually add a Google Maps API key

New Google Maps may not appear as expected on your website. This is because Google requires your API key. Read the instructions on how to solve this.

If you want to show Google Maps on your website, you need an API key from Google. This is also true for the maps generated by our Google Map widget. The purpose of the API key is mainly to count how often your Google maps are viewed on the web. There is a free allowance, after which Google will start to charge you for your use of their mapping software.

When we developed the Google Map widget we felt that the use of it would be minor and that there would be no need for the API key. Until June 2016, Google allowed this, but since then they have hardened their license restrictions. Now we see Google refusing to show maps if the API key is missing. The error message looks like this:

Screenshot of the error message you get for a Google Map without an API key

In version 9 of the program, we added the ability to specify the API key on the Workbook tab of the task pane. If you have an older version, you must manually add your API key into the generated code to ensure that the map request is approved by Google. This help page contains the instructions on how to do this.

Obtain a unique Google API key

You must register as a web user of Google’s services. If you or your company don’t already have a unique Google API key, you can request one for free from Google.

Convert the spreadsheet that contains the widget

Open a spreadsheet that contains a Google Map widget in Excel. Move to the SpreadsheetConverter ribbon and click Convert to convert the spreadsheet to web format.

Locate the converted web page

Normally, the converted web page is stored in your Documents > SpreadsheetConverter folder. If you don’t find it, the location may have been changed in the SpreadsheetConverter ribbon > Options > Browsers and Conversion Path Option.

In the folder with the converted web pages, each conversion result is stored twice: 1) uncompressed in a folder and 2) compressed in a ZIP file. We recommend that you delete the ZIP file, then edit the uncompressed version. If you intend to upload the calculator using the WordPress Plugin to Import Spreadsheets from Microsoft Excel you must then compress the updated folder into a new ZIP file before you upload it with the plugin.

Edit the converted web page

In the folder with the conversion output, you will find a main .htm file that is bigger than the others, with the same name as the spreadsheet, e.g. example.htm. For some flavors, it may instead be called index.htm. Open this file in a text editor.

Search for a section at the end of the page source that looks like this:

<script>document.write("<script type='text/javascript' src='" + (document.location.protocol == 'https:' ? 'https:' : 'http:') + "//map.google.com/maps/api/js' defer></script>");</script>

This is the code we use to generate a Google Map widget on the web page. Now edit this code snippet to look like this:

<script>document.write("<script type='text/javascript' src='" + (document.location.protocol == 'https:' ? 'https:' : 'http:') + "//map.google.com/maps/api/js?key=Ank-vGEyklDRtmT_rPUgzgjCEzYWrGj7AIzaSyD' defer></script>");</script>

The key in bold in the example above is made up, it is just an example and won’t work for you. You must insert your own API key that Google has sent you for the script to work properly.

If you use more than one Google Map widget in the page, all map views will be attributed to the API key you just added. Save the edited file. Compress the entire folder to a ZIP file if this is required when you upload the calculator.

Upload the web page

There are many ways to upload a converted spreadsheet to a web page and there is no room to document them all here. You may be using FTP against a local website or the WordPress Plugin to Import Spreadsheets from Microsoft Excel. Just follow the same procedure that you used the previous time you uploaded the calculating web page.

Test the web page

When you have uploaded the web form or calculator and embedded it into your blog or website, open it in your browser and verify that all Google maps appear correctly.

If you still get the error message above, you may be viewing a cached version of the page. Use the View Source option of your web browser to verify that the API key you inserted is indeed present in the HTML source for the web page you are viewing. If it isn’t, clear any caches in your web browser and web server until the API key is really present in the source for the web page.

If the error persists you may need to double-check the file you edited against the instructions above. It is programming code and it must follow the JavaScript syntax requirements.

We are always here to help you succeed with SpreadsheetConverter. Please contact our Help Desk if any of your Google Maps still don’t appear properly on your website.

Repeat for every future conversion

You need to update this every time you convert the spreadsheet, since every conversion overwrites the previous conversion results.