Personalizar plantillas para componentes del portal de formularios customizing-templates-for-forms-portal-components

Requisitos previos prerequisites

Administrar metadatos de formulario

Conocimientos prácticos de HTML y CSS

Información general overview

La interfaz de usuario de AEM Forms permite agregar metadatos a cualquier formulario. Los metadatos personalizados pueden mejorar la experiencia del usuario al enumerar y buscar formularios de su organización.

El portal de formularios permite utilizar metadatos personalizados en listas de formularios. Al crear plantillas personalizadas para los recursos, puede modificar su diseño y utilizar metadatos personalizados con el conjunto de estilos CSS.

Siga estos pasos para crear una plantilla personalizada para varios componentes de portal de formularios.

Crear una plantilla personalizada creating-a-nbsp-custom-template

Ejemplo práctico working-example

A continuación se muestra una implementación de ejemplo de una plantilla personalizada en la que el portal de formularios adquiere un diseño de tarjeta de gobierno personalizado de Geometrixx para el componente Buscar y listar.

<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>

Especificaciones técnicas de las plantillas personalizadas technical-specifications-for-custom-templates

Una plantilla personalizada para cualquier componente del portal de formularios incluye entradas repetibles y no repetibles. Las entradas repetibles son entidades básicas para las listas. Ejemplos de entradas repetibles son los componentes Buscar y listar, Borradores y envíos y Vínculo.

El portal de formularios proporciona una sintaxis para que los marcadores de posición muestren metadatos personalizados/OOTB. Los marcadores de posición se rellenan después de mostrar los resultados de los formularios, borradores o envíos.

Para incluir una entrada repetible, configure el valor del atributo data-repeatable a true.

*En el ejemplo analizado, hay dos elementos Div presentes en la parte superior de la plantilla personalizada. El primero, con la clase CSS “__FP_boxes-container” funciona como un elemento de contenedor para los formularios que se enumeran. El segundo, con la clase CSS “__FP_boxes” es una plantilla para las entidades básicas, en este caso un formulario. El atributo data-repeatable presente en el elemento Div tiene el valor true.

Cada marcador de posición tiene un conjunto de metadatos OOTB exclusivo. Para mostrar metadatos personalizados en un lugar determinado del formulario, agregue la variable $metadata_prop, propiedad en el lugar.

En el ejemplo, la propiedad metadata se utiliza en varias instancias. Por ejemplo, se utiliza en descripción,nombre,formUrl,htmlStyle,pdfUrl,pdfStyle ​y ruta ​de la manera prescrita.

Metadatos predeterminados out-of-the-box-metadata

Varios componentes del portal de formularios proporcionan conjuntos exclusivos de metadatos OOTB que puede utilizar para incluirlos en la lista.

Componente Buscar y listar search-amp-lister-component

Compatibilidad con la localización, clasificación y uso de propiedades de configuración en la interfaz de usuario (solo Buscar y listar):

Componente Vínculo link-component

Componente Borradores y envíos drafts-amp-submissions-component

Nota:

A. Elemento Contenedor

B. Metadatos de “ruta” con una jerarquía fija para obtener la miniatura almacenada para cada formulario.

C. Atributo repetible de datos utilizado en la sección de la plantilla para cada formulario

D. Localizar la cadena “Aplicar”

E. Usar la propiedad de configuración pdfLinkText

F. Usar los metadatos “pdfUrl”

Sugerencias, trucos y problemas conocidos tips-tricks-and-known-issues

Artículos relacionados