워드프레스와 구글블로그를 운영하고 있는 제게 가장 불편한 점은 지도를 마음껏 넣을 수 없다는 것이었습니다. “지도만 넣을 수 있다면 참 좋을텐데…”라며 아쉬워하던 중 구글 지도, 카카오맵 등을 삽입할 수 있는 방법을 발견했습니다. 반가운 마음으로 저처럼 모르고 계시는 분들을 위해 포스팅을 작성합니다.
사이트에서 장소 검색 하기
저같은 경우 구글지도가 좋아서 구글이 제공하는 지도를 사용하고 있지만 혹시 카카오맵을 넣기 원하시는 분은 카카오맵으로 지도 삽입하는 방법도 함께 설명 드리겠습니다. 워낙 HTML을 멀리하는 네이버라 그런지는 모르겠지만 네이버지도는 HTML 공유버튼이 없네요. 일단 두 가지 방법을 진행하도록 하겠습니다.
1. 구글지도 삽입하기
여러분이 지도를 넣기 원하시는 부분에 ‘지도’라고 입력해 넣으세요. 그리고 구글 지도를 검색해서 자신이 찾고 싶은 위치를 입력합니다. 예를 들어, 저는 더숲초소책방을 검색했습니다.
더숲초소책방을 검색한 결과 화면입니다. 개요 밑에 있는 버튼 중에 공유라고 되어 있는 부분이 있습니다. 그 부분을 선택하면 링크 보내기와 / 지도 퍼가기 중 하나를 선택할 수 있는 부분이 나오는데 지도 퍼가기를 선택하시면 아래와 같이 HTML 복사 버튼이 나옵니다.
지도를 넣으시고자 하는 구글블로그나 워드프레스에서 html 모드로 변경합니다. 그리고 아까 지도를 넣고자 하는 곳에 ‘지도’라고 입력하셨으니까 지도를 검색하셔서 지도를 지우시고 복사한 html 링크를 그 자리에 복사해 넣으시면 됩니다.
2. 카카오맵 삽입하기
마찬가지로 지도를 삽입하기 원하는 부분에 ‘지도’를 넣으시고 카카오맵을 실행시켜 ‘더숲초소책방’을 검색해 보았습니다. 검색된 더숲초소책방의 박스 밑에 공유하는 버튼을 누르시면 URL 복사와 HTML 태그 복사 두 가지가 뜹니다. 그 중에서 HTML 태그 복사를 눌러 줍니다.
아래 왼쪽 이미지에 지도가 보여질 크기를 직접 입력하여 설정할 수도 있고 장소지정 아이콘을 바꿀 수 있는 옵션도 있습니다. 그리고 아래 소스 생성하기 버튼을 누르면 아래 오른쪽 이미지의 화면으로 넘어 갑니다.
일반지도와 이미지지도 두 가지 버전을 선택하실 수 있습니다. 여러분이 생각하는 지도를 넣고 싶다면 일반지도를 선택하시면 되고 이미지지도는 지도를 변경할 수 없고 사진 캡쳐처럼 지도가 삽입되는 것이라고 생각하시면 됩니다.
구글블로그, 워드프레스에 지도 삽입
직접 들어가서 여러 방법을 찾아 봤지만 네이버 지도는 삽입할 수 있는 html 버튼이 안 보이네요. 혹시 그 방법을 아시는 분이 있다면 댓글로 알려주세요. 생각보다 이렇게 쉽게 구글블로그나 워드프레스에 지도를 삽입할 수 있는 방법이 있어서 좋았습니다.
여러분도 위와 같은 방법으로 직접 워드프레스와 구글블로그에 지도를 마음껏 넣어서 활용해보세요. 이제부터 더 열심히 지도를 활용해야 겠습니다.