Drupal CCK+Vistas. Tipos de contenido. Salida de páginas mediante vistas. Creación de galería de empleados.

En la lección anterior, les hablé sobre qué es un nodo (node) en Drupal. Los nodos son nuestras entradas de blog, Page, Story. En esta lección, crearemos un nuevo tipo de contenido (Content type) llamado "Empleado". Este tipo de contenido lo utilizaremos para crear una lista de empleados con su fotografía y descripción.

Entonces, ¿qué módulos necesitaremos para esto?

Drupal CCK

1. CCK (Content Construction Kit) - este módulo permite crear nuevos tipos de contenido, así como añadirles varios campos para la entrada de datos.

El módulo de Drupal CCK es tan grande que se ha dividido en varios submódulos. Necesitaremos los siguientes submódulos:

1. Content - para crear nuevos tipos de contenido.
2. Content Permissions - para establecer permisos de edición y visualización de nuestro tipo de contenido.
3. Number - permite añadir un campo numérico al tipo de contenido, que puede usarse, por ejemplo, para el número de registro.
4. Option Widgets - permite añadir campos con opciones de selección (checkbox, select, radio button).
5. Text - permite añadir campos de texto al tipo de contenido.

Otros submódulos de CCK cumplen las siguientes funciones:

• Content copy - permite crear copias de tipos de contenido existentes, copiando sus campos.
• FieldGroup - agrupa los campos de entrada; como tenemos pocos campos, no necesitaremos este submódulo.
• NodeReference - permite agregar un campo que hace referencia a otro nodo; por ejemplo, si creamos un contenido "empleado" y ese empleado tiene una página propia tipo Page, podríamos enlazarla aquí.
• UserReference - permite agregar un campo que enlaza a un usuario registrado. Si los empleados estuvieran registrados en el sitio, podríamos enlazar al usuario correspondiente.

Guardamos la configuración de los módulos. Después de esto, debe aparecer el enlace Tipos de contenido en el menú de administración en la sección Contenido:

Agregaremos el tipo de contenido más tarde. Por ahora, procedamos con la instalación de los siguientes dos módulos.

FileField e ImageField en Drupal

2. FileField y ImageField. FileField añade un campo para subir archivos adjuntos al nodo. ImageField es similar pero solo permite subir archivos gráficos (imágenes jpg, gif, png). Instalaremos estos módulos que necesitaremos para subir fotos de los empleados.

Guardamos las configuraciones y procedemos a instalar los siguientes módulos.

Imagecache en Drupal

3. ImageCache y ImageAPI. ImageAPI es una API que se utiliza en lugar de la estándar image.inc. ImageCache nos permitirá crear una previsualización (preset) de las fotos de empleados, es decir, si subimos imágenes con diferentes tamaños, ImageCache las ajustará a un mismo tamaño.

También se puede usar el módulo lightbox2 para mostrar imágenes ampliadas al hacer clic. Es útil cuando los presets son pequeños y hay muchas imágenes. Al instalar lightbox2, se añaden automáticamente opciones con efecto lightbox.

4. Módulo Views. El módulo Views es un generador de consultas a la base de datos que permite mostrar listados de datos sin necesidad de SQL. Lo instalamos.

Guardamos la configuración. Ya tenemos los módulos necesarios para crear una lista de empleados con fotografías, pasemos a la creación de la lista.

Creación de una lista de empleados en Drupal

Primero debemos crear el tipo de contenido "empleado". Ingresamos desde el menú de administración: Contenido - Tipos de contenido - Agregar tipo de contenido.

Tenga en cuenta que el campo Nombre se mostrará en el menú de administración, por lo que conviene ingresarlo en ruso y claramente, mientras que el campo Tipo es usado por Drupal internamente y debe escribirse en letras latinas, sin espacios ni signos especiales (se puede usar guión bajo).

Ahora entre los tipos de contenido tenemos también "Empleado". Vamos a añadir campos de entrada de datos. Haga clic en "manage fields".

En la fila New field complete todos los campos:

Título - puede ingresarse en ruso

Nombre del campo - sin espacios, en letras latinas (se puede usar guión bajo)

Tipo de datos almacenados - elegimos "file", y luego seleccionamos "image" en el listado de widgets disponibles.

Hacemos clic en Guardar y nos redirige a la siguiente ventana de edición del campo. Guardamos esta configuración sin cambios.

Ahora nuestro tipo de contenido "Empleado" tiene un campo de carga para la fotografía del empleado. Añadiremos también dos campos más: "Nombre completo" y "Sobre el empleado". Para "Nombre completo" elegimos tipo de datos "texto", luego "Text field". En la siguiente ventana aumentamos la longitud del campo, por ejemplo a 100 caracteres.

Para "Sobre el empleado" elegimos también "texto", pero en la siguiente lista seleccionamos "textarea" (múltiples líneas). En la sección "Formato de texto", seleccionamos "texto filtrado (el usuario elige el formato de entrada)".

Hablaré más sobre los formatos de entrada en otro artículo.

Deberían quedar los siguientes campos de entrada:

Ahora el tipo de contenido está listo para crear el primer empleado. Desde el menú de administración ingresamos a "Contenido - Crear contenido - Empleado"

Luego se deben rellenar los datos del empleado igual que con una Entrada de blog, Page o Story, pero ahora también están los campos que agregamos: Fotografía del empleado, Nombre completo, Sobre el empleado:

Quizá se pregunte qué escribir en el Título y Contenido del empleado. De hecho, el Nombre completo duplica el campo Título, y "Sobre el empleado" el campo Contenido. Se puede usar el Título para ingresar nombre y apellidos, y el Contenido para la descripción. Agregué estos campos para mostrar cómo funciona CCK. Podríamos extender el tipo "Empleado" con campos como cargo, horario, oficina, lugar de trabajo, etc.

Guardamos el empleado creado. Como mencioné, todos los empleados serán nodos. Por ejemplo, el nodo del empleado Vasya tiene la dirección node/9. Actualmente, la URL se muestra en latín o cirílico (por el módulo pathauto), pero si hace clic en "Editar", verá que la dirección cambia a node/número_de_nodo/edit.

Ahora que sabemos cómo agregar empleados al sitio, necesitamos mostrar la lista de empleados de forma conveniente. Empezamos creando un preset; si aún no ha instalado ImageCache e ImageAPI, es momento de hacerlo. Puede crear un preset desde el menú: Estructura del sitio - ImageCache - Agregar nuevo preset.

Introducimos el nombre del preset, recomiendo incluir el ancho y alto en píxeles usando la letra X. Las acciones disponibles para presets son:

• Add Crop - recortar imagen a un rectángulo con desplazamientos y tamaño definidos.
• Add Deprecated Scale - predecesor de Scale and Crop. Será eliminado en ImageCache 2.1.
• Add Desaturate - convertir a escala de grises.
• Add Resize - redimensionar ignorando proporciones.
• Add Rotate - rotar imagen.
• Add Scale - escalar manteniendo proporciones (solo un valor necesario).
• Add Scale And Crop - escalar con proporciones, luego recortar a tamaño final.
• Add Sharpen - aplicar máscara de enfoque.

Ahora nos interesa "Add Scale And Crop". Lo seleccionamos. Yo configuraré 100x100 píxeles. Hacemos clic en guardar y el preset está creado.

Ahora pasamos al módulo Views, que generará una consulta para mostrar todos los empleados en la base de datos, con fotos de 100x100 px según el preset. Instalamos el módulo Views y el submódulo Views UI para trabajar con la interfaz.

Drupal Views

Desde el menú de administración vamos a la lista de vistas existentes: Estructura del sitio - Views. Por defecto hay varias vistas preconfiguradas: Archivo, Comentarios recientes, Página principal, Glosario, Términos de taxonomía, Publicaciones recientes, pero están desactivadas también por defecto.

Hacemos clic en "Agregar" y creamos una vista (view) para la galería de empleados. Es recomendable comenzar el nombre de la vista con el prefijo view_.

En la sección "View type" debe especificarse qué entidad se va a mostrar. Como el contenido "Empleado" es un nodo (en este caso traducido como "Material"), seleccionamos "node".

Después de hacer clic en "Next", accedemos a la interfaz de usuario de Views.

Nos interesan principalmente 4 bloques de la interfaz: Arguments, Sort criteria, Filtros (filters), y Campos (fields).

• Arguments - permite filtrar registros por argumento (por ejemplo, node/17 tiene argumento 17).
• Fields - aquí seleccionamos los campos que queremos mostrar de la base de datos.
• Sort criteria - define el orden de los resultados.
• Filters - permite filtrar resultados por criterios definidos.

Empezamos a configurar nuestra vista. Añadimos campos:

Seleccionamos campos del grupo "Contenido" como: Contenido: Nombre completo, Contenido: Sobre el empleado, Contenido: Fotografía del empleado (puede que estén agrupados de forma diferente según su instalación).

En la ventana de configuración del campo "Sobre el empleado", lo dejamos como está. Para "Nombre completo", quitamos el título:

Para el campo "Fotografía del empleado", quitamos el título y seleccionamos el preset creado anteriormente:

Los formatos disponibles para las fotos son:

100x100 - image - solo imagen sin enlace.
100x100 - image linked to node - imagen con enlace al nodo correspondiente.
100x100 - image linked to image - imagen enlazada a su versión original.

Si tiene instalado el módulo lightbox2, puede elegir un preset con efecto lightbox:

Después de hacer clic en "Actualizar", en la ventana de vista previa aparecerá la representación de la página.

Ahora necesitamos configurar los filtros para que el contenido se muestre correctamente. Añadimos filtros:

Filtramos por tipo de contenido (Empleado) y solo publicados:

Seleccionamos solo los publicados y solo Empleados.

Cambiamos el orden de los campos para visualización:

Haga clic en el botón al lado del encabezado "Campos". Aparecerá una lista de campos que puede mover. También puede eliminar campos no deseados. Guardamos los cambios.

Agregue algunos empleados más para ver cómo se verá la vista. Ahora seleccione "Página" como tipo de visualización y haga clic en "add display":

Ahora defina la ruta donde se mostrará esta vista:

Guarde los cambios y la vista. Ahora esta vista está disponible en la dirección nombre_del_sitio/sotrudniki.

En la próxima lección continuaré explicando el módulo Views, cómo mostrar el contenido en bloques y mejoraremos la lista de empleados.