Google Maps not working in Contact Form

  • Hi,

    I am trying to use the contact form (Contact Form 7) with Business One, however the Google Map does not show up and gives the following error “This page didn’t load Google Maps correctly. See the JavaScript console for technical details”.

    I think this has to do with the Google APIs. Did someone encounter this problem and if yes how was it fixed?

    NB : My current suspicion is that the “Contact Template” in the Pages Section needs its code amended to cater for the API. Just my hunch at the moment however ??

Viewing 4 replies - 1 through 4 (of 4 total)

  • Hi,

    I am having same problem of contact form.The Google Map does not show up and gives the following error “This page didn’t load Google Maps correctly. See the JavaScript console for technical details”.

    Please anyone can help to resolve the problem.

    I have a similar issue where the marker does not show, although the map does on my colleague’s website, https://www.unicornpublishing.com.sg

    Googled and found this https://www.wpgmaps.com/documentation/creating-a-google-maps-api-key/

    As from 22 June 2016, all calls to the Google Maps API require an API key. In the past, Google Maps API allowed you to make calls to the API without an API key – this has changed.

    I have an api now, but don’t really know how to integrate it into the theme. Can the developer help?

    For a temporary fix, I’ve embedded a google map with the location I want into the Contact Page template (section-contact.php) within <div class=”google-map”> and hidden the in-built map.

    If you need an embed code, just click on the hamburger menu on google maps once you’ve found your location. Do tell me if you have any issues with this.

    Hi seylavee,

    Can you please tell me how you embedded a google map in Page template (section-contact.php).
    Please tell me the steps to optimise the map on website.

    Hi jiteshkerkar1,

    Not sure what you mean by optimising it.

    To get the embed code for google maps:
    1) search your location on maps.google.com,
    2) Click on the hamburger menu (those 3 lines at the top left corner of maps)
    3) Click “Share or Embed Map”
    4) Click “Embed Map” and save the iframe code.

    In your wordpress dashboard > appearance > editor:
    1) Open section-contact.php
    2) Find <div class=”google-map”> and enter the iframe code there
    3) Hide the rest of the theme’s map code with <!– and –> before the closing of the google-map div.

    That’s how i did mine.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Google Maps not working in Contact Form’ is closed to new replies.