폼을 여러 단계로 설정할 수 있는 양식 단계 필드를 설정하는 방법입니다. 양식 단계 필드는 3가지의 구성 요소로 이루어져있습니다.
지금부터 양식 단계 필드 설정을 설명하겠습니다.
양식 단계 필드 상세 설정 편집 #
1. 양식 단계 필드를 드래그 앤 드롭해 양식 단계 필드를 추가합니다.
2. 필드 위에 마우스를 올리면 나타나는 편집 아이콘을 클릭하거나, 필드를 선택했을 때 오른쪽 사이드바에 있는 Input Customization(필드 사용자 정의) 탭을 클릭합니다.
3. Input Customization(필드 사용자 정의) 항목에서 기본 필드 설정을 변경할 수 있습니다.
필드 상세 설정 – 양식 단계 설정 Start Paging #
1. 맨 위에 있는 양식 단계 필드의 첫 번째 항목을 클릭합니다.
2. 요소 클래스: 입력 필드 자체에 사용자 지정 CSS 클래스를 추가할 수 있습니다.
3. 진행 표시기: 진행 표시기의 스타일을 세 가지 옵션 중에서 선택할 수 있습니다.
3-2. 진행 표시 줄: 진행 막대가 표시되어 사용자가 진행 상황을 숫자로 확인할 수 있습니다. (예: “4단계 중 1단계 완료”)
3-3. 단계: 단계의 이름이 표시되어 사용자가 진행 상황을 시각적으로 확인할 수 있습니다.
3-4. 없음: 진행 표시기가 표시되지 않습니다.
4. 자동 초점 비활성화: 기본적으로 단계 양식에서 자동 스크롤이 활성화되어 있습니다. 이 체크박스를 선택하여 자동 스크롤을 비활성화할 수 있습니다.
5. 자동 페이지 전환 활성화: 기본적으로 자동 페이지 전환이 비활성화되어 있습니다. 이 체크박스를 선택하여 자동 페이지 전환을 활성화할 수 있습니다.
6. 단계별 데이터 저장 활성화: 이 옵션을 활성화하면 각 단계 변경 시 현재 단계의 데이터가 저장됩니다. 사용자가 양식을 중단한 위치에서 다시 시작할 수 있습니다.
필드 상세 설정 – 양식 단계 설정 Page Break #
1. 폼 중간에 있는 양식 단계 필드의 두 번째 항목을 클릭합니다.
2. 이전 버튼: 두 가지 옵션 중에서 선택할 수 있습니다.
2-2. 기본: 텍스트 버튼이 이전 페이지로 이동합니다.
2-3. Image: 선택한 아이콘이 이전 페이지로 이동합니다.
3. 이전 버튼 텍스트/이미지: 이전 버튼의 텍스트를 수정하거나 이미지 아이콘 링크를 추가합니다.
4. 다음 버튼: 두 가지 옵션 중에서 선택할 수 있습니다.
4-2. 기본: 텍스트 버튼이 다음 페이지로 이동합니다.
4-3. Image: 선택한 아이콘이 다음 페이지로 이동합니다.
5. 다음 버튼 텍스트/이미지: 다음 버튼의 텍스트를 수정하거나 이미지 아이콘 링크를 추가합니다.
6. 요소 클래스: 입력 필드 자체에 사용자 지정 CSS 클래스를 추가할 수 있습니다.
필드 상세 설정 – 양식 단계 설정 Paging End #
1. 폼 끝에 있는 양식 단계 필드의 세 번째 항목을 클릭합니다.
2. 요소 클래스: 입력 필드 자체에 사용자 지정 CSS 클래스를 추가할 수 있습니다.
3. 이전 버튼: 두 가지 옵션 중에서 선택할 수 있습니다.
3-2. 기본: 텍스트 버튼이 이전 페이지로 이동합니다.
3-3. Image: 선택한 아이콘이 이전 페이지로 이동합니다.
4. 이전 버튼 텍스트/이미지: 이전 버튼의 텍스트를 수정하거나 이미지 아이콘 링크를 추가합니다.
이것으로 양식 단계 필드 설정에 대한 설명을 마칩니다. 더 궁금한 점이 있다면 언제든지 q&a 게시판이나 문의를 이용해주세요. 감사합니다!
