Tipos De Componentes

Defina componentes. Los componentes son la capa de datos que se conecta con la IU.

**Componentes personalizados **son publicaciones de blog, autores, direcciones, datos sin procesar personalizados, etc. **Componentes de IU **son solo componentes personalizados marcados como elementos de IU, pie de página, encabezado, hero, etc. **Componentes del sistema **predefinidos por el CMS como País e Idioma

¿Qué son los Componentes de IU?

Las páginas se componen de más de un Componente de IU

Ejemplos:

• hero-block
• feature-block
• image-carousel
• header/footer

Cada Componente de IU representa una sección de tu página.

Flujo de trabajo de Componentes de IU

1. Defina un componente (estructura del bloque) en el constructor de componentes
2. Cree el componente de IU
3. Asigne el Componente de IU a una página
4. Renderícelo en el cliente con el bloque apropiado en el registro de bloques y la configuración del renderizador

Ejemplo: Esquema del bloque hero

Un bloque hero puede contener:

• Imagen
• Encabezado
• Subtítulo

Esquema JSON en el editor

[
  {
    "name": "heading",
    "type": "string",
    "required": false,
    "displayName": "heading"
  },
  {
    "name": "subtitle",
    "type": "string",
    "required": false,
    "displayName": "subtitle"
  },
  {
    "name": "hero_img",
    "type": "image",
    "required": false,
    "displayName": "hero_img"
  }
]

Configuración del Panel de Administración

• Cree un bloque nuevo
• Adjunte el esquema (HeroSchema)
• Asigne un nombre al bloque (p. ej., hero-block)

Asignar el bloque a la página

• Vaya a una ruta en el panel de administración
• Haga clic en Asignar página
• Agregue el bloque recién creado

Renderizado en el cliente

Una vez asignado, el bloque se puede obtener y renderizar en el lado del cliente usando tu configuración de renderizador.

Resumen

• Los esquemas definen la estructura de los bloques
• Los bloques definen secciones de una página
• Las páginas se componen de varios bloques
• Totalmente personalizables y reutilizables