Map Markers + Google API

Support
#1

Hey guys, I have read all these posts on map and markers and still doesn’t work.

I am using the Agency theme and would like to utilize the map on the home and contact page.

I have the latitude numbers but I can’t figure out how to find the markers. I also got an API key.

Please help me…

#2

Hello @LucyKeile,

Thanks for writing in!

To create a map marker, you can simply insert the same longitude and latitude for the map makers. For more details, please check out this documentation:

If nothing is helping, provide us access to your site so that we can check your settings. Please create a secure note with the following info:
– Link to your site
– WordPress Admin username / password
​
To know how to create a secure note, please check this out: https://theme.co/apex/forum/t/how-to-get-support/288

We would love to know if this has worked for you. Thank you.

#3

I tried! Do you think it could be related to the Google API key?
I need your help I need this site to be live for the client tomorrow

I will post a secure note

#4

Hello @LucyKeile,

As it turns out, there is an API error which is why the map is not showing:

js?v=3&key=AIzaSyADZZKbnuXIdetYmDzzZ7xerqERy8WsWpQ&ver=5.3.2:56 Google Maps JavaScript API error: ApiNotActivatedMapError
https://developers.google.com/maps/documentation/javascript/error-messages#api-not-activated-map-error

Please double check your API key.

Hope this helps.

#5

That was it - I did not have the javascript map API enable - I have just map enable.

I could not fifure out how to use the https://mapstyle.withgoogle.com/ si I changed my map for the classic map so I could manipulate the hue.

I have a few questions…

  1. When you open the marker there is a place to add the text which I have add the business name - how can I change the colors the name is displayed or the button color.
  2. Can the marker color be changed to blue?
    3.What is that image for? Should I upload a picture of the map???

Thanks for your help!

Lucy

#6

Hey Lucy,

  1. Regretfully there are not much options to customize the info windows, however you probably can customize it with custom CSS (see code example below)
  2. Yes you can, simply create a marker image in blue color and upload it in the Image field (see the third point for more details).
  3. The Image field is for the marker image. This will replace the default marker icon with your own Image. As if you want to show a blue marker, you can simply upload the image of blue marker.
.gm-style .gm-style-iw-d div {
    box-sizing: border-box;
    overflow: auto;
    color: #f00;
}

Please note that the code provided above serves as a guide only and is to help you in getting started so implementing it and maintaining the code will be out of our support scope

Here are some related links for further reading, this could help you in finding and implementing some CSS fixes:

Hope this helps!

#7

I will try this… I thought when you click on the map would take you to that address in google maps - how do we do that?

#8

Hey @LucyKeile,

Perhaps this guide will help insert a map to your site:

Thanks.

#9

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.