본문 바로가기
생활 정보/디지털 정보

웹사이트에 구글 맵 지도 iframe 삽입하기

by Maru_H 2023. 7. 28.

웹사이트를 제작하다가 보면 지도를 연결해야 되는 경우가 있다. 지도에 여러 가지 표시를 하거나 지도에 특별한 기능을 추가해야 한다면 카카오 지도와 같은 API를 사용하여 웹사이트에서 지도를 연결하고 활용할 수 있다. 하지만 단순히 주소 위치만 보여주면 된다면 구글 지도를 활용하면 아주 쉽게 웹사이트에 지도를 나타낼 수 있다.

 

구글 지도 사용하는 방법

 

https://www.google.com/maps

 

Google Maps

Find local businesses, view maps and get driving directions in Google Maps.

www.google.com

 

구글 맵 웹사이트에 접속해서 원하는 장소를 검색한다.

글쓴이는 롯데타워를 검색해 보겠다.

 

구글지도 롯데월드타워

 

검색한 결과가 나타났다. 그리고 공유 버튼이 활성화된 것을 확인할 수 있다.

공유 버튼을 눌러보자.

 

구글 지도 공유 버튼

공유 버튼을 누르면 위와 같은 창이 뜨게 된다.

링크 보내기, 지도 퍼가기 버튼이 활성화되어 있다. 지도 퍼가기를 눌러보자.

 

구글 지도 퍼가기

해당 위 사진을 보면 iframe 코드가 나타난 것을 확인할 수 있다.

Html에 이 코드를 붙이면 내 웹사이트에 지도가 바로 보인다.