Componente Página (versión 2) page-component

El componente Página es un componente de página ampliable diseñado para trabajar con el editor de plantillas y permite ensamblar el encabezado/pie de página y los componentes de estructura con el editor de plantillas.

Uso usage

El componente Página forma la base de todas las páginas diseñadas con los componentes principales, así como las plantillas editables. Mediante el uso del componente Página, los encabezados, los pies de página y la estructura de la página se pueden definir como una plantilla que utilice los demás componentes principales.

Mediante el cuadro de diálogo de diseño, se pueden definir bibliotecas personalizadas del lado del cliente para la página. A diferencia de otros componentes que tienen un cuadro de diálogo de edición accesible directamente desde el componente, ya que el componente Página es la propia página, el cuadro de diálogo de edición del componente Página es la ventana de propiedades de página.

Versión y compatibilidad version-and-compatibility

Este documento describe la versión 2 del componente Página, que se introdujo con la versión 2.0.0 de los componentes principales en enero de 2018.

CAUTION
Este documento describe la versión 2 del componente Página.
Para obtener más información sobre la versión actual del componente Página, consulte el documento Componente Página.

Compatibilidad con la aplicación web progresiva pwa-support

La versión 2.15.0 de los componentes principales introdujo la compatibilidad con las aplicaciones web progresivas (PWA) de AEM as a Cloud Service. Con una configuración simple a nivel de sitio, convierta su experiencia AEM en una PWA.

Detalles técnicos technical-details

La documentación técnica más reciente sobre el componente de página se encuentra en GitHub.

Puede encontrar más información sobre el desarrollo de componentes principales en la documentación para desarrolladores de componentes principales.

Cuadro de diálogo de edición edit-dialog

Dado que el componente representa la página completa, la configuración que normalmente estaría en un cuadro de diálogo de edición se encuentra en la ventana Propiedades de página.

Cuadro de diálogo de diseño design-dialog

Dado que el componente representa la página completa, se accede al cuadro de diálogo de diseño a través de Información de página -> Política de página al editar la plantilla de página.

Política de la página

NOTE
En versiones anteriores de AEM, Política de página se llamaba Diseño de página.

Pestaña Propiedades properties-tab

Con la ventana Diseño de página, puede definir las bibliotecas de cliente que se van a cargar, así como la biblioteca de recursos web para la página.

  • Bibliotecas de cliente: define las categorías de biblioteca de cliente que se van a cargar. JavaScript se agrega al final del cuerpo y CSS se agrega al encabezado de la página.

  • Encabezado de página JavaScript de bibliotecas de clientes: define las categorías de biblioteca de cliente JavaScript que se cargarán en el encabezado de página.

    • Las categorías definidas aquí que también están presentes en el campo Bibliotecas de cliente tendrán JavaScript cargado en el encabezado de la página en lugar de en el final del cuerpo.
    • No se cargará CSS a menos que la categoría también esté presente en el campo Bibliotecas de cliente.
  • Biblioteca de cliente de recursos web: categoría de la biblioteca de cliente que se usa para publicar recursos web, como los iconos favoritos.

  • Saltar al selector de elementos de contenido principal: se utiliza como función de accesibilidad para saltar directamente al contenido principal de la página

Cuadro de diálogo de diseño de componente de página

Las bibliotecas se pueden configurar para los campos Bibliotecas de cliente y Encabezado de página de bibliotecas de cliente de JavaScript de la siguiente manera:

  • Para agregar un nuevo campo, toque o haga clic en el botón Añadir situado debajo de los campos.
  • Para quitar un campo, pulse el icono de la papelera que hay junto al campo que se va a eliminar o haga clic en él.
  • Para reorganizar el orden de carga, arrastre el controlador situado junto al campo que desee mover.

Para obtener más información sobre el uso de bibliotecas del lado del cliente, consulte Uso de bibliotecas del lado del cliente.

CAUTION
La capacidad de definir por separado las bibliotecas de cliente para el encabezado de página se ha introducido con la versión 2.2.0 de los componentes principales.

Pestaña Estilos styles-tab

El componente Página es compatible con el sistema de estilos de AEM.

Capa de datos del cliente de Adobe data-layer

El componente de página es compatible con la capa de datos del cliente de Adobe.

recommendation-more-help
d2be9096-a81e-404b-9952-d8925af7219c