Google Maps API Javascript in Wordpress

Question

Hope you guys can answer this question! I\'m thinking it should be relatively easy but I just can\'t seem to get to grips with it.

How do you go about loading the G

Answer 1

With WordPress you should never hard code js into the header or footer. Instead use wp_enqueue_script inside a function hooked into the wp_enqueue_scripts action in functions.php. For example:

function add_scripts() {
  wp_enqueue_script('google-maps', 'https://maps.googleapis.com/maps/api/js?key=AIzaSyBuU_0_uLMnFM-2oWod_fzC0atPZj7dHlU&sensor=false');
  wp_enqueue_script('google-jsapi','https://www.google.com/jsapi');     
}
add_action('wp_enqueue_scripts', 'add_scripts')

You would want to prefix the function name with a unique slug. You could add dependencies version numbers or move it to the footer with additional variables, see the codex for more info. In your case you probably want to wrap wp_enqueue_script in a conditional so it only loads on the posts or pages you need it for.

Answer 2

I just had a look at your http://runforlifeuk.com/rhedeg/wp-content/javascript/trefilmap.js file

you shouldn't have <script> tags in that!

<script type="text/javascript"
src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBuU_0_uLMnFM-2oWod_fzC0atPZj7dHlU&sensor=false"></script>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">

I would suggest you to have a look at the javascript console for errors and learn using wp_enqueue_script() to add javascript to your pages.