[티스토리 글쓰기] 블로그 구글 지도 넣기

728x90

목 차

• 1. 구글 지도 페이지 접속
• 2. 장소 검색하기
• 3. 장소 공유 지도 퍼가기
• 4. 구글 지도 HTML 복사
• 5. 티스토리 HTML 글쓰기 모드

반응형

해외 지역 지도가 필요한 티스토리 블로그 글을 작성할 때 티스토리에서 지원하는 카카오 지도로는 해외 지역 지도를 넣을 수가 없습니다. 카카오 지도가 국내만 지원하기 때문일텐데요. 이런 경우에 구글 지도(구글맵)를 가져와서 티스토리 글 작성시에 넣어줄 수가 있습니다. 해당 방법에 대하여 포스팅하도록 하겠습니다.

 

1. 구글 지도 페이지 접속

구글 지도 페이지 접속하기

PC에서 구글 지도를 검색해서 접속합니다.

 

---

 

2. 장소 검색하기

구글 지도 간사이 국제공항 검색하기

원하는 장소를 검색합니다.

예를 들어, 해외 일본에 있는 간사이 국제공항을 검색해서 넣어보겠습니다.

장소를 검색한 후에 화면 좌측에 위치한 공유 버튼을 클릭합니다.

 

---

 

3. 장소 공유 지도 퍼가기

장소 공유 지도 퍼가기

공유 팝업창이 나타나게 됩니다.

공유 팝업창 위쪽에 지도 퍼가기 탭을 클릭합니다.

 

---

 

4. 구글 지도 HTML 복사

구글 지도 HTML 복사하기

구글 지도 장소 공유를 위해 HTML 복사 버튼을 클릭합니다.

 

---

 

5. 티스토리 HTML 글쓰기 모드

티스토리 HTML 글쓰기 모드로 이동

복사한 구글맵 HTML 소스를 가지고 이번에는 티스토리 글쓰기에 적용하도록 하겠습니다.

티스토리 글쓰기를 할 때 HTML 모드로 변경할 수 있습니다.

 

복사한 구글 지도 소스 붙여넣기

복사한 구글 지도 장소 HTML 소스를 원하는 위치에 붙여넣습니다.

혹시나 지도를 가운데 정렬 하고 싶다면, <p>태그로 감싸주면 됩니다.

하단 예시 소스를 보시면 바로 이해가 되실 겁니다.

<p style="text-align:center;">
  <!-- 구글 지도에서 복사한 HTML 소스 붙여넣는 부분 -->
  <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d18615.7791723658!2d135.2174957769656!3d34.43092262611707!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x6000b91323cdfaf7%3A0xf171a79f8d908f88!2z6rCE7IKs7J20IOq1reygnOqzte2VrQ!5e0!3m2!1sko!2skr!4v1736402543606!5m2!1sko!2skr" width="600" height="450" allowfullscreen=""></iframe>
</p>

 

(예시)

간사이 국제공항 구글 지도 삽입 완료!!

 

---

 

관련글

• 구글 애드센스 광고 차단 회복 적용하고 테스트 해보기
• 티스토리 블로그 추가 개설하는 방법 및 주의사항
• 간사이 공항 2터미널에서 라피트 타러 가는법