자습서: 첫 번째 적응형 양식 만들기 tutorial-create-your-first-adaptive-form

버전
문서 링크
AEM as a Cloud Service
여기 클릭
AEM 6.5
이 문서

01-create-first-adaptive-form-hero-image

소개 introduction

모바일 친화적인 제품을 찾고 계십니까 양식 경험 등록을 간소화하고 참여를 늘리며 소요 시간을 단축합니다. 적응형 양식 당신에게 딱 맞는군요 적응형 양식은 모바일, 자동화 및 분석 친화적 양식 경험을 제공합니다. 반응형 및 대화형 양식을 손쉽게 제작하고, 자동화된 프로세스를 사용하여 관리 및 반복 작업을 줄이고, 데이터 분석을 사용하여 고객의 양식 사용 경험을 개선하고 개인화할 수 있습니다.

이 튜토리얼에서는 적응형 양식을 만들기 위한 전체적인 프레임워크를 제공합니다. 자습서는 사용 사례와 여러 안내서로 구성됩니다. 각 안내서는 이 자습서에서 만든 적응형 양식에 새로운 기능을 학습하고 추가하는 데 도움이 됩니다. 모든 안내서 다음에 작업 적응형 양식이 있습니다. 적응형 양식 만들기 안내서를 사용할 수 있습니다. 다음 안내서가 곧 제공될 예정입니다. 이 자습서를 마치면 다음을 수행할 수 있습니다.

  • 적응형 양식 및 양식 데이터 모델 만들기
  • 적응형 양식에 스타일을 지정합니다.
  • 적응형 양식 규칙 편집기를 사용하여 비즈니스 규칙을 작성하십시오.
  • 적응형 양식을 테스트하고 게시합니다.

적응형 양식 워크플로 만들기

여정은 사용 사례 학습부터 시작합니다.

웹 사이트에서는 다양한 고객을 위한 다양한 제품을 제공합니다. 고객은 포털을 탐색하고 제품을 선택하고 주문합니다. 모든 고객은 계정을 만들고 배송 및 청구 주소를 제공합니다. 기존 고객인 Sara Rose는 자신의 배송 주소를 웹사이트에 추가하려고 합니다. 웹사이트는 배송 주소를 추가하고 업데이트할 수 있는 온라인 양식을 제공합니다.

웹 사이트는 Adobe Experience Manager(AEM)에서 실행되고 AEM을 사용합니다 Forms 데이터 캡처 및 처리용 주소 추가 및 업데이트 양식은 적응형 양식입니다. 웹 사이트는 고객 세부 정보를 데이터베이스에 저장합니다. 주소 추가 및 업데이트 양식을 사용하여 사용 가능한 주소를 검색하고 표시합니다. 또한 적응형 양식을 사용하여 업데이트된 새 주소를 수락합니다.

전제 조건 prerequisite

  • 설정 AEM 작성자 인스턴스

  • 설치 AEM Forms 추가 기능 작성자 인스턴스에서 참조할 수 있습니다.

  • 데이터베이스 공급자로부터 JDBC 데이터베이스 드라이버(JAR 파일)를 가져옵니다. 자습서의 예는 다음을 기반으로 합니다 MySQL 데이터베이스 및 사용 Oracle’s MySQL JDBC 데이터베이스 드라이버.

  • 아래 필드가 표시된 고객 데이터를 포함하는 데이터베이스를 설정합니다. 적응형 양식을 만드는 데 데이터베이스가 반드시 필요한 것은 아닙니다. 이 자습서에서는 데이터베이스를 사용하여 AEM의 양식 데이터 모델 및 지속성 기능을 표시합니다 Forms.

적응형 양식 데이터

1단계: 적응형 양식 만들기 step-create-an-adaptive-form

03-create-adaptive-form-main-image_small

적응형 양식은 새로운 세대의 매력적인 반응형 동적 적응형 양식입니다. 적응형 양식을 사용하여 개인화되고 타겟팅된 경험을 제공할 수 있습니다. AEM Forms 적응형 양식을 만들려면 드래그 앤 드롭 WYSIWYG 편집기를 제공하십시오. 적응형 양식에 대한 자세한 내용은 적응형 양식 작성 소개.

목표:

  • 고객이 배송 주소를 추가할 수 있도록 하는 적응형 양식을 만듭니다.
  • 적응형 양식의 레이아웃 필드를 통해 고객의 정보를 표시하고 수락합니다.
  • 제출 액션을 만들어 양식 콘텐츠가 포함된 이메일을 보냅니다.
  • 적응형 양식을 미리 보고 제출합니다.

안내서 참조

2단계: 양식 데이터 모델 만들기 step-create-form-data-model

05-create-form-data-model-main_small

양식 데이터 모델을 사용하면 적응형 양식을 개별 데이터 소스에 연결할 수 있습니다. 예를 들어 AEM 사용자 프로필, RESTful 웹 서비스, SOAP 기반 웹 서비스, OData 서비스 및 관계형 데이터베이스가 있습니다. 양식 데이터 모델은 연결된 데이터 소스에서 사용할 수 있는 비즈니스 엔터티 및 서비스의 통합 데이터 표시 스키마입니다. 양식 데이터 모델을 적응형 양식과 함께 사용하여 데이터를 검색, 업데이트, 삭제 및 연결된 데이터 소스에 추가할 수 있습니다.

목표:

  • 웹 사이트의 데이터베이스 인스턴스 구성(MySQL 데이터베이스)를 데이터 소스로 사용하는 경우입니다.
  • 다음을 사용하여 양식 데이터 모델 만들기 MySQL 데이터베이스를 데이터 소스로 사용합니다.
  • 데이터 모델을 형성할 수 있도록 데이터 모델 개체를 추가합니다.
  • 양식 데이터 모델에 대한 읽기 및 쓰기 서비스를 구성합니다.
  • 테스트 데이터를 사용하여 양식 데이터 모델 및 구성된 서비스를 테스트합니다.

안내서 참조

3단계: 적응형 양식 필드에 규칙 적용 step-apply-rules-to-adaptive-form-fields

07-apply-rules-to-adaptive-form_small

적응형 양식은 적응형 양식 오브젝트에 대한 규칙을 작성할 편집기를 제공합니다. 이러한 규칙은 양식에 대한 사전 설정 조건, 사용자 입력 및 사용자 작업을 기반으로 양식 개체에서 트리거하는 작업을 정의합니다. 정확도를 보장하고 양식 작성 시간을 단축하는 데 도움이 됩니다.

목표:

  • 적응형 양식 필드에 규칙을 만들어 적용합니다.
  • 규칙을 사용하여 양식 데이터 모델 서비스를 트리거하여 데이터베이스에 데이터를 업데이트합니다.

안내서 참조

4단계: 적응형 양식 스타일 지정 step-style-your-adaptive-form

적응형 양식 스타일 지정

적응형 양식은 테마와 편집자 을 클릭하여 적용형 양식에 대한 테마를 만들 수 있습니다. 테마에는 구성 요소 및 패널의 스타일 지정 세부 정보가 포함되어 있으며 다른 양식에서 테마를 다시 사용할 수 있습니다. 스타일에는 배경색, 상태 색상, 투명도, 정렬과 크기와 같은 속성이 포함됩니다. 테마를 양식에 적용하면 지정된 스타일이 양식의 해당 구성 요소를 반영합니다. 적응형 양식은 양식별 스타일에 대한 인라인 스타일링도 지원합니다.

목표:

  • 적응형 양식에 즉시 사용 가능한 테마를 적용합니다.
  • 테마 편집기를 사용하여 적응형 양식에 대한 테마를 만듭니다.
  • 사용자 지정 테마에서 Web Fonts을 사용합니다.

안내서 참조

5단계: 적응형 양식 게시 step-publish-your-adaptive-form

12-publish-your-adaptive-form-_small

적응형 양식을 AEM에 포함하여 독립형 양식(단일 페이지 애플리케이션)으로 게시할 수 있습니다 사이트 페이지또는 AEM의 목록 Site 사용 Forms 포털.

목표:

  • 적응형 양식을 AEM 페이지로 게시합니다.
  • AEM에 적응형 양식 포함 Sites 페이지.
  • 적응형 양식을 외부 웹 페이지(AEM 외부에 호스트된 비 AEM 웹 페이지)에 임베드합니다.

안내서 참조

recommendation-more-help
19ffd973-7af2-44d0-84b5-d547b0dffee2