실무

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

info28399 2025. 8. 28. 09:00

블로그 글을 작성하다 보면 독자들에게 위치를 보여주고 싶을 때가 있습니다.
특히 맛집 리뷰, 여행 후기, 가게 소개 글에서는 지도 삽입이 필수적이죠.

이번 글에서는 티스토리 블로그에 구글 지도 넣는 방법을 단계별로 알려드리겠습니다.

 

1. 구글 지도에서 위치 검색하기

1.구글지도 접속

2. 원하는 위치(가게, 여행지, 건물 등)를 검색

3. 지도 화면 왼쪽 정보 패널에서 공유(Share) 버튼 클릭


2. HTML 코드(Embed) 가져오기

1. 공유 버튼을 누르면 팝업창이 열립니다.

2. “링크 복사” 옆에 있는 지도 퍼가기(Embed a map) 탭 선택

3.<iframe ... ></iframe> 형태의 HTML 코드가 생성됨

4. 코드 오른쪽 복사(Copy HTML) 버튼 클릭


3. 티스토리 글에 구글 지도 삽입하기

  1. 티스토리 글쓰기 화면 진입
  2. 편집기에서 HTML 모드 선택
    • 새 에디터 사용 시, 블록 추가 → HTML 블록 선택
  3. 복사한 <iframe> 코드를 붙여넣기
  4. 저장 후 미리보기 → 지도 정상 표시 확인

4. 지도 크기 조정

기본 삽입 코드 예시:

  • width="600" → 가로 크기
  • height="450" → 세로 크기
  • 원하는 크기로 수정 가능
  • width="100%" 로 설정하면 반응형(화면 크기에 맞게 자동 조정) 적용

5. 구글 지도 활용 팁

  • 네이버 지도도 좋지만, 해외 위치나 글로벌 서비스를 소개할 때는 구글 지도가 훨씬 정확합니다.
  • 티스토리 스킨이 반응형이라면, 지도 크기를 % 단위로 지정하는 것이 깔끔합니다.
  • 필요하다면 한 글에 여러 지도(여러 지점)도 삽입 가능합니다.

✅ 마무리

티스토리 블로그에 구글 지도를 넣는 방법은
구글 지도에서 공유 → 퍼가기(Embed) 코드 복사 → 티스토리 글 HTML에 삽입
이 세 단계만 기억하면 끝입니다.

위치를 글과 함께 보여주면 독자의 이해도가 올라가고,
맛집/여행 후기 글에서는 방문 유도 효과도 커집니다.