WordPress에서 AMP 양식을 만드는 방법

모바일 장치에서 웹사이트를 더 빠르게 로드하기 위해 Google은 Accelerated Mobile Pages 또는 AMP라는 프로젝트를 만들었습니다. 또한 웹 페이지를 더 빠르게 로드하여 뛰어난 모바일 탐색 경험을 제공하지만 웹 사이트에서 많은 유용한 기능을 비활성화하기도 합니다. 큰 손실로 간주될 수 있는 기능 중 하나는 연락처 양식입니다. AMP는 제한된 HTML 및 JavaScript 세트를 사용하기 때문에 AMP 페이지에서 WordPress 양식을 제대로 로드할 수 없습니다. 다행히도 사용 가능한 쉬운 솔루션이 있습니다. WPForms는 AMP 준비 WordPress 양식을 만드는 데 도움이 되는 초보자 친화적인 WordPress 양식 플러그인입니다. 따라서 다음 기사에서는 WPForms를 사용하여 WordPress에서 AMP 양식을 만드는 방법을 자세히 설명합니다 .

WordPress에서 AMP 양식을 만드는 방법 알아보기

따라서 AMP는 웹사이트를 모바일 친화적으로 만드는 데 오히려 유용합니다. 그리고 WordPress용 공식 AMP 플러그인을 설치하고 활성화하는 것은 WordPress에서 AMP를 사용하기 위한 전제 조건입니다. 활성화 하면 플러그인이 WordPress 사이트에 대한 Google AMP 지원을 자동으로 추가합니다 . 그러나 대시보드에서 AMP > 일반으로 이동하여 웹사이트의 AMP 설정을 변경할 수 있습니다. AMP 설정 페이지에 있을 때 웹사이트에서 AMP를 활성화 또는 비활성화할 수 있을 뿐만 아니라 AMP용 웹사이트 모드를 선택하고 지원되는 템플릿을 선택할 수도 있습니다. AMP를 구성한 후 WordPress 사이트에서 AMP 호환 문의 양식을 만들어야 합니다.

WPForms로 WordPress 양식 만들기

프로세스를 시작하려면 사이트에 WPForms Lite 플러그인을 설치하고 활성화해야 합니다. 이것은 WPForms Pro 플러그인의 라이트 버전입니다. WPForms의 프로 버전과 라이트 버전 모두 기본 AMP 준비 문의 양식을 만들 수 있습니다. 여기서는 무료 버전에 대해 이야기하겠습니다. 플러그인을 설치하고 활성화한 후 WPForms > 새 페이지 추가로 이동하여 새 WordPress 양식을 생성해야 합니다. 양식 설정 화면에서 양식 템플릿을 선택하여 빠르게 시작할 수 있습니다.

처음부터 시작하려면 빈 양식을 사용하는 것이 좋습니다. 그런 다음 양식 작성기 페이지가 열립니다. 여기에서 양식 필드를 추가하거나 제거할 수 있습니다. 양식에 새 필드를 추가하려면 왼쪽 패널에서 양식 필드를 클릭하기만 하면 오른쪽의 양식 작성기 패널에 나타납니다. 완료한 후 필드 옵션을 구성할 수 있습니다. 그렇게 하려면 필드를 클릭하면 필드 옵션이 나타납니다. 비슷한 방식으로 다른 모든 필드를 사용자 지정할 수 있습니다.

그런 다음 설정 탭을 클릭하여 양식 설정을 구성합니다. 일반 설정을 통해 양식 이름 변경, 버튼 텍스트 제출, 버튼 처리 텍스트 제출, 스팸 방지 허니팟 활성화 등을 할 수 있습니다. 알림 탭으로 이동하여 사용자가 양식을 완료했을 때 알려주는 이메일 알림을 설정합니다. 확인 탭은 사용자가 양식을 제출할 때 표시될 확인 메시지를 설정하는 데 도움이 됩니다. 구성이 완료되면 양식을 저장해야 합니다.

페이지에 AMP 양식 추가하기

WordPress 양식이 준비되면 페이지에 추가할 수 있습니다. 먼저 새 페이지를 만들거나 양식을 추가할 기존 페이지를 열어야 합니다. 페이지 편집 화면을 열고 새 블록 추가 아이콘을 클릭한 다음 WPForms 블록 선택을 계속 진행합니다. 그렇게 하면 페이지 편집 화면에 추가된 WPForms 위젯을 볼 수 있습니다. 이전에 생성한 양식을 선택하기만 하면 위젯이 페이지 편집기에 즉시 로드합니다. 페이지를 게시하거나 업데이트할 수도 있습니다. 그리고 그게 전부입니다. 다른 것을 구성할 필요가 없습니다. 이제 WPForms Lite 플러그인이 양식에 전체 AMP 지원을 추가합니다. 그것이 어떻게 보이는지 관심이 있다면, 당신은 당신의 휴대 전화에서 페이지를 열 수 있습니다.

AMP 양식에 Google reCAPTCHA를 추가하는 방법

WPForms에는 기본적으로 스팸을 포착하고 차단하는 스팸 방지 허니팟이 포함되어 있습니다. 또한 Google reCAPTCHA를 사용하여 스팸 제출을 줄일 수 있습니다. AMP 양식과 함께 Google reCAPTCHA를 사용하려면 사이트를 Google reCAPTCHA v3에 등록하고 Google API 키를 가져와야 합니다. 그렇게 하려면 Google reCAPTCHA 웹사이트로 이동하여 페이지 오른쪽 상단의 '관리 콘솔' 버튼을 클릭합니다. 그런 다음 Google 계정으로 로그인해야 합니다. 그러면 '새 사이트 등록' 페이지가 표시됩니다. 레이블 필드에 웹사이트 이름을 입력하여 작성을 시작합니다. Google AMP는 reCAPTCHA v3만 지원하므로 reCAPTCHA 유형 옵션에서 선택해야 합니다.

완료되면 도메인 섹션에 도메인 이름을 입력합니다. 소유자 섹션에는 기본적으로 이메일 주소가 표시됩니다. 원하는 경우 다른 이메일을 추가할 수도 있습니다. 다음으로 계속하려면 reCAPTCHA 서비스 약관에 동의해야 합니다. 또한 '소유자에게 변경 사항 보내기' 확인란을 선택하는 것을 잊지 마십시오. 이렇게 하면 Google에서 사이트의 잘못된 구성 및 의심스러운 트래픽과 같은 문제에 대해 알릴 수 있습니다. 완료한 후 제출 버튼을 클릭합니다. 그러면 사이트 키 및 비밀 키와 함께 성공 메시지가 표시되어 사이트에 reCAPTCHA를 추가할 수 있습니다. 이 키를 사용하여 양식에 reCAPTCHA를 추가할 수 있습니다.

추가 조정

그러나 처리해야 할 조정이 하나 더 있습니다. reCAPTCHA와의 AMP 호환성을 보장합니다. 액세스하려면 '설정으로 이동' 링크를 클릭하십시오. 이렇게 하면 '이 키가 AMP 페이지에서 작동하도록 허용' 확인란이 있는 reCAPTCHA 설정으로 다시 이동합니다. 확인란을 선택하고 아래 저장 버튼을 클릭하기만 하면 됩니다.

AMP 양식에 reCAPTCHA를 추가할 수 있는 Google API 키가 있으므로 WordPress 대시보드에서 WPForms > 설정 > reCAPTCHA 페이지로 이동합니다. 그런 다음 reCAPTCHA v3 옵션을 선택하고 사이트 키와 비밀 키를 붙여넣습니다. 설정 저장 버튼을 클릭합니다. 이제 Google reCAPTCHA가 WPForms에 추가되었으므로 필요한 경우 양식에서 자유롭게 활성화할 수 있습니다. WPForms > 모든 양식으로 이동하여 reCAPTCHA를 활성화할 양식을 선택하십시오. 양식 설정 화면이 나타나면 설정 탭을 클릭하고 일반 설정 섹션을 선택합니다. 'Google v3 reCAPTCHA 사용' 확인란이 표시됩니다. 해당 상자를 선택하고 양식을 저장하십시오. 그런 다음 연락처 페이지를 다시 방문하여 reCAPTCHA가 작동하는 AMP 양식을 확인하십시오.

그 정도는 아니다

보시다시피 WordPress에서 AMP 양식을 만들기 위해 많은 어려움을 겪을 필요가 없습니다. 특히 이 가이드가 옆에 있을 때. 이 몇 가지 간단한 단계를 수행한 후 AMP Forms의 모든 이점을 확인하고 도움이 되었기 를 바랍니다.