× 10월의 특별한 혜택 프리미엄 12개월 요금 결제 시 NHN KCP(전자결제 PG)가입비 22만원 면제! 자세히 보기
가이드
[요소 가이드] 입력폼
빈페이지닷컴 2020-08-17 10:55:31


<데스크톱 버전>


입력폼 요소 가이드


*입력폼 요소는 웹사이트에서 자주 보이는 문의사항, 설문조사 등 특정 정보를 이용자에게 입력받아 사이트 관리자가 데이터를 수집할 때 이용하는 요소입니다.







1) 입력폼 요소를 추가할 섹션 위에서 마우스 우 클릭 -> 요소 추가를 클릭하여 요소 추가 사이드바를 열고  "입력폼" 요소 아이콘을 클릭하여 요소를 추가합니다.



image.png












2) 추가된 입력폼 요소 위에 마우스 우 클릭 팝업메뉴 호출 후 -> 입력폼 설정을 클릭하여 설정 창을 열어줍니다.



image.png












3) 설정 창의 "기본 설정"에서는 입력폼 이름, DB 연동 설정, 권한 설정, 폼 스타일 등을 설정할 수 있습니다.



(1) 입력폼 이름 : 사이트 내 여러 개의 입력폼을 사용하는 경우도 있으므로, 각 입력폼의 이름을 다르게 지정하여 DB(데이터베이스) 값을 따로 저장할 수 있습니다.


(2) 입력폼 연동 : 이전에 생성되었던 입력폼 DB(입력폼 이름)를 불러들여서 그대로 사용할 수 있습니다.


(3) 권한 설정 : 입력폼을 작성할 수 있는 권한을 설정할 수 있습니다. 비회원/회원/지정그룹 중에 작성 권한이 없는 로그인 계정은 입력폼을 작성하여 보낼 수 없게 됩니다.


(4) 작성 후 메인화면으로 이동 : 입력폼을 작성 후 사이트의 메인화면으로 강제로 이동시킵니다.


(5) 개인정보처리방침 동의 사용 : 이름, 이메일, 연락처 등의 개인 정보를 입력받는 경우에는 개인정보처리방침 약관을 명시하여 동의를 받아야 합니다.


(6) 제3자 정보제공 동의 사용 : 입력받은 개인 정보를 다른 제3자와 공유하여 이용할 시 체크하여 약관을 명시해 주고 동의를 받아야 합니다.


(7) 색상 설정 : 입력폼의 글자/배경/선 색 등을 지정할 수 있습니다.


(8) 버튼 설정 :  입력폼의 작성 버튼의 크기 및 스타일을 지정할 수 있습니다.



image.png











4) 입력폼 설정 창의 "입력폼 편집" 탭에서 폼 항목을 추가하거나 삭제 또는 순서 변경 등이 가능합니다.



(1) 항목 추가 : 입력폼의 항목을 추가할 수 있습니다.


(2) 항목 삭제 : 각 항목 박스 우측 상단에 X 버튼을 이용하여 항목을 삭제할 수 있습니다.


(3) 항목 제목 : 각 항목의 제목을 입력하여 설정할 수 있습니다.


(4) 필수 항목 : 이용자가 입력폼을 작성하여 제출 시 필수로 입력해야 하는 항목을 지정할 수 있습니다. 필수 항목을 입력하지 않으면, 제출이 되지 않습니다.


(5) 항목 유형 : 추가한 항목의 유형을 설정할 수 있습니다.


-단답형 : 한 줄짜리 입력양식


-서술형 : 여러 줄 입력양식


-단일 선택형 : 여러 개의 항목을 생성 후 해당 항목의 값 중 한 가지만 선택하여 제출할 수 있는 양식


-다중 선택형 : 여러 개의 항목을 생성 후 생성된 항목의 값을 여러 개 선택하여 제출할 수 있는 양식


-목록 선택형 : 단일 선택형 양식과 유사하지만 셀렉트 박스 형태의 스타일을 가지고 있는 양식


-파일 업로드 : 이미지 등의 간단한 파일을 사용자에게 제출받을 때 사용하는 양식


-연락처 : 사용자에게 연락처를 입력받을 때 사용하는 양식으로 [XXX]-[XXXX]-[XXXX]의 형태로 제공


-날짜/시간 : 날짜 및 시간을 선택하여 입력받는 양식



image.png










<요소 설정 값이 적용된 입력폼 요소>



image.png













<모바일 버전>


입력폼 요소 가이드


*입력폼 요소는 웹사이트에서 자주 보이는 문의사항, 설문조사 등 특정 정보를 이용자에게 입력받아 사이트 관리자가 데이터를 수집할 때 이용하는 요소입니다.







1) 입력폼 요소를 추가할 섹션 위에서 마우스 우 클릭 -> 요소 추가를 클릭하여 요소 추가 사이드바를 열고  "입력폼" 요소 아이콘을 클릭하여 요소를 추가합니다.

   또는 섹션 영역 중앙에 있는 플러스 버튼을 눌러 요소 추가 사이드바를 열고 "입력폼" 요소 아이콘을 클릭하여 요소를 추가합니다.

image.png














2) 추가된 입력폼 요소 위에 마우스 우 클릭 팝업메뉴 호출 후 -> 입력폼 설정을 클릭하여 설정 창을 열어줍니다.



image.png













3) 설정 창의 "기본 설정"에서는 입력폼 이름, DB 연동 설정, 권한 설정, 폼 스타일 등을 설정할 수 있습니다.



(1) 입력폼 이름 : 사이트 내 여러 개의 입력폼을 사용하는 경우도 있으므로, 각 입력폼의 이름을 다르게 지정하여 DB(데이터베이스) 값을 따로 저장할 수 있습니다.


(2) 입력폼 연동 : 이전에 생성되었던 입력폼 DB(입력폼 이름)를 불러들여서 그대로 사용할 수 있습니다.


(3) 권한 설정 : 입력폼을 작성할 수 있는 권한을 설정할 수 있습니다. 비회원/회원/지정그룹 중에 작성 권한이 없는 로그인 계정은 입력폼을 작성하여 보낼 수 없게 됩니다.


(4) 작성 후 메인화면으로 이동 : 입력폼을 작성 후 사이트의 메인화면으로 강제로 이동시킵니다.


(5) 개인정보처리방침 동의 사용 : 이름, 이메일, 연락처 등의 개인 정보를 입력받는 경우에는 개인정보처리방침 약관을 명시하여 동의를 받아야 합니다.


(6) 제3자 정보제공 동의 사용 : 입력받은 개인 정보를 다른 제3자와 공유하여 이용할 시 체크하여 약관을 명시해 주고 동의를 받아야 합니다.


(7) 색상 설정 : 입력폼의 글자/배경/선 색 등을 지정할 수 있습니다.


(8) 버튼 설정 :  입력폼의 작성 버튼의 크기 및 스타일을 지정할 수 있습니다.



image.png











4) 입력폼 설정 창의 "입력폼 편집" 탭에서 폼 항목을 추가하거나 삭제 또는 순서 변경 등이 가능합니다.



(1) 항목 추가 : 입력폼의 항목을 추가할 수 있습니다.


(2) 항목 삭제 : 각 항목 박스 우측 상단에 X 버튼을 이용하여 항목을 삭제할 수 있습니다.


(3) 항목 제목 : 각 항목의 제목을 입력하여 설정할 수 있습니다.


(4) 필수 항목 : 이용자가 입력폼을 작성하여 제출 시 필수로 입력해야 하는 항목을 지정할 수 있습니다. 필수 항목을 입력하지 않으면, 제출이 되지 않습니다.


(5) 항목 유형 : 추가한 항목의 유형을 설정할 수 있습니다.


-단답형 : 한 줄짜리 입력양식


-서술형 : 여러 줄 입력양식


-단일 선택형 : 여러 개의 항목을 생성 후 해당 항목의 값 중 한 가지만 선택하여 제출할 수 있는 양식


-다중 선택형 : 여러 개의 항목을 생성 후 생성된 항목의 값을 여러 개 선택하여 제출할 수 있는 양식


-목록 선택형 : 단일 선택형 양식과 유사하지만 셀렉트 박스 형태의 스타일을 가지고 있는 양식


-파일 업로드 : 이미지 등의 간단한 파일을 사용자에게 제출받을 때 사용하는 양식


-연락처 : 사용자에게 연락처를 입력받을 때 사용하는 양식으로 [XXX]-[XXXX]-[XXXX]의 형태로 제공


-날짜/시간 : 날짜 및 시간을 선택하여 입력받는 양식



image.png









<요소 설정 값이 적용된 입력폼 요소>



image.png