Implement Google Maps JS on WordPress

First of all enqueue the Google Maps API js in the right way. look for a function which is hooked on wp_enqueue_scripts and wp_enqueue_script() to enqueue Google Maps API function wp_mk_scripts() { if ( is_singular() ) { wp_enqueue_script( ‘wp-mk-maps-js’, ‘https://maps.googleapis.com/maps/api/js’, array( ‘jquery’ ), null, true ); wp_enqueue_script( ‘wp-mk-gmaps-function’, get_stylesheet_directory_uri() . ‘/js/maps.js’, array( ‘jquery’ ), null, … Read more

Google Maps API in wordpress

Figured it out!!!!! Since we get the SQL query result with the help of “$wpdb” object we can access each row’s attribute as an associative array. As a result there isn’t a need for “mysql_fetch_assoc()” and “mysql_query()” functions. Also we need to define “$wpdb” object, so we require “wp-config.php” file.

create dynamic google map with iframe api

Step one: Familiarize yourself with Google Maps Embed API; and sign up for API key: The iframe embed option, unlike the Javascript API, does not have usage limits but does not have as many options/features. Determine which MODE you require and observe the required url format and parameters. Step two: Collect address from user. For … Read more

Maps search box autocomplete with callback JS function?

Try this in your js file: function robbte_map_initialize() { var input = document.getElementById(‘searchTextField’); var autocomplete = new google.maps.places.Autocomplete(input); google.maps.event.addListener(autocomplete, ‘place_changed’, function () { var place = autocomplete.getPlace(); if (!place.geometry) { window.alert(“Select a suggestion from the list”); return; } document.getElementById(‘city2’).value = place.name; document.getElementById(‘cityLat’).value = place.geometry.location.lat(); document.getElementById(‘cityLng’).value = place.geometry.location.lng(); }); } jQuery(document).ready (robbte_map_initialize);