워드프레스나 다른 CMS에 구글 지도를 삽입할 때 다음 그림과 같이 "Google 지도를 제대로 로드할 수 없습니다" 오류가 발생하는 경우가 있습니다.
이 경우 먼저 구글맵 API를 발급 받아야 합니다. API 키는 https://developers.google.com/maps에서 발급 받았지만, 이제 이 링크를 클릭하면 Google Maps Platform(https://cloud.google.com/maps-platform/)으로 자동으로 이동하면서 곧바로 Google Maps API 키를 발급 받을 수 있는 화면이 표시됩니다.
Maps를 누르고 맨 아래 계속 옆의 아이콘을 누르면 새로운 프로젝트를 만들거나 기존 프로젝트를 선택할 수 있는 화면이 표시됩니다.
새로운 프로젝트를 생성하거나 지존 프로젝트를 선택하고 Next를 클릭합니다.
그러면 결제 계정을 만드는 것을 선택하는 화면이 표시됩니다. 취소를 클릭하면 처음 화면으로 되돌아갑니다. 결제 계정을 만들지 않은 경우 결제 계정 만들기를 클릭해야 정상적으로 진행될 것입니다.
위와 같은 화면이 표시됩니다. Firebase, Google Maps API 등을 포함하여 앱, 웹사이트, 서비스를 구축하고 실행하는 데 필요한 모든 기능을 이용할 수 있다고 안내하고 있습니다.
가입하면 300달러의 무료 크레딧을 받아서 12개월 동안 사용이 가능한 것 같습니다. 가입할 때 신용카드를 요청한다고 하네요.
저는 굳이 가입할 필요가 없어서 취소를 눌렀습니다. Google Maps API 키를 발급 받아야 하는 경우 결제 계정을 만들고 일반적인 방법으로 API 키를 발급받으면 될 것 같습니다.
Google Maps API 키를 발급 받으면 워드프레스 테마에서 제공하는 테마 옵션에서 키를 입력할 수 있습니다.
예를 들어, 아바다 테마의 경우 Avada > 테마 옵션 > 컨택트 폼 > Google Maps에서 구글맵 API 키를 입력할 수 있습니다.
Divi 테마의 경우 Divi > Theme Options > General에서 구글 API 키를 설정할 수 있습니다.
Google Maps API 키를 입력해도 문제가 발생하면 다음 글을 참고해보세요.
※ 추가: 신용카드 정보를 입력하지 않고 구글 API 키를 발급받는 방법은 여기를 참고해보세요.