티스토리 블로그 본문에 Daum 지도 첨부하기

이전글 티스토리 블로그 본문에 구글 지도 넣는 팁에 이어 오늘은 티스토리 에디터의 자체기능으로 글쓰기 본문에 Daum 지도 넣는 방법을 알아 보도록 하죠.


블로그 본문에 지도를 첨부할 땐 여러가지 목적이 있겠으나, 제생각엔 맛집 소개를 하는 블로그나 여행 후기를 다루는 블로그에 지도를 첨부해 놓으면 블로그 방문자들께 아주 유용할 것 같은데요.


블로그 본문에 지도를 첨부할 때 구글 지도를 넣으려면 구글맵 페이지에 방문하여 위치정보를 입력하고 소스코드를 받아와야 하는 번거로움이 있는 반면, 다음 지도 첨부는 티스토리 에디터의 자체기능을 이용하므로 상대적으로 간단하다고 말할 수 있겠네요.

1.

블로그 본문에 다음 지도를 첨부하려면 블로그 글쓰기 에디터 메뉴에서 지도를 선택합니다.

티스토리블로그본문에Daum지도첨부하기_1


2.

팝업으로 지도첨부 창이 열리는데요.

순서는 없겠으나 팝업창 기본형  ▼으로 되어있는 드롭 다운 버튼을 눌러 입맛에 맞는 형태를 선택합니다.

저는 사용자지정형을 선택했는데요.

티스토리블로그본문에Daum지도첨부하기_2

3.

사용자지정형을 선택하면 사이즈를 지정할 수 있는 오버레이 창이 열리는데요.

블로그 본문 너비를 감안해서 사이즈를 입력하고 확인 버튼을 누릅니다.

티스토리블로그본문에Daum지도첨부하기_3


4.

기본 옵션으로 제공되는 사이즈를 선택했거나, 사용자지정형으로 사이즈를 입력했다면 위치 검색을 해야할 텐데요.

1 장소, 주소검색 창에서 직접 위치를 입력하고 검색하거나, 2 시도, 구군, 동리의 드롭 다운 버튼을 눌러 위치를 지정할 수도 있습니다.

티스토리블로그본문에Daum지도첨부하기_4


5.

저는 드롭 다운 버튼으로 지인이 운영하는 민박집을 예제로 지도 첨부 팝업창에서 위치시키려 하는데요.

팝업창의 지도를 드래그 & 드롭으로 상하 좌우로 위치시킬 수 있구요.

팝업창 오른쪽 ┼ ─ 버튼으로 지정한 사이즈 안에서 지도를 확대 및 축소할 수도 있습니다.

티스토리블로그본문에Daum지도첨부하기_5


6.

아래 샷은 지도에서 스카이뷰로 전환해서 뷰를 확대한 상태이구요.

티스토리블로그본문에Daum지도첨부하기_6


7.

지도 모드이든, 스카이뷰 모드이든 꾸미기에서 네가지의 핀 중 선택해서 위치를 지정할 수 있고, 그리기에서 화살표, 선, 사각, 원형 중 선택해 특정 위치를 그리며, 선의 굵기와 색상도 지정할 수 있습니다.

또는 팝업창 지도 옆 지도에 직접표시 버튼을 눌러 위치를 지정할 수도 있는데요.

티스토리블로그본문에Daum지도첨부하기_7


8.

아래 예제 샷은 지도 모드에서 꾸미기 메뉴 깃발 아이콘을 선택해 위치를 지정해 봤습니다.

클릭으로 위치를 지정하면 텍스트 입력란이 표시되는데요.

소개하려는 맛집이나 여행지, 그외 용도에 맞는 텍스트를 입력하고 첨부 버튼을 누르면 블로그 본문 원하는 부분에 지도를 넣을 수 있게 됩니다.

티스토리블로그본문에Daum지도첨부하기_8


9.

스카이뷰 모드로 Daum 지도를 첨부해 보았는데요.

블로그 글쓰기에서 다음 지도는 구글 지도처럼 곧바로 표시되지 않고 아래처럼 표시되는데, 티스토리 미리보기 기능을 사용하면 내가 첨부한 지도를 확인할 수 있구요.

티스토리블로그본문에Daum지도첨부하기_9


10.

이렇게 첨부된 Daum 지도는 블로그 방문자가 드래그 & 드롭으로 상하좌우로 위치를 조절할 수 있으며, 휠 마우스로 지도를 확대 및 축소도 할 수 있고, 첨부된 지도 오른쪽 큰지도 보기 아이콘을 누르면 새 탭으로 열리는 다음 지도 페이지에서 로드뷰 등 제공되는 옵션을 볼 수 있게 됩니다.

티스토리블로그본문에Daum지도첨부하기_10

티스토리블로그본문에Daum지도첨부하기_11


Daum 지도 잘 활용하시길 바라며... 이 글은 여기서 마치겠습니다.

감사합니다.


예제로 사용했던 스카이뷰 모드의 다음 지도 





 

댓글

Designed by JB FACTORY