구글맵 주소를 퍼다가 md파일에 그대로 복사 붙혀넣기로 넣고 싶다. 그런데 반응형으로도 하고 싶다. 그럴 경우에 이렇게 하자.
■ Markdown에는 이렇게 입력해주자
{{< googlemap >}}
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3241.7477985333417!2d139.7432442159418!3d35.65858483881974!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x60188bbd9009ec09%3A0x481a93f0d2a409dd!2z5p2x5Lqs44K_44Ov44O8!5e0!3m2!1sja!2sjp!4v1580566749040!5m2!1sja!2sjp" width="600" height="450" frameborder="0" style="border:0;" allowfullscreen=""></iframe>
{{< /googlemap >}}
■ layouts/shortcodes/googlemap.html
Markdown에서는 googlemap.html파일을 읽어들인다
<div class="gmap">
{{ .Inner }}
</div>
■ style.css
기본으로 쓰고 있는 css에 추가해준다
.gmap {
height: 0;
overflow: hidden;
padding-bottom: 56.25%;
position: relative;
}
.gmap iframe {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100;
}