0

I'm setting up a google map on my site and I'm trying to set the enqueue my scripts up but am getting an error:

I have placed this code in my functions.php (actual api key not used here):

function rt_load_acf_map()
{
    // Register my scripts for my theme:
    wp_register_script( 'map-script', get_stylesheet_directory_uri() . '/js/acf-map.js', array( 'jquery' ) );
    wp_register_script( 'googlemap', 'https://maps.googleapis.com/maps/api/js?123123123123' , '', '', false );
    wp_register_script( 'slider-script', get_stylesheet_directory_uri() . '/js/slider.js', array( 'jquery' ) );

    // For either a plugin or a theme, you can then enqueue the script:
    wp_enqueue_script( 'map-script' );
    wp_enqueue_script( 'googlemap' );
    if(is_front_page()){
        wp_enqueue_script( 'slider-script' );
    }
}
add_action( 'wp_enqueue_scripts', 'rt_load_acf_map' );

the map loads on the front end but with an overlay error:

This page can't load Google Maps correctly.

In my console I see this error:

Google Maps JavaScript API warning: NoApiKeys https://developers.google.com/maps/documentation/javascript/error-messages#no-api-keys

and when I look at the page source i see that &#038 and then the version were added:

<script type='text/javascript' src='https://maps.googleapis.com/maps/api/js?123123123123&#038;ver=4.9.8'></script>

EDITS

The api key is correct and working. That's not the issue.

Secondly, when I remove the wp_register_script and its wp_enqueue and just use this line:

wp_enqueue_script( 'google-maps-api', '//maps.googleapis.com/maps/api/js?key=123123123123', array(), '', true );

Everything works fine.

I can't figure out why it's not working as wone line and with the http in front of google maps url.

closed as off-topic by Krzysiek Dróżdż, Pat J, Jacob Peattie, cjbj, bosco Dec 10 '18 at 7:04

This question appears to be off-topic. The users who voted to close gave these specific reasons:

If this question can be reworded to fit the rules in the help center, please edit the question.

  • There's a link right there in the console that explains what the problem is. What's not clear? – Jacob Peattie Nov 27 '18 at 16:15
  • @JacobPeattie Thanks for your help. What's not clear is why i'm getting that message. I understand what that message means, but the api code is being sent Additional information added above as well. Thanks again. – rudtek Nov 27 '18 at 16:24
3

When you call google, the key variable name is missing.

wp_register_script( 'googlemap', 'https://maps.googleapis.com/maps/api/js?123123123123' , '', '', false );

Should be :

wp_register_script( 'googlemap', '//maps.googleapis.com/maps/api/js?key=123123123123123123123123' , '', '', false );
  • arghh!!!! That was it. I knew it was something! – rudtek Nov 27 '18 at 19:32
  • 1
    argh indeed, so easy to do even when all the clues yell 'typo' – shanebp Nov 27 '18 at 19:57
1

Setting the $ver parameter to false (or, probably, '', as you've done), will append the current WordPress version to the <script> tag. To have no version number appended, use null instead:

wp_register_script( 
    'googlemap',
    'https://maps.googleapis.com/maps/api/js?123123123123',
    array(),
    null,
    false
);

(Also, the $deps parameter should be an empty array rather than an empty string, which is also addressed in the code above.)

However: I don't think this is the actual problem you're having. The error message in your question suggests that you don't have an API key for Google Maps, which is an issue you'll have to sort out with Google.

Reference

wp_register_script() docs

  • Pat, Thanks for the answer. It definitely isn't the issue. I added a bit more above to my question if that helps any. I appreciate the assistance. – rudtek Nov 27 '18 at 16:25

Not the answer you're looking for? Browse other questions tagged or ask your own question.