Support

Account

Home Forums Front-end Issues Map issue in front end form

Helping

Map issue in front end form

  • Hello.
    I’m having an issue with the google map field in a front-end form. I’ve been strugling with this for weeks. The maps are working fine in the back-end and in the front-end but it seems impossible to make it work in a front-end form.
    The form allows the users to post locations but I can’t manage to make the map field work properly. While I work in local, the map is showing but the field doesn’t work and it’s impossible to select a location. And when I try online, the map is not even showing, I have a grey background and “oops! something went wrong”.
    I have a javascript error saying “Google Maps API error: MissingKeyMapError https://developers.google.com/maps/documentation/javascript/error-messages#missing-key-map-error
    It seems that the API is missing but I put it in my function.php file like this :

    function my_acf_google_map_api( $api ){	
    	$api['key'] = 'MYKEY';
    	return $api;
    }
    add_filter('acf/fields/google_map/api', 'my_acf_google_map_api'); 

    and also like this :

    wp_enqueue_script( 'google-map', 'https://maps.googleapis.com/maps/api/js?key=MYKEY', array(), '3.exp', false );

    and it’s working fine everywhere else.

    Did I miss something ?
    Thank you for your help.

  • Ok, I finelly figured it out.
    Looking at the code I noticed that in the back-end there was this script that weren’t in the front end so I added it in my form page and now the map is showing and the field is working fine :

    <script type="text/javascript">
    acf.fields.google_map.api = {"libraries":"places","key":"MYKEY"};
    </script>

    I looked at google-map.php from the plugin code and it seems that the function input_admin_footer() which is calling acf/fields/google_map/api is used only for the back-end but not it the front-end, which caused my isue.

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.