티스토리에 구글 지도 삽입하는 방법

티스토리에 구글 지도 삽입하는 방법을 알아보겠습니다. 막상 방법을 알고나면 너무 너무 쉽지만 몰랐을 땐 이렇게 하는지 감도 못잡았답니다. 

먼저 구글 지도에서 삽입하고 싶은 지도의 장소를 검색해줍니다. 저는 부산역을 검색했습니다. 그럼 메뉴 버튼 중에서 공유를 클릭합니다. 

공유에는 링크 보내기와 지도 퍼가기가 있습니다. 우리에게 필요한건 지도 퍼가기입니다. 

지도퍼가기를 누르면 HTML 주소가 나옵니다. 그럼 왼쪽에 있는 HTML 복사를 누르면 자동으로 지도의 주소가 복사가 됩니다. 

티스토리 글쓰기에서 지도를 넣고싶은 위치에 마우스 커서를 클릭하고 외부컨텐츠를 클릭합니다. 이 전까진 저도 외부컨텐츠를 어떻게 쓰는건지 몰랐답니다. 

이런 창이 뜨면 소스입력 창에 그대로 Ctrl +V 를 눌러 붙여넣기 해줍니다. 

width 는 지도의 가로사이즈, height 는 지도의 세로사이즈를 말합니다. 

여기서 width가 600이라고 되어있는데 구글 지도를 반응형으로 바꿔주려면 600을 100%로 변경해주면 됩니다. 

지도의 세로 사이즈를 변경하고 싶으면 height="450"의 숫자를 변경하면 됩니다. 그러나 width="100%"만 바꿔도 충분합니다. 다른 건 그대로 두고 width만 100%로 변경해준 뒤 확인을 클릭하면 아래와 같이 구글 지도가 삽입됩니다. 

반응형 지도이기 때문에 PC와 모바일에서 모두 가로로 꽉 차는 지도가 보여집니다. 

참 쉽죠? 지도 오른쪽 하단의 +, - 를 누르면 확대, 축소가 가능합니다. 

※ 이전 포스팅 

블로그 검색 누락 네이버 웹마스터도구로 해결

블로그 유사문서 확인 및 원본반영 요청하기

블로그저품질 탈출과 원인