Hi,
Sure, you may create this.
For this, first you have to generate Google Map Static API from here – https://mapstyle.withgoogle.com/
Now, add this snippet to your site and set your Static API –
add_filter( 'wcfm_google_map_api_url', function( $api_url, $api_key ) {
$api_url = 'SET YOUR STATIC API HERE';
return $api_url;
}, 50, 2 );
Add custom code(s) to your child theme’s functions.php
In case you do not have child theme then add those using this plugin – https://ww.wp.xz.cn/plugins/code-snippets/
Thank You
add_filter( ‘wcfm_google_map_api_url’, function( $api_url, $api_key ) {
$api_url = ‘https://maps.googleapis.com/maps/api/staticmap?key=MY API KEY¢er=47.65,-122.35&zoom=12&format=png&maptype=roadmap&style=feature:poi%7Celement:labels.text.fill%7Ccolor:0x747474%7Clightness:23&style=feature:poi.attraction%7Celement:geometry.fill%7Ccolor:0xf38eb0&style=feature:poi.government%7Celement:geometry.fill%7Ccolor:0xced7db&style=feature:poi.medical%7Celement:geometry.fill%7Ccolor:0xffa5a8&style=feature:poi.park%7Celement:geometry.fill%7Ccolor:0xc7e5c8&style=feature:poi.place_of_worship%7Celement:geometry.fill%7Ccolor:0xd6cbc7&style=feature:poi.school%7Celement:geometry.fill%7Ccolor:0xc4c9e8&style=feature:poi.sports_complex%7Celement:geometry.fill%7Ccolor:0xb1eaf1&style=feature:road%7Celement:geometry%7Clightness:100&style=feature:road%7Celement:labels%7Clightness:100%7Cvisibility:off&style=feature:road.arterial%7Celement:geometry.fill%7Ccolor:0xffe9d2&style=feature:road.highway%7Celement:geometry.fill%7Ccolor:0xffd4a5&style=feature:road.local%7Cvisibility:simplified&style=feature:road.local%7Celement:geometry.fill%7Cweight:3.00&style=feature:road.local%7Celement:geometry.stroke%7Cweight:0.30&style=feature:road.local%7Celement:labels.text%7Cvisibility:on&style=feature:road.local%7Celement:labels.text.fill%7Ccolor:0x747474%7Clightness:36&style=feature:road.local%7Celement:labels.text.stroke%7Ccolor:0xe9e5dc%7Clightness:30&style=feature:transit.line%7Celement:geometry%7Clightness:100%7Cvisibility:on&style=feature:water%7Ccolor:0xd2e7f7&size=480×360’;
return $api_url;
}, 50, 2 );
Hey this seems to make the map stop working, any idea? Thanks
Hi,
Well, I have found that, to use Google Map Static API you have to digitally signed this first.
Please check here for the process – https://developers.google.com/maps/documentation/maps-static/get-api-key#digital-signature
If still it’s not working for you then contact Google Map support directly.
Thank You
