블로거(Google Blogger)에 네이버 지도 넣는 방법

Google Blogger(블로거)에 네이버 지도를 임베드하는 것은 간단합니다. 네이버 지도에서 공유 기능을 통해 iframe 코드를 얻거나 직접 HTML 코드를 작성해 삽입할 수 있어요. API 키 발급 없이 iframe 태그만 사용하면 됩니다. 아래에 단계별로 설명하겠습니다.

1. 네이버 지도에서 임베드 코드 준비하기

• 네이버 지도 사이트(https://map.naver.com/)에 접속하세요.
• 검색창에 원하는 장소(예: "서울역")를 입력하고 검색합니다.
• 검색 결과에서 원하는 장소를 클릭해 지도를 확대/조정합니다.
• 화면 오른쪽 상단(또는 왼쪽 메뉴)의 공유 버튼을 클릭합니다.
• 공유 옵션에서 지도 링크 복사 또는 임베드 코드를 선택합니다. (임베드 코드가 나오지 않으면, 아래처럼 직접 iframe 코드를 작성하세요.)
  • 직접 iframe 코드 예시:

    <iframe src="https://map.naver.com/p/search/서울역" width="600" height="400" frameborder="0" scrolling="no" marginheight="0" marginwidth="0"></iframe>

    • src 부분의 URL을 실제 검색 URL로 바꾸세요. (예: https://map.naver.com/p/search/원하는장소명)
    • width와 height는 지도 크기를 조정하세요. (예: 800x500으로 확대 가능)
  • 구체적인 코드: <iframe src="https://map.naver.com/p/search/서울역" width="600" height="400" frameborder="0" scrolling="no" marginheight="0" marginwidth="0"></iframe>

이 방법으로 네이버 지도는 API 없이 간단히 iframe으로 임베드할 수 있습니다.

2. 블로거 포스트에 삽입하기

• Blogger 대시보드(https://www.blogger.com/)에 로그인하고, 새 포스트를 작성하거나 기존 포스트를 편집합니다.
• 포스트 편집기에서 HTML 보기 모드로 전환하세요. (상단 탭에서 'HTML' 클릭)
• 지도를 넣고 싶은 위치에 위에서 준비한 iframe 코드를 복사해 붙여넣습니다.
• 미리 보기로 확인한 후, 게시를 클릭합니다.

팁과 주의사항

• 크기 조정: iframe의 width/height 속성을 변경해 지도 크기를 맞추세요. 반응형으로 하려면 CSS를 추가할 수 있지만, 기본 iframe으로 충분합니다.
• 법적 문제: 네이버 지도는 임베드 기능을 공식 지원하니 문제없습니다.
• 대안: 만약 더 고급 기능(예: 마커 추가)이 필요하면 네이버 지도 API를 사용하세요. 하지만 간단 삽입이라면 iframe이 최적입니다.
• 문제가 발생하면 Blogger의 HTML 모드가 활성화되어 있는지 확인하세요. 모바일에서는 데스크톱 버전으로 편집하는 게 좋습니다.

이 방법으로 쉽게 지도를 추가할 수 있어요! 추가 질문 있으시면 말씀해주세요.

진실한 소식, 소리하나를 담다 - 참소리, ganatoday!

그린아프로

감사합니다. 가나투데이였습니다. #ganatoday #가나 투데이