Contact page – background map disappeared

[Lukasz]

Hi there,

I’ve just updated my site to the newest Agama Pro and have got an issue with a map in the contact page that disappeared. After the update I’ve generated the Site Key, Secret Key and Map API Key but it did not help. The background is still blank.

Would appreciate any help on the above issue.

with kindest regards,

Luka

[Zex]

Hello, Luka!

It appears the Google Maps API is being loaded more than once on the page, which is causing an issue with your map. Please disable your another google map API(most likely from the some of the additionally installed plugins)

https://prnt.sc/r4dzd8

Regards

[Lukasz]

Hello, Zex!

Thank you for your prompt response, I appreciate it.

I still can’t solve the issue. I might have generated a few other API keys by my former attempts to launch the map, but I am not sure where to locate them. Also I did not use Api Map keys to any of the plugins installed. I was only using/generating them for the contact page in the Agama Pro theme. Would appreciate if you could provide me with any further help or suggestions. Thank you!

Luka

[Zex]

Hello, Luka!

I have fixed the problem with the double loading Google Map API, but now I see the other error that you have:
https://prnt.sc/r4yybq

Geocoding Service: You must enable Billing on the Google Cloud Project at https://console.cloud.google.com/project/_/billing/enable Learn more at https://developers.google.com/maps/gmp-get-started For more information on authentication and Google Maps JavaScript API services please see: https://developers.google.com/maps/documentation/javascript/get-api-key
_.$c @ js?key=AIzaSyA5K2Kxwdx8yvugGI2LvnNOkK9db20EjB4:58

Please check the API key.

Regards

[Lukasz]

Hi Zex,

thanks for the help. But does it mean that google will charge me for using the map on the contact page? I’ve been using the map for 3 years now without any prior changes or enabling the billing on the Google Cloud Project. Now I’, not sure if this does not cause any further extra costs which i’d like to avoid especially these harder days.

Lukasz

[Zex]

Hello Lukasz!

As far as I know, it is free of charge.

Anyway, If you want to avoid the google maps,
here is a workaround :

1. Navigate to https://www.openstreetmap.org/#map=11/45.4050/12.2958

2. Search for the place you want to have as a background. https://prnt.sc/rl4xdd

3. Zoom in if needed, then click on the “Share” button.
4. Download your view (map) as an image.
https://prnt.sc/rl4y7w
5. Edit your “Contact” page.
6. Scroll down to the bottom of the page,
and Insert the downloaded map image as a custom page background image.
https://prnt.sc/rl50qo

Please let me know if this method works for you.

PS. You may need to add the following custom code in Customization-> General-> Additional CSS:

.page-template-contact #page.site{
  background-position: center; 
  background-repeat: no-repeat; 
  background-size: cover;
}

Stay safe!

Best Regards

• This reply was modified 3 years, 3 months ago by Zex.
• This reply was modified 3 years, 3 months ago by Zex.

[Author]

Posts