I created a wordpress website and I use google map API. I would like to add restrictions to prevent troubles. So I get the IP of the website from my hosting services and I also ping it to double check. I added it on the list of authorized IP but I still have an error message (Google Maps JavaScript API error: RefererNotAllowedMapError) and it is impossible to display a card. I can't understand what am I missing there. To be …
https://www.hammertonbrewery.co.uk/site/tint-nitro-london-dry-stout-4-3/ On the webpage above I need to do the below on my GOOGLE MAP: – Reduce width of MAP – Ensure MAP is in the centre of the page Any help advice on how to do this would be greatly appreciated. Thank you
I would display Google maps markers on custom site temple with Google API maps. I do everything like this post: Integrating PHP into Javascript to display map markers with Google API But a console gives me an error, I don't know where I can look for the error. (index):774 Uncaught (in promise) ReferenceError: storeData is not defined at initMap ((index):774) at js?key=AIzaSyAg-GBNbwLWCxiN-UI-0COkr1bgAKpXjQU&callback=initMap:123 at js?key=AIzaSyAg-GBNbwLWCxiN-UI-0COkr1bgAKpXjQU&callback=initMap:123 I think the WordPress first try to use wp_localize, then load jquery. Or Wordpress don't know …
I was able to insert custom html into my gutenberg wordpress editor (hosted by bluehost) and test my code by preview with no problems. I made calls to google maps and fetch() to get a list of locations to plot on the map as markers. 2 days later, I was no longer able to save any javascript changes to my post. I tried deleting the post and starting a new post. I deleted my javascript code to insert something simple …
How can I get input value after google maps autocomplete on a add post (listing) page? I have added some js code: jQuery( "#job_location" ).blur(function() { var value= jQuery( "#job_location" ).val(); console.log(value);//this should display '1250 Waters Place, The Bronx, New York, Statele Unite ale Americii' , but it doesn't });
I am looking to implement this code on my wordpress site as efficiently as possible https://developers.google.com/maps/documentation/javascript/styling and I only want the JS to load on posts/pages that I will be using the map. Can't figure out how to start with this! EDIT: What if I use the enqueue part inside the function ? Is this a good construct? function x_shortcode_google_map( $atts, $content = null ) { extract( shortcode_atts( array( 'id' => '', 'class' => '', 'style' => '', 'lat' => …
I am struggling with using a callback for my Google Maps API. I am trying to have a Goolge Maps autocomplete search box and collect the Lat and Long for the searched location. I've found this answer that works really well, but sometimes the search box won't load the location suggestions. I've found that this might be caused by the google.maps.event.addDomListener(window, 'load', initialize); that I use. Instead I've found that I need to use a callback in my script. I …
I am looking for a solution to query nearby locations based on a given lat and lng value, using ACF maps field. All I currently have is a lat and lng search value (that I want to use to search for nearby locations) and I know that ACF is storing the lat/lng info for each location in a array, that can be obtained by <?php $google_map = get_field('adres'); $lat = $google_map['lat']; $lng = $google_map['lng']; ?> How can I query through …
I want to display one google custom map with javascript, I set this code in a code module, but when I post it only appear the code and not the map, how can I display my map correctly? The code works in a .html file . Thanks in advance <div id ="map" style="height:500px"> </div> <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAYNLXo8S5TxDJKElasñdkfIIRFEzeECQZ8&callback=initMap&libraries=&v=weekly" defer></script> <script type="text/javascript"> "use strict"; let map; function initMap() { map = new google.maps.Map(document.getElementById("map"), { center: { lat: 40.6059969, lng: -3.706213, }, zoom: 13, …
I have embedded a map on the third tab on a page. Page here > 'Itinerary' tab If you go straight to the tab while the page is still loading - it loads the map perfectly. However, if you wait until the page has fully loaded and then click on the tab 'Itinerary', the map loads totally zoomed out and not where it should be. I have tried entering all the details like <iframe src="http://ridewithgps.com/routes/1342529/embed" height="500px" width="100%" frameborder="0" http://maps.google.com/maps?ll=43.790716,4.166708&z=8&t=m&hl=en-GB&gl=US&mapclient=apiv3&skstate=action:mps_dialog$apiref:1&output=classic></iframe> but …
Recently, a client contacted me to make a few modifications on their website. Now consider that I'm not the person who made this website. It was supposed to be easy ; add a few lines here and there, change the contact information, update the address shown on the google maps and voilà ! But unfortunately, things didn't go so well for that last part. When you go on their website, in the contact page you see this google maps and …
I have an issue and I would be grateful for any ideas! I'm using a simple template bought at ThemeForest and I successfully added google maps autocomplete functionality for addresses in a field via a script on the contact 7 form (so far so good). However, when I make the window narrow (or I look at the website on the cellphone) the autocomplete script doesn't work. What could cause this?? big screen: https://i.imgur.com/EYnJqG7.png small screen: https://i.imgur.com/PuqQjv8.png
I'm planning a custom WordPress theme where the Custom Post Type (CPT) will have latitude and longitude coordinate as it's meta value. The latitude and longitude will be displayed as a Marker in a Google Map. So far I don't have any problem in showing the Google Map and the CPT as it's Marker. That is if I query the CPT using the default order. The problem occurs when I need n CPTs that is closest to a coordinate whether …
I'm trying to get my head around developing a delivery app for restaurants where I make a a WP site with WooCommerce and a local payment gateway. I need the app to only allow registrations from addresses a certain distance, in accordance with how far the store wants to do deliveries. I'm pretty sure you can integrate Google Maps API into the registration forms, I'm just not quite sure how to do it. EDIT: As comments have noted it probably …
I have an option page where i can create maps, i created a custom field to paste my own styles. What i need to do is pass this informations in my maps.js. What i have done is create an hidden div like this (i'm using timber) : <div class="hidden" id="map-styles">{{ options.map_styles }}</div> Then in maps.js i get this informations like this : function initMap($el) { // Find marker elements within map. var $markers = $el.find(".marker"); var styles = document.getElementById("map-styles").textContent; // …
I'm trying to build a site where people can ask and offer help to each other. The idea is that people could publish "help needed" and "help offered" posts by filling in a simple form (with address data etc.). The posts would then be displayed on Google maps. This way it would be easy to find people that are in need of help as well as those that are available to help. I'm novice with WP, so I'd need some …
I had some working javascript code that I wanted to move out of the template file and put into a .js file. I moved the code into a front.js file, where some pre-existing javascript lives. Now I'm trying to add the Google Maps API javascript file like so: /** * load css/js into frontend pages */ function eng_dealer_map_css_js() { # removed CSS as is irrelevant # add js wp_register_script( 'eng_dm_front', plugins_url('pub/js/front.js', __FILE__), ['gmap'], null, true ); wp_register_script( 'gmap', 'https://maps.googleapis.com/maps/api/js?key=APIKEY&callback=initMap&libraries=geometry', [], …
I'm using Elfsight Google Maps Plugin Version 2.1.0 in my WordPress website to create an interactive map. 1- I can’t find the image field in the description section like in the demo to upload an image to my location, and i get google building image by default for every location i create. 2- Also the pointer doesn't load i must enter "plus codes" instead of address so the location can be loaded. Can anyone help me with that?
I want to insert a Google Map into Wordpress without paying for a plugin. I just want to adjust the style, add a few markers and add a description to the makers. Therefore I simple used the example code from Google Maps and adjusted the style. So far so good. The question is now, how can I insert my code? It is more or less like this: https://developers.google.com/maps/documentation/javascript/examples/map-simple If I can't add the code directly do you know any free …
I have managed to show multiple markers but I can't show the post title and to make the same post title as URL to go to a single page. Here is the code in functions.php $args = array('post_type' => 'post',array( 'meta_query' => array( 'relation' => 'AND', array( 'key' => 'lng', ), array( 'key' => 'lat', ) ) )); $loop = new WP_Query($args); while ( $loop->have_posts() ) : $loop->the_post(); $title = get_the_title(); $post_category=get_the_category(); $post_category_name=$post_category[0]->cat_name; $permalink=get_the_permalink(); $lng = get_post_meta( get_the_ID(), 'lng', TRUE …