WordPress에서 자동 완성 주소 양식을 추가하는 방법

Muneeb 워드프레스 튜토리얼 Oct 21, 2021

자동 완성 주소 양식은 훌륭한 시간 절약 전략입니다. 웹사이트가 더 원활하고 신속하게 처리되어야 고객의 작업이 완료되므로 고객이 웹사이트를 다시 방문할 가능성이 높아집니다.

자동 완성 주소 양식은 사용자가 양식에 주소를 입력하기 시작할 때 Google 위치를 사용하여 주소를 제안합니다. 이 기사에서는 WP Forms를 사용하여 WordPress에서 자동 완성 주소 양식을 만드는 방법을 이해합니다.

자동 완성 주소 양식을 만드는 방법

기본적으로 WordPress에는 자동 완성 주소 양식이 없으므로 WP Forms 플러그인이 필요합니다.

WP Forms 는 가장 인기 있고 최고의 양식 빌더 플러그인 중 하나입니다. WP Forms를 사용하면 웹사이트를 위한 놀랍도록 창의적이고 흥미로운 양식을 만들 수 있습니다.

놀라운 웹사이트 만들기

최고의 무료 페이지 빌더 Elementor와 함께

지금 시작

게다가 초보자도 사용하기 매우 간단하므로 웹 사이트의 사용자 경험을 향상시키기 위해 뛰어난 코딩 지식이 필요하지 않습니다.

WP Forms 플러그인 을 설치하고 활성화하면 구독을 확인하기 위해 라이선스 키 를 묻는 메시지가 표시됩니다.

라이센스 키 입력이 완료되면 키 확인을 누르고 계속 진행합니다.

WordPress 대시보드에서 WP Forms 옵션 바로 아래에 있는 Addons 버튼을 누릅니다.

검색창에 GeoLocation Addon 을 검색하고 애드온을 설치하세요.

이 부가 기능은 사용자가 주소 세부 정보를 추가하기 시작할 때 사용자에게 주소를 제안하도록 작동합니다.

다음으로 WP Forms 설정 으로 이동한 다음 Geolocation 탭을 선택해야 합니다. Google Places API현재 위치를 활성화합니다.

그런 다음 Google Cloud Platform 으로 이동하여 Google 지역 정보용 API 키를 가져옵니다. 해당 페이지에서 API 및 서비스 활성화 를 누릅니다.

Google Places API, Google Maps JavaScript API 및 Geocoding API 만 활성화하면 되지만 전체 API 목록이 표시 됩니다 .

다음으로 API 및 서비스 로 이동한 다음 자격 증명 페이지로 이동해야 합니다. 페이지 상단에서 +Create Credentials 버튼을 누르고 API 키를 생성 합니다.

새로 생성된 키가 제공되며 키 제한 버튼을 눌러 키 사용을 제어할 수도 있습니다.

API 키 제한 및 이름 바꾸기 페이지에서 HTTP 리퍼러(웹사이트) 옵션을 활성화합니다.

마지막으로 키 제한 옵션을 표시하고 드롭다운에서 이전에 선택한 API를 선택합니다.

저장하면 이 페이지에서 복사할 수 있는 API 키가 준비됩니다.

지리적 위치 설정 페이지에서 API를 붙여넣습니다. WordPress 관리 영역에서 페이지에 액세스할 수 있습니다.

모든 설정이 완료되면 새 주소 양식을 만들 수 있습니다.

WordPress에서 문의 양식을 만드는 방법

WordPress 대시보드에서 WP Forms 로 이동하여 새로 추가를 누르면 양식 빌더 페이지로 이동합니다. 양식 이름을 입력하고 양식 템플릿을 선택하여 시작합니다.

템플릿이 실행되고 양식의 모든 필드는 왼쪽에 있고 미리보기는 오른쪽에 있습니다. 필드를 왼쪽에서 오른쪽으로 끌어다 놓아 원하는 대로 변경할 수 있습니다. Fancy Fields 에서 Address 필드 를 오른쪽으로 끌어다 놓습니다.

그런 다음 미리보기에서 주소 필드를 누르면 편집 옵션이 활성화됩니다. 고급 옵션 으로 이동하여 주소 자동 완성을 활성화합니다.

마지막 단계는 이 양식을 웹사이트에 추가하는 것입니다. 먼저 새 페이지를 추가하고 그에 따라 이름을 지정해야 합니다. 그런 다음 WP Forms 를 페이지에 차단 해야 합니다.

추가되면 드롭다운에서 이전에 만든 양식을 선택할 수 있습니다.

마지막으로 페이지를 게시하고 웹사이트가 완벽하게 작동하는지 확인하십시오.

이것이 WP Forms를 사용하여 WordPress에서 자동 완성 주소 양식을 만드는 방법입니다. 이것이 이 튜토리얼의 전부입니다. Facebook과 Twitter에서 우리를 팔로우하십시오.

Divi WordPress Theme