본문 바로가기

재테크 요정

티스토리 글에 구글 지도 넣는 방법! 생각보다 아주 간단해요 :)

  티스토리를 운영하다보면, 특정 장소의 위치를 지도로 표시해서 정보공유를 하곤 하는데, 우리나라에 있는 장소는 카카오 맵으로 표시 가능하지만, 해외에 있는 장소는 어떻게 위치를 보기 좋게 표시해서 포스팅하지? 라는 궁금증에 이것저것 시도해보다가 알게된 방법을 공유해보려고 한다.

 간단하게 소개하자면, 해외에 있는 장소는 구글지도를 사용할 수 밖에 없는데, 구글지도를 <html 블럭> 기능을 사용하여 아주 쉽게 연결, 첨부할 수 있는 것이다!

 

  해외여행 관련 정보(호텔 위치 비교, 관광지 동선 정보 등)를 포스팅할 때 유용하게 사용될 수 있을 것 같으니 잘 따라 오시길! 아주아주 쉬우니 걱정 노노! 그럼, pc 버전으로 설명 시작해보겠다 :)

 

1. 구글맵에 접속해서 원하는 장소를 검색한다.

티스토리에 구글지도 첨부하기

 

 

2. 지도 공유를 클릭한다

티스토리에 구글지도 첨부하기

 

 

3. <지도 퍼가기>를 클릭한다.

티스토리에 구글지도 첨부하기

 

4. 첨부할 지도의 크기를 선택한다.

티스토리에 구글지도 첨부하기

   지도 퍼가기에 들어가면, <중간▼>으로 되어 있는 버튼이 있는데, 이 버튼을 클릭하면 내가 글에 지도를 어느정도 크기로 첨부할지 조절할 수 있다. 선택지는 작게 / 중간/ 크게 / 맞춤크기 요렇게 4가지로 구분되어 있는데, 맞춤크기를 선택하면 내 티스토리 스킨에 알맞게 크기를 조절하여 넣을 수도 있으니, 참고! 내 티스토리는 가로폭이 860이어서 나는 구글지도를 가로 860, 세로 500정도로 크기 조절하여 첨부했었다.(내 티스토리 스키는 Whatever 스킨이다.)

 

 

5. HTML 복사를 클릭한다.

티스토리에 구글지도 첨부하기

 

6. 지도를 넣고 싶은 부분에 입력커서를 위치해놓고, 티스토리 글 편집창 중 더보기를 클릭-> HTML 블럭창을 클릭한다.

티스토리에 구글지도 첨부하기

 

 

7. HTML 삽입 창이 뜨면, 구글 지도에서 복사한  HTML 주소를 붙여 넣기 하고 확인을 누른다.

티스토리에 구글지도 첨부하기

 

 

8. 구글지도 첨부 실행 결과 화면

티스토리에 구글지도 첨부하기

  이렇게 HTML 삽입 블럭이 포스팅에 들어가고, "미리보기할 수 없는 소스"라고 뜨면 정상적으로 첨부된 것이다. 글을 쓰는 동안에는 티스토리에 첨부된 구글지도를 확인할 수 없지만, 글을 완성하고 포스팅을 완료하면 완성된 글에서는 첨부한 구글지도를 확인할 수 있다. 

 

  내가 직접 티스토리에 구글지도를 첨부해서 쓴 아래의 포스팅을 참고하길 바란다.

 

https://kimjuzan123.tistory.com/26

 

[하와이 호텔 비교] 힐튼 가든 인 vs 센트릭 하얏트 vs 프린스 와이키키 vs 쇼어라인 와이키키 vs

요즘 코로나로 인해 못갔던 신혼여행을 대신할 하와이 여행을 준비하는 중이다. 항공권은 하와이안 항공으로 예약을 마쳤고, 이제 숙소를 골라야 하는데..!! 오하우에 5박 있는 동안 계속 한 호

kimjuzan123.tistory.com

 


 

  오늘은 티스토리 동료(?)들의 구글지도 첨부의 어려움을 해결해주기 위한 정보를 공유해보았당. 해외 장소를 포스팅하기에 아주 좋고, 캡처가 아닌 HTML주소를 활용하여 첨부하는 것이기 때문에 내가 작성한 포스팅 안에서 구글지도를 조작할 수도 있어서 아주 유용하다가고 할 수 있다. 매우매우 간단한 작업이니, 필요한 적재적소에서 유용하게 사용되길 바란닷 :)