formidable-forms-title

Formidable Forms로 사용자 입력폼 만들기

웹사이트를 운영하다 보면 종종 사이트에서 사용자 입력을 받아 처리할 일들이 생기곤 합니다. 예를 들어 어떤 온라인 이벤트나 캠페인을 진행하면서 참가자 정보를 수집하거나 모임을 개최하고 모임 참석자 정보를 받거나 하는 등의 일입니다.

워드프레스에도 이런 사용자 정보를 수집하기 위한 여러 방법들이 있습니다. 흔히 쓰는 방법은 사용자 입력폼을 만들어 포스트나 페이지에 붙이고 그 폼을 통해 사용자로부터 데이터 입력을 받는 방법입니다. 워드프레스 플러그인들 중에는 이렇게 폼을 만들고 입력된 데이터를 저장하는 기능을 갖춘 여러 종류의 플러그인들이 있습니다.

여기서는 그 중 하나인 Formidable Forms 플러그인을 사용하여 간단한 사용자 입력폼을 만들어 처리하는 방법을 소개하기로 합니다.

Formidable의 기본 구조는 간단합니다. 폼을 만들고, 폼을 통해 데이터를 받고, 받은 데이터를 표시하고, 스타일링을 할 수 있는 기능이 전부이며 Formidable 메뉴가 이를 반영합니다.(단, Views 메뉴는 Pro 버전만 지원)

Formidable 메뉴 구조

여기서는 간단하게 이벤트에 응모한 사용자로부터 이름과 전화번호 그리고 이메일 주소와 함께 간단한 의견을 받는 입력폼을 한번 만들어 보기로 하겠습니다.

폼 만들기

Add New 하여 폼을 만듭니다. 폼은 화면 좌측에 있는 폼 필드 요소들을 끌어다 화면 중앙에 배치하는 드래그&드롭 방식으로 작동하기 때문에 간단하게 만들 수 있습니다.

Formidable 폼 만들기

이벤트 페이지에 폼 추가하기

폼이 완성되면 저장합니다. 폼을 만들면서 Preview 기능을 사용하여 가끔씩 완성된 폼의 모양을 미리 확인해 보는 것도 좋습니다. 이제 폼이 완성되었으면 새 페이지를 하나 만든 다음 방금 전 생성한 입력폼을 이 페이지에 추가하면 됩니다. Formidable 폼은 숏코드 형태로 페이지나 포스트에 추가하면 되며, Formidable이 자동으로 폼 추가를 도와주는 버튼을 제공하기 때문에 아주 간단하게 추가할 수 있습니다.

페이지에 Formidable 폼 추가하기

폼으로부터 사용자 입력 받기

페이지를 저장하면 다음과 같이 사용자 입력 폼이 페이지에 추가된 것을 확인할 수 있습니다. 이제 이 페이지를 사용자들에게 공개하면 사용자로부터 폼 데이터를 입력받을 수 있습니다.

완성된 사용자 입력폼

사용자로부터 입력받은 데이터는 Formidable 메뉴의 하위 메뉴인 Entries 에서 확인할 수 있습니다.

그 밖의 기능들

여기서는 Formidable이 제공하는 아주 기본적인 기능들만 사용하였지만 실제로 Formidable은 이 밖에도 훨씬 더 강력하고 많은 기능들을 제공합니다.

  • 폼 스타일링(styling) – 별도의 스타일 기능을 제공하기 때문에 폼의 스타일을 테마에 맞게 자유롭게 커스터마이징할 수 있습니다.
  • 사용자 인증 – 등록된 사용자만 폼을 작성할 수 있게 만들 수 있습니다.
  • 뷰(View) – 폼으로부터 입력받은 데이터의 목록이나 내용을 화면에 직접 표시할 수 있는 기능이며, Pro 버전에서만 제공합니다.
  • 프론트엔드 포스팅(Frontend Posting) – 폼으로부터 입력받은 데이터를 워드프레스의 포스트(Post)로 맵핑시킬 수 있습으며, Pro 버전에서 제공합니다.

참고자료

“Formidable Forms로 사용자 입력폼 만들기”에 대한 0개의 생각