¿Qué son los modos de vista en Drupal 8?

Drupal es bien conocido por su flexibilidad en la gestión y presentación de contenido. Los modos de vista de Drupal le permiten representar (mostrar) una entidad o entidades de Drupal (como nodos) de cierta manera, según un contexto particular.

Este tutorial demostrará el uso de los modos de vista de Drupal con un ejemplo. Instalaremos y también utilizaremos los módulos Field Group y Display Suite.

¡Empecemos!

Paso 1. Instale los módulos requeridos

• Abra la aplicación de terminal y coloque el cursor en la raíz de la instalación de Drupal.

• Escribe:

el compositor requiere "drupal//field_group:^3.0"

compositor requiere drupal/ds

• Haga clic en Extender .

• Habilite Display Suite y Field Group .

• Haga clic en Instalar .

El sistema le pedirá que habilite el módulo Layout Discovery.

• Haga clic en Continuar .

No se requieren más módulos.

Paso 2. El tipo de contenido

A los efectos de este tutorial, vamos a crear un tipo de contenido llamado 'Persona famosa' con los campos que se detallan en la siguiente tabla. Siga junto con el mismo tipo de contenido o cree otro, como 'Autor', 'Paciente' o incluso otro tipo de entidad como 'Miembro', por ejemplo. Recuerde , los modos de vista se pueden aplicar a todo tipo de entidades, no solo a nodos .

Los campos:

• Nació

• Murió

• Conocido por

se agruparán en un grupo de campos denominado Datos personales.

Paso 3. Crear el grupo de campo

• Haga clic en Administrar pantalla > Agregar grupo de campos .
• Seleccione Fieldset en el menú desplegable.
• Agregue una etiqueta adecuada.
• Haz clic en Crear grupo .

• Arrastre el conjunto de campos debajo del campo Imagen.

• Oculte la etiqueta de la imagen.

• Agrupe los campos dentro del fieldset sangrándolos.

• Haga las etiquetas dentro del fieldset en línea .

• Haga clic en Guardar .

Tenga en cuenta que ya estamos configurando uno de los dos modos de vista activos en Drupal ( Predeterminado y Teaser ).

El modo de vista Predeterminado muestra el nodo completo, mientras que el modo de vista Teaser muestra la visualización teaser de los artículos en la página principal de Drupal.

Etapa 4. Crear contenido

• Haz clic en Contenido > Agregar contenido > Persona famosa

• Crea de 4 a 5 nodos

Paso #5. Crear modos de vista personalizados

• Haga clic en Estructura > Tipos de contenido .

• Seleccione Administrar visualización para el tipo de contenido 'Persona famosa' .

• Desplácese hacia abajo y haga clic en Configuración de visualización personalizada .

• Haz clic en Administrar modos de visualización .

Aquí podemos configurar los modos de vista existentes en diferentes tipos de entidades ( paquetes ). También podemos crear modos de vista personalizados para que coincidan con nuestros requisitos de diseño o información.

• Haga clic en Agregar modo de vista .

• Haga clic en Contenido .

• Dale al modo de vista un nombre propio.

• Haga clic en Guardar .

• Crea 2 modos de vista más.

Usé estos nombres: modo de vista Lifework - modo de vista Trivia

• Haga clic en Estructura > Tipos de contenido .

• Seleccione Persona famosa > Administrar visualización .

• Desplácese hacia abajo y haga clic en Configuración de pantalla personalizada una vez más.

• Compruebe los 3 modos de vista que acaba de crear.

• Haga clic en Guardar .

• Haga clic en el modo de visualización de datos personales .

• Desplácese hacia abajo y seleccione Diseño de dos columnas (en las opciones de Display Suite) en el menú desplegable.

• Haga clic en Guardar .

• Haga clic en Guardar nuevamente (eventualmente) para mover los campos a la nueva columna.

• Arrastre el conjunto de campos Datos personales a la parte superior de la columna izquierda.

• Coloque los tres campos correspondientes en consecuencia.

• Coloque la imagen en la columna de la derecha.

• Cambia el estilo de la imagen a medio.

• Haga clic en Actualizar .

• Arrastre todos los demás campos a la sección Deshabilitado .

• Desplácese hacia abajo y haga clic en Guardar .

• Repita el proceso con los otros dos modos de vista Usando las opciones de diseño:

  • Anchura igual de tres columnas

  • Tres columnas 25/50/25

Paso #6. Crear una vista

• Haga clic en Estructura > Vistas > Agregar vista .

• Dale a la vista un nombre propio.

• Seleccione Contenido de tipo Famoso .

• Marque Crear un bloque .

• Cambie el número de elementos por bloque a 1.

• Marque Usar un buscapersonas .

• Haga clic en Guardar y editar .

• Haga clic en la opción Campos en la sección Formato .

• Seleccione Contenido .

• Haga clic en Aplicar .

• Seleccione el primer modo de vista.

• Haga clic en Aplicar .

• Haga clic en Guardar .

• Haga clic en la sección Avanzado a la derecha de la interfaz de usuario de Vistas .

• Haz clic en Usar AJAX: No.

• Marque Usar AJAX .

• Haga clic en Aplicar .

• Haga clic en Guardar .

• Crea 2 bloques más con el mismo proceso. La única configuración que diferirá será el modo de visualización en la sección Formato .

Paso #7. Coloque los bloques

• Crea un artículo con solo el título.

• Haga clic en Guardar .

• Haga clic en Estructura > Diseño de bloque .

• Desplácese hacia abajo hasta la sección Contenido .

• Haz clic en Colocar bloque .

• Busque los 3 bloques.

• Haz clic en Colocar bloque .

• Desmarque Mostrar título .

• Restrinja el bloque al artículo que acabamos de crear.

• Haz clic en Guardar bloque .

• Repite el proceso con los otros 2 bloques.

• Reorganiza los bloques debajo del título.

• Haz clic en Guardar bloques .

Dirígete al artículo y échale un vistazo.

¡La frescura de Drupal! ¡Felicidades!

Díganos cómo piensa utilizar esta útil característica de Drupal. ¡Gracias por leer!