Crear modelos de fragmento de contenido

En este capítulo se explican los pasos para crear cinco modelos de fragmento de contenido:

  • Información de contacto
  • Dirección
  • Persona
  • Lugar de residencia
  • Equipo

Los modelos de fragmentos de contenido permiten definir relaciones entre tipos de contenido y mantener relaciones como esquemas. Utilice referencias de fragmento anidadas, varios tipos de datos de contenido y el tipo de ficha para la organización de contenido visual. Tipos de datos más avanzados, como marcadores de posición de pestañas, referencias de fragmento, objetos JSON y el tipo de datos de fecha y hora.

Este capítulo también explica cómo mejorar las reglas de validación de referencias de contenido como imágenes.

Requisitos previos

Este es un tutorial avanzado. Antes de continuar con este capítulo, asegúrese de haber completado la configuración rápida. Asegúrese de haber leído también la anterior información general para obtener más información sobre la configuración del tutorial avanzado.

Objetivos

  • Crear modelos de fragmento de contenido.
  • Agregue marcadores de posición de ficha, fecha y hora, objetos JSON, referencias de fragmento y referencias de contenido a los modelos.
  • Agregue la validación a las referencias de contenido.

Información general del modelo de fragmento de contenido

El siguiente vídeo proporciona una breve introducción a los modelos de fragmento de contenido y cómo se utilizan en este tutorial.

Crear modelos de fragmento de contenido

Vamos a crear algunos modelos de fragmento de contenido para la aplicación WKND. Si necesita una introducción básica para crear modelos de fragmento de contenido, consulte el capítulo correspondiente en la tutorial básico.

  1. Vaya a Herramientas > General > Modelos de fragmento de contenido.

    Ruta de los modelos de fragmento de contenido

  2. Select WKND compartido para ver la lista de modelos de fragmento de contenido existentes para el sitio.

Modelo de información de contacto

A continuación, cree un modelo que contenga la información de contacto de una persona o ubicación.

  1. Select Crear en la esquina superior derecha.

  2. Asigne al modelo un título "Información de contacto" y, a continuación, seleccione Crear. En el modal de éxito que aparece, seleccione Apertura para editar el modelo recién creado.

  3. Para empezar, arrastre un Texto de una sola línea en el modelo. Denle un Etiqueta de campo de "Teléfono" en el Propiedades pestaña . El nombre de la propiedad se rellena automáticamente como phone. Seleccione la casilla de verificación para que el campo Requerido.

  4. Vaya a la Tipos de datos y, a continuación, agregue otra Texto de una sola línea debajo del campo "Teléfono". Denle un Etiqueta de campo de "Correo electrónico" y también establézcalo en Requerido.

Adobe Experience Manager incluye algunos métodos de validación integrados. Estos métodos de validación le permiten agregar reglas de control a campos específicos en los modelos de fragmento de contenido. En este caso, vamos a añadir una regla de validación para garantizar que los usuarios solo puedan introducir direcciones de correo electrónico válidas al rellenar este campo. En el Tipo de validación menú desplegable, seleccione Correo electrónico.

El modelo de fragmento de contenido completado debería tener este aspecto:

Ruta del modelo de información de contacto

Una vez finalizado, seleccione Guardar para confirmar los cambios y cerrar el Editor del modelo de fragmento de contenido.

Modelo de dirección

A continuación, cree un modelo para una dirección.

  1. En el WKND compartido, seleccione Crear desde la esquina superior derecha.

  2. Introduzca un título para "Dirección" y, a continuación, seleccione Crear. En el modal de éxito que aparece, seleccione Apertura para editar el modelo recién creado.

  3. Arrastre y suelte una Texto de una sola línea en el modelo y asígnele un Etiqueta de campo de "Dirección de la calle". A continuación, el nombre de la propiedad se rellena como streetAddress. Seleccione el Requerido casilla de verificación.

  4. Repita los pasos anteriores y agregue cuatro campos más de "Texto de una sola línea" al modelo. Utilice las etiquetas siguientes:

    • Ciudad
    • Estado
    • Código postal
    • País
  5. Select Guardar para guardar los cambios en el modelo Address.

    El modelo de fragmento "Dirección" completado debería tener este aspecto:
    Modelo de dirección

Modelo de persona

A continuación, cree un modelo que contenga información sobre una persona.

  1. En la esquina superior derecha, seleccione Crear.

  2. Asigne al modelo un título de "Persona" y, a continuación, seleccione Crear. En el modal de éxito que aparece, seleccione Apertura para editar el modelo recién creado.

  3. Para empezar, arrastre un Texto de una sola línea en el modelo. Denle un Etiqueta de campo de "Nombre completo". El nombre de la propiedad se rellena automáticamente como fullName. Seleccione la casilla de verificación para que el campo Requerido.

    Opciones de nombre completo

  4. Los modelos de fragmento de contenido se pueden consultar en otros modelos. Vaya a la Tipos de datos a continuación, arrastre y suelte la Referencia de fragmento y asígnele la etiqueta "Información de contacto".

  5. En el Propiedades en la Modelos de fragmento de contenido permitidos , seleccione el icono de carpeta y, a continuación, elija la Información de contacto modelo de fragmento creado anteriormente.

  6. Agregue un Referencia de contenido y asígnele un Etiqueta de campo de "Imagen de perfil". Seleccione el icono de carpeta en Ruta raíz para abrir el modal de selección de rutas. Seleccione una ruta raíz contenido > Recursos y, a continuación, seleccione la casilla de verificación WKND compartido. Utilice la variable Select en la parte superior derecha para guardar la ruta. La ruta de texto final debe ser /content/dam/wknd-shared.

    Ruta raíz de referencia de contenido

  7. En Aceptar solo los tipos de contenido especificados, seleccione "Imagen".

    Opciones de imagen de perfil

  8. Para limitar el tamaño y las dimensiones del archivo de imagen, veamos algunas opciones de validación del campo de referencia de contenido.

    En Aceptar solo el tamaño de archivo especificado, seleccione "Menor o igual que" y a continuación aparecerán campos adicionales.
    Aceptar solo el tamaño de archivo especificado

  9. Para Max, introduzca "5" y para Seleccionar unidad, seleccione "Megabytes (MB)". Esta validación solo permite seleccionar imágenes que tengan el tamaño especificado.

  10. En Aceptar solo el ancho de imagen especificado, seleccione "Ancho máximo". En el Máx. (píxeles) que aparece, escriba "10000". Seleccione las mismas opciones para Aceptar solo una altura de imagen especificada.

    Estas validaciones garantizan que las imágenes añadidas no superen los valores especificados. Las reglas de validación deben tener este aspecto:

    Reglas de validación de referencia de contenido

  11. Agregue un Texto de varias líneas y asígnele un Etiqueta de campo de "Biografía". Deje el Tipo predeterminado como opción predeterminada "Texto enriquecido".

    Opciones de biografía

  12. Vaya a la Tipos de datos y, a continuación, arrastre una Enumeración campo debajo de "Biografía". En lugar del valor predeterminado Representar como , seleccione Lista desplegable y asígnele un Etiqueta de campo de "Nivel de experiencia del instructor". Introduzca una selección de opciones de nivel de experiencia del instructor, como Experto, avanzado, intermedio.

  13. A continuación, arrastre otro Enumeración en "Nivel de experiencia del instructor" y seleccione "casillas de verificación" en Representar como . Denle un Etiqueta de campo de "Habilidades". Introduce diferentes habilidades, como escalada de rock, surf, ciclismo, esquí y moto acuática. La etiqueta de opción y el valor de opción deben coincidir como se muestra a continuación:

    Enumeración de habilidades

  14. Por último, cree una etiqueta de campo "Detalles del administrador" utilizando una Texto multilínea campo .

Select Guardar para confirmar los cambios y cerrar el Editor del modelo de fragmento de contenido.

Modelo de ubicación

El siguiente modelo de fragmento de contenido describe una ubicación física. Este modelo utiliza marcadores de posición de tabulación. Los marcadores de posición de pestañas ayudan a organizar los tipos de datos en el editor de modelos y el contenido en el editor de fragmentos, respectivamente, mediante la categorización del contenido. Cada marcador de posición crea una ficha, similar a una ficha de un navegador de Internet, en el editor de fragmentos de contenido. El modelo Ubicación debe tener dos pestañas: Detalles de ubicación y dirección de ubicación.

  1. Como anteriormente, seleccione Crear para crear otro modelo de fragmento de contenido. Para el Título del modelo, introduzca "Ubicación". Select Crear seguido de Apertura en el modal de éxito que aparece.

  2. Agregue un Marcador de posición de tabulación al modelo y etiquete "Detalles de ubicación".

  3. Arrastre y suelte una Texto de una sola línea y etiquete "Nombre". Debajo de esta etiqueta de campo, añada un texto multilínea y etiquete "Descripción".

  4. A continuación, agregue una Referencia de fragmento y etiquete "Información de contacto". En la ficha propiedades, en Modelos de fragmento de contenido permitidos, seleccione Icono de carpeta y elija el modelo de fragmento "Información de contacto" creado anteriormente.

  5. Agregue un Referencia de contenido en "Información de contacto". Etiquetarla como "Imagen de ubicación". La variable Ruta raíz debe /content/dam/wknd-shared. En Aceptar solo los tipos de contenido especificados, seleccione "Imagen".

  6. Añadamos también un Objeto JSON en la imagen de ubicación. Como este tipo de datos es flexible, se puede utilizar para mostrar cualquier dato que desee incluir en el contenido. En este caso, el objeto JSON se utiliza para mostrar información sobre el tiempo. Etiqueta el objeto JSON "Tiempo por temporada". En el Propiedades , agregue Descripción por lo tanto, el usuario tiene claro qué datos deben introducirse aquí: "Datos JSON sobre la ubicación del evento por temporada (primavera, verano, otoño, invierno)."

    Opciones de objeto JSON

  7. Para crear la ficha Dirección, agregue una Marcador de posición de tabulación al modelo y etiquete "Dirección de ubicación".

  8. Arrastre y suelte una Referencia de fragmento y, en la pestaña propiedades , etiquete como "Dirección" y en Modelos de fragmento de contenido permitidos, seleccione Dirección modelo.

  9. Select Guardar para confirmar los cambios y cerrar el Editor del modelo de fragmento de contenido. El modelo de ubicación completo debe aparecer de la siguiente manera:

    Opciones de referencia de contenido

Modelo de equipo

Finalmente, cree un modelo que describa un equipo de personas.

  1. En el WKND compartido página, seleccione Crear para crear otro modelo de fragmento de contenido. Para el Título del modelo, escriba "Equipo". Como anteriormente, seleccione Crear seguido de Apertura en el modal de éxito que aparece.

  2. Agregue un Texto de varias líneas al formulario. En Etiqueta de campo, escriba "Descripción".

  3. Agregue un Fecha y hora al modelo y etiquete "Fecha de fundación del equipo". En este caso, mantenga el valor predeterminado Tipo está configurada en "Fecha", pero tenga en cuenta que también es posible utilizar "Fecha y hora" o "Hora".

    Opciones de fecha y hora

  4. Vaya a la Tipos de datos pestaña . Debajo de la "Fecha de base del equipo", agregue una Referencia de fragmento. En el Representar como , seleccione "multifield". Para Etiqueta de campo, escriba "Miembros del equipo". Este campo vincula a la variable Persona modelo creado anteriormente. Dado que el tipo de datos es un campo múltiple, se pueden agregar varios fragmentos de persona, lo que permite crear un equipo de personas.

    Opciones de referencia de fragmento

  5. En Modelos de fragmento de contenido permitidos, utilice el icono de carpeta para abrir el modal Seleccionar ruta y, a continuación, seleccione la opción Persona modelo. Utilice la variable Select para guardar la ruta.

    Seleccionar modelo de persona

  6. Select Guardar para confirmar los cambios y cerrar el Editor del modelo de fragmento de contenido.

Agregar referencias de fragmento al modelo de aventura

De forma similar a como el modelo Team tiene una referencia de fragmento al modelo Person, se debe hacer referencia a los modelos Team y Location desde el modelo Adventure para mostrar estos nuevos modelos en la aplicación WKND.

  1. En el WKND compartido seleccione Aventura modelo y, a continuación, seleccione Editar desde la barra de navegación superior.

    Ruta de edición de aventura

  2. En la parte inferior del formulario, debajo de "Qué traer", añada una Referencia de fragmento campo . Escriba un Etiqueta de campo de "Ubicación". En Modelos de fragmento de contenido permitidos, seleccione Ubicación modelo.

    Opciones de referencia de fragmento de ubicación

  3. Añadir una más Referencia de fragmento y etiquete "Equipo instructor". En Modelos de fragmento de contenido permitidos, seleccione Equipo modelo.

    Opciones de referencia de fragmento de equipo

  4. Agregue otro Referencia de fragmento y etiquete "Administrator".

    Opciones de referencia de fragmento de administrador

  5. Select Guardar para confirmar los cambios y cerrar el Editor del modelo de fragmento de contenido.

Prácticas recomendadas

Existen algunas prácticas recomendadas relacionadas con la creación de modelos de fragmento de contenido:

  • Cree modelos que se asignen a componentes de experiencia de usuario. Por ejemplo, la aplicación WKND tiene modelos de fragmento de contenido para aventuras, artículos y ubicación. También puede agregar encabezados, promociones o exenciones de responsabilidad. Cada uno de estos ejemplos crea un componente de experiencia de usuario específico.

  • Cree tantos modelos como sea posible. Limitar el número de modelos le permite maximizar la reutilización y simplificar la administración de contenido.

  • Anide los modelos de fragmento de contenido tan profundamente como sea necesario pero solo cuando sea necesario. Recuerde que el anidado se realiza con referencias de fragmento o referencias de contenido. Considere un máximo de cinco niveles de anidación.

¡Enhorabuena!

¡Enhorabuena! Ahora ha añadido fichas, utilizado los tipos de datos de fecha y hora y de objeto JSON, y ha aprendido más sobre referencias de fragmento y contenido. También ha añadido reglas de validación de referencia de contenido.

Pasos siguientes

El siguiente capítulo de esta serie abarcará creación de fragmentos de contenido de los modelos que ha creado en este capítulo. Obtenga información sobre cómo utilizar los tipos de datos introducidos en este capítulo y cree directivas de carpeta para limitar los modelos de fragmento de contenido que se pueden crear en una carpeta de recursos.

Aunque es opcional para este tutorial, asegúrese de publicar todo el contenido en situaciones de producción en el mundo real. Para obtener una revisión de los entornos Autor y Publicación en AEM, consulte la
AEM serie de vídeo sin encabezado y GraphQL.

En esta página