블로그에 여행, 리뷰 글을 쓰다 보면 장소를
안내하기 위해 지도를 넣어야 하는 경우가 있는데요.
이번에는 티스토리 블로그에 지도를 넣는 방법에
대해서 알아보도록 할게요.
구글 지도
해외여행 관련 포스팅을 할 때는 필수인
구글 지도를 넣는 방법에 대해서 알아볼게요.
구글 지도는 국내/해외 장소를 다 서비스하지만
국내의 경우 네이버, 다음 지도가 좀 더
표시하기가 편해요.
만약에 티스토리 블로그를 사용 중이시면
글쓰기 모드에서 <지도>를 선택하면
다음 지도로 연결되니 참고하세요.
먼저 구글 지도에 들어가 원하시는 지역을 검색
또는 지도에서 선택해주세요.
왼쪽에 선택한 지역(건물, 가게)에 대한 정보 창
메뉴 중 <공유> 버튼을 누르세요.
공유 창에서 <지도 퍼가기>를 클릭하고
오른쪽에 있는 <HTML 복사>를 클릭하세요.
티스토리 글쓰기 창에서 메뉴 중
<외부 컨텐츠>를 클릭하세요.
외부 컨텐츠 삽입 창에서 방금 전 복사한
HTML 코드를 붙여 넣어주세요. (Ctrl + v)
코드 안을 살펴보면 width(폭), height(높이)
항목이 있는데 이게 글에 들어갈 지도의 크기로
원하는 크기로 조정이 가능해요.
(기본 - w=600, h=450)
이제 아래의 <확인> 버튼을 클릭하면 글안에
삽입된 구글 지도를 볼 수 있어요.
<일반 지도>
위성 지도로 넣고 싶으신 분은 지도 HTML 코드를
복사하기 전에 구글 지도를 위성 지도로 변경 한
다음 코드를 복사하여 지도를 삽입하세요.
<위성 사진>
네이버 지도
네이버 지도는 국내 장소만 서비스해요.
해외 장소의 경우 구글 지도를 이용해주세요.
네이버 지도에서 지도로 넣고 싶은 장소를
검색한 다음 오른쪽 메뉴바에서
링크 모양의 버튼을 누르세요.
아래에 있는 HTML 태그 복사에서 <복사>하거나
<HTML 태그 편집기 및 미리 보기>에서
지도 크기 설정을 한 다음 코드를 복사하세요.
티스토리 글쓰기 모드에서 <외부 컨텐츠>를
눌러 복사한 코드를 넣어 주세요.
확인 버튼을 누르면 네이버 지도가 들어간 모습을
볼 수 있는데 네이버 지도가 테이블이라
글 편집 모드에서 중앙 정렬로 설정을 해도
적용이 안돼요.
코드 삽입 전에 html에서 중앙 정렬을 설정해 주거나
오른쪽 위에 <HTML 체크 박스>를 체크하여
<HTML 편집 모드>에서 네이버 지도 HTML 코드를
다음과 같이 수정하면 지도가 중앙 정렬돼요.
(앞 부분 table 부분에 align="center" 삽입)
<table cellpadding="0" cellspacing="0"
align="center" width="462">
|
다음 지도
티스토리 블로그는 다음 지도를 기본으로
지원하고 있어서 사용이 편해요.
다음 지도는 국내 장소만 서비스해요.
해외 장소의 경우 구글 지도를 이용해주세요.
글 편집 모드에서 메뉴를 중 <지도> 버튼을
눌러 지도 검색창을 여세요.
지도 검색창에서 원하는 지역을 검색, 선택하여
아래의 첨부 버튼을 누르세요.
장소가 글에 삽입되었는데 글쓰기 모드에서는
다음과 같이 보여서 제대로 표시되고 있나는
미리 보기, 포스트 발행을 통해서 봐야 돼요.
그 외의 다음 지도에서 직접 HTML 코드를
생성하는 방법은 아래의 사진을 참고하세요.
이상으로 블로그에 지도를 삽입하는 방법에
대해서 알아보았는 데 도움이 되셨길 바라며
이상으로 포스팅을 마치도록 할게요.
#티스토리지도넣기 #구글지도 #네이버지도
#다음지도 #블로그지도삽입방법 #HTML지도
'IT, PC > PC' 카테고리의 다른 글
| 파워포인트가 없을 때 파워포인트 파일 열기 (ppt 열기, 파워포인트 뷰어, MS PowerPoint Viewer) (0) | 2019.02.28 |
|---|---|
| 엑셀 뷰어로 엑셀 보기 (MS Excel Viewer, 오피스 엑셀 없이 엑셀 파일 여는 방법) (0) | 2019.01.31 |
| 구글 애드센스 PIN 받기, 인증하기, 지급 계좌 설정하기 (0) | 2018.11.14 |
| PC에서 인스타그램 사진 업로드 하기 (0) | 2018.10.20 |
| 티스토리 블로그의 사이트맵을 생성하여 구글 웹마스터 도구(Search Console)에 제출하기 (사이트맵 생성, sitemap 등록/제출, 구글 검색) (0) | 2018.10.04 |
