구글맵을 삽입하는 방법입니다.

구글맵을 추가하는 절차

1. 먼저 구글맵 사이트로 이동하여 원하는 지역을 검색합니다.

2. 왼쪽 상단의 메뉴 아이콘을 클릭합니다

3. 표시되는 메뉴에서 “지도 공유 또는 퍼가기”를 선택합니다.

4. “지도 퍼가기”를 선택합니다.

참고로 반응형으로 구글맵을 삽입하려면 iframe 외부를 별도의 class를 둘러싼 다음에 CSS로 조정해주면 됩니다.

<div class="map-responsive">
<iframe src="https://www.google.com/maps/embed?...</iframe>
</div>

다음 CSS를 사용합니다.

.map-responsive{
overflow:hidden;
padding-bottom:56.25%;
position:relative;
height:0;
}
.map-responsive iframe{
left:0;
top:0;
height:100%;
width:100%;
position:absolute;
}
/* Source: ostraining

위와 같이 적용하면 구글지도가 모바일에서도 제대로 표시될 것입니다.