Forms 포털 구성 요소에 대한 템플릿 맞춤화 customizing-templates-for-forms-portal-components

사전 요구 사항 prerequisites

양식 메타데이터 관리

HTML 및 CSS 관련 실무 지식

개요 overview

AEM Forms 사용자 인터페이스를 사용하면 모든 양식에 메타데이터를 추가할 수 있습니다. 사용자 지정 메타데이터는 조직의 양식을 나열하고 검색하는 동안 사용자 경험을 향상시킬 수 있습니다.

Forms 포털을 사용하면 양식 목록에서 사용자 지정 메타데이터를 사용할 수 있습니다. 에셋에 대한 사용자 지정 템플릿을 만드는 동안 해당 레이아웃을 수정하고 CSS 스타일 세트와 함께 사용자 지정 메타데이터를 사용할 수 있습니다.

다양한 Forms 포털 구성 요소에 대한 사용자 지정 템플릿을 만들 수 있도록 다음을 수행하십시오.

사용자 지정 템플릿 만들기 creating-a-nbsp-custom-template

작업 예 working-example

다음은 Forms 포털이 검색 및 목록 구성 요소에 대한 사용자 지정 Geometrixx Gov 카드 레이아웃을 획득하는 사용자 지정 템플릿의 샘플 구현입니다.

<div class="__FP_boxes-container __FP_single-color">
    <div class="boxes __FP_boxes __FP_single-color" data-repeatable="true">
 <div class="__FP_boxes-thumbnail">
     <img src ="${path}/jcr:content/renditions/cq5dam.thumbnail.319.319.png"/>
        </div>
        <h3 class="__FP_single-color" title="${name}" tabindex="0">${name}</h3>
        <p>${description}</p>
        <div class="boxes-icon-cont __FP_boxes-icon-cont">
            <div class="op-dow">
                <a href="${formUrl}" target="_blank" class="__FP_button ${htmlStyle}" title="${config-htmlLinkText}">${localize-Apply}</a>
                <a href="${pdfUrl}" class="__FP_button ${pdfStyle}" title="${config-pdfLinkText}">${localize-Download}</a>
            </div>
        </div>
    </div>
</div>

사용자 정의 템플릿에 대한 기술 사양 technical-specifications-for-custom-templates

Forms 포털 구성 요소에 대한 사용자 지정 템플릿에는 반복 가능한 항목과 반복 불가능한 항목이 포함되어 있습니다. 반복 가능한 항목은 나열할 기본 엔티티입니다. 반복 가능한 항목의 예로는 검색 및 목록 작성자, 초안 및 제출, 링크 구성 요소 등이 있습니다.

Forms 포털은 자리 표시자가 사용자 지정/기본 제공 메타데이터를 표시할 수 있는 구문을 제공합니다. 양식, 초안 또는 제출 결과를 표시한 후 자리 표시자가 채워집니다.

반복 가능한 항목을 포함하려면 특성 data-repeatable ​의 값을 true(으)로 구성하십시오.

설명한 예제에서 두 개의 Div 요소가 사용자 지정 템플릿의 맨 위에 있습니다. 첫 번째는 "__FP_boxes-container" CSS 클래스와 함께 나열되는 양식의 컨테이너 요소로 작동합니다. 두 번째는 "__FP_boxes" CSS 클래스와 함께 기본 엔터티용 템플릿이며, 이 경우 폼입니다. Div 요소에 있는​ data-repeatable ​특성의 값은​ true. ​입니다.

각 자리 표시자에는 배타적인 기본 메타데이터 세트가 있습니다. 양식의 특정 위치에 사용자 지정 메타데이터를 표시하려면 해당 위치에 ${metadata_prop} 속성 ​을(를) 추가하십시오.

이 예제에서 메타데이터 속성은 여러 인스턴스에 사용됩니다. 예를들어,description,name,formUrl,htmlStyle,pdfUrl,pdfStyle ​및​ path ​에서 지정된 방식으로 사용됩니다.

기본 제공 메타데이터 out-of-the-box-metadata

다양한 Forms 포털 구성 요소는 목록에 사용할 수 있는 독점적인 메타데이터 세트를 제공합니다.

Search & Lister 구성 요소 search-amp-lister-component

사용자 인터페이스에서 로컬라이제이션, 정렬 및 구성 속성 사용 지원(Search & List만 해당):

링크 구성 요소 link-component

초안 및 제출 구성 요소 drafts-amp-submissions-component

참고:

A. 컨테이너 요소

B. "path" 메타데이터에서 각 양식에 저장된 축소판을 가져올 수 있는 고정 계층 구조를 포함합니다.

각 양식의 템플릿 섹션에 사용되는 C. 데이터 반복 가능 특성

D. "적용" 문자열 현지화

E. 구성 속성 pdfLinkText 사용

F. "pdfUrl" 메타데이터 사용

팁, 요령 및 알려진 문제 tips-tricks-and-known-issues

관련 문서