인기 워드프레스 페이지 빌더인 엘리멘터(Elementor)에서는 무료 버전에서도 구글 맵을 쉽게 넣을 수 있는 구글지도 위젯을 제공합니다. Elementor 페이지 빌더의 구글지도 위젯을 사용하면 데스크탑(PC), 태블릿, 모바일 기기에 맞게 크기를 조정할 수 있습니다.
워드프레스 엘리멘터 구글지도 위젯 사용하기
엘리멘터에는 구글지도(Google Maps)를 삽입할 수 있는 구글지도 위젯을 제공합니다.
위젯 검색 필드에 'google'을 입력하면 '구글지도' 위젯이 검색됩니다. 구글지도 위젯을 원하는 곳으로 끌어다 놓은 후에 주소를 입력하면 구글맵이 추가됩니다.
구글지도 위젯을 추가하면 '영국 런던 아이' 지역이 구글맵에 표시됩니다.
주소를 입력하고 줌(확대/축소), 높이를 설정할 수 있습니다.
하단의 반응형 모드를 클릭하여 모바일, 태블릿, PC에서 기기 해상도에 맞게 높이 등을 지정할 수 있습니다.
대략적인 과정을 다음 영상을 통해 확인해볼 수 있습니다.
참고로 Jupiter 테마를 사용하는 경우 자체적으로 제공하는 Advanced Maps (고급지도) 위젯을 사용할 수 있습니다.
마치며
이상으로 워드프레스 엘리멘터 페이지 빌더에서 제공하는 구글지도 위젯에 대해 간단히 살펴보았습니다. 구글지도 위젯을 사용하는 경우 별도의 Google Maps API 키를 입력하지 않아도 작동하는 것 같습니다. 하지만 일정 페이지 뷰 이상인 경우 Google Maps API 키 입력을 요구할 수도 있을 것입니다. 쥬피터 테마의 Advanced Maps 위젯을 사용하는 경우에는 구글맵 API 키를 입력해야 합니다.
참고
엘리멘터 페이지 빌더의 탭 (Tabs) 기능
아래 영상과 같이 탭 형식으로 콘텐츠를 표시하고 싶은 경우 페이지 빌더에 포함된 탭 기능을 사용할 수 있습니다. 아바다(Avada)나 엔폴드(Enfold) 등 인기 테마에는 자체 페이지 빌더에서 탭(Tabs)
avada.tistory.com
워드프레스 아바다 테마 탭 기능 (Tabs)
대부분의 페이지 빌더에서는 탭 기능을 제공합니다. 무료 페이지 빌더인 엘리멘터에서도 탭 기능이 제공됩니다. 이 글에서는 아바다 테마에 탑재된 Avada Builder에서 제공하는 탭 (Tabs) 기능과 Eleme
avada.tistory.com
Divi 테마용 무료 레이아웃 팩 Apothecary Layout Pack
워드프레스는 정말 다양한 테마가 있어서 어떤 테마를 선택해야 할지 고민이 되는 분들이 많을 것 같습니다. 여러 개의 사이트에 설치할 테마를 원하거나 고객사를 위해 사이트 제작 업무를 하
avada.tistory.com