본문 바로가기

디지털노마드/WordPress 강좌

웹페이지에 구글맵 넣는 간단한 방법

HTML 태그로 간단히 입력하기

 

1. 구글맵(www.googlemap.com)에 가서 원하는 주소를 입력한 후 검색을 해봅시다. 아래와 같이 '남산타워'를 검색한 경우 아래와 같은 지도가 보입니다. 여기서 'Share' 버튼을 눌러봅시다.

2. 아래와 같은 팝업창이 열리면 여기서 '지도 퍼가기'를 누릅니다. 중간에 HTML 태그가 보이면 복사를 합니다. 

3. 작업하고 있는 워드프레스의 작업창으로 가서 블럭에디터를 선택합니다. 여기서 'Embed' 또는 'Custom HTML' 을 누릅니다. 그리고 앞에서 복사해둔 구글맵 코드를 붙여넣습니다.

'Embed'  입력창
HTML 입력창

 

4. 저장하고 웹페이지를 확인해 봅시다. 간단하게 구글맵을 적용해 보았습니다. HTML 태그에서 크기를 조절해서 웹페이지 스타일을 맞춰 봅시다. 다음 글에서는 구글맵에 스타일을 적용하는 방법을 알아보겠습니다.