Jet Elements를 사용하여 여러 핀이 있는 지도를 만드는 방법을 알고 싶습니까?

제트 요소 라는 위젯을 제공합니다. 고급지도. 위젯과 달리 구글 네이티브 지도Elementor 하나의 위치만 지원하는 Jet Elements Advanced Map Widget을 사용하면 여러 개의 핀이 있는 지도를 만들 수 있습니다.

이 위젯을 사용하려면 먼저 Jet Elements를 다음과 통합해야 합니다. 구글 API 키를 사용하여 지도를 작성합니다.

Jet Elements 고급 지도 위젯은 도시에 여러 지점이 있는 사업체가 있고 지점의 위치를 ​​표시하는 지도를 만들고 싶을 때 매우 유용합니다. 이 위젯은 도시의 관광 명소 지도와 같은 것을 만드는 데에도 유용합니다.

이 위젯을 사용하는 방법은 다음과 같습니다.

1단계: JetElements를 Google 지도와 통합

언급했듯이 API 키가 필요합니다 구글 Jet Elements를 Google 지도와 통합하는 지도입니다. Google API 콘솔을 통해 API 키를 얻을 수 있습니다.

그래서 방문 구글 API 콘솔 Google 계정으로 로그인합니다. 아직 프로젝트가 없다면 상단의 드롭다운 메뉴를 클릭하여 새 프로젝트를 생성하고 새 프로젝트 나타나는 팝업에서.

프로젝트에 이름을 지정하고 버튼을 클릭하십시오. CREATE .

새 프로젝트가 생성되면 Google API 콘솔 대시보드 상단의 드롭다운 메뉴를 통해 프로젝트를 선택한 다음 도서관 왼쪽 패널에서

Google은 Google Maps API를 17가지 유형으로 나눕니다. 이 위젯을 사용하려면 Jet Elements 고급 지도 위젯에 필요한 API를 활성화해야 합니다. Jet Elements의 개발자인 Crocoblock은 필요한 API에 대한 자세한 정보를 제공하지 않습니다. 경험을 바탕으로 다음 API를 활성화했습니다.

  • API 방향
  • 지오코딩 API
  • 지도 자바스크립트 API
  • API 시트

링크를 클릭하시면 됩니다 모두 표시 섹션에서 장바구니 그들 모두를 볼 수 있습니다.

API를 활성화하려면 해당 API를 선택(클릭)하고 버튼을 클릭합니다. 활성화.

필요한 API 활성화를 완료하면 Google API 콘솔의 기본 대시보드로 돌아가서 식별자 왼쪽 패널에서 버튼을 클릭 자격 증명 만들기 선택하고 API 키. 나타나는 팝업에서 API 키를 복사합니다.

Elementor를 사용하여 WordPress에서 360도 가상 둘러보기 만들기

다음으로 WordPress 대시보드에 로그인하고 다음으로 이동합니다. JetPlugins – > JetElements 설정.

탭을 클릭하십시오 통합 필드에 API 키를 붙여넣습니다. Google 지도 API 키 섹션 Google지도. 옵션 활성화 별도의 지오코딩 API 키 그리고 같은 코드를 붙여넣기 지오코딩 API 키.

Jet Elements를 사용하여 여러 핀이 있는 지도 만들기

2단계: 지도 만들기

Jet Elements와 Google Maps가 성공적으로 통합되면 지도 생성을 시작할 수 있습니다. 이렇게 하려면 새 페이지(페이지 – > 추가) 또는 새 항목(아이템 – > 추가)로 수정하십시오. Elementor.

편집기에서 Elementor, 시작하기 전에 레이아웃을 설정하세요. 이렇게 하려면 왼쪽 하단에 있는 기어 아이콘을 클릭하여 페이지 설정 패널을 엽니다. 옵션 아래의 드롭다운 메뉴에서 레이아웃을 선택합니다. 일반 설정.

Elementor 편집 상자에서 더하기 아이콘을 클릭하여 새 섹션을 추가하고 고급 맵 위젯을 캔버스로 드래그합니다.

Jet Elements를 사용하여 여러 핀이 있는 지도 만들기

지도의 중심을 도시(또는 만들려는 지도에 따라 지역)로 설정합니다. 또한 초기 확대/축소를 설정합니다.

Jet Elements를 사용하여 여러 핀이 있는 지도 만들기

열린 Google지도 지도에 추가하려는 첫 번째 위치를 찾아 해당 주소를 복사합니다.

Elementor 편집기로 돌아가서 섹션을 엽니다. . 기존 위치를 클릭하고 주소를 방금 복사한 주소로 바꿉니다. 또한 필드의 위치에 대한 설명을 추가하십시오. 핀 설명.

버튼을 클릭 요소 추가 다른 주소를 추가하기 위해 조금 더 낮은 위치에 있습니다.

지도의 스타일과 높이를 변경하려면 섹션을 열 수 있습니다. 지도 스타일.

참고 : 위젯 드래그 후 지도가 불러오지 않는 경우 고급지도 Elementor 편집기에서 '개발 목적으로만' 메시지가 표시되면 Google 결제를 활성화하세요. 클라우드. Google의 새로운 정책에 따라 개발자는 결제 계정을 활성화해야 합니다.

지금 Elementor Pro를 받으세요!!!

결론

그래서 ! Jet Elements를 사용하여 여러 핀이 있는 지도를 만드는 방법을 보여주는 이 문서의 내용은 여기까지입니다. 거기에 가는 방법에 대해 우려 사항이 있는 경우 commentaires.

그러나 상담 할 수도 있습니다 우리의 자원, 인터넷 사이트 제작 프로젝트를 수행하는 데 더 많은 요소가 필요하면 워드 프레스 블로그 제작 또는 Divi : 역대 최고의 워드 프레스 테마.

그러나 그동안, 이 기사를 다른 소셜 네트워크에서 공유하십시오.

...