Módulo Views 3 para Drupal 7: Tipos de presentación, formatos y campos

Bienvenidos al segundo artículo de la serie sobre Views en Drupal 7 en el que veremos algunos conceptos básicos para entender cómo crear vistas de forma efectiva. Podéis consultar en el primer artículo la definición e introducción al módulo views.

En este post veremos cómo definir campos en una vista, modificar el modo en el que se muestran los datos así como formas básicas de filtrar y ordenar los resultados. Vamos a repasar primero los conceptos necesarios y al final los vemos en un ejemplo.

Construir una vista en Drupal se puede parecer a construir una pared, necesitamos diversos elementos y cemento entre ellos ;).

¡Gracias a Carol VanHook por compartir con licencia creative commons!

Presentación: Páginas y bloques

Una de las grandes ventajas de Views es que permite modificar de una forma muy sencilla el tipo de presentación que queremos mostrarle al usuario, las formas de presentación más utilizadas son páginas y bloques.

  • Páginas: La presentación de tipo página proporciona una url obligatoria y una entrada opcional en el menú, los datos mostrados en esta presentación ocuparán la parte principal del contenido cuando se acceda a la url de la misma.
  • Bloques: La presentación de tipo bloque expondrá nuestra vista en la página de administración de bloques para que la podamos situar en la página que necesitemos. No es accesible directamente a través de ninguna url.

Otros tipos de presentaciones que proporciona el módulo por defecto incluyen exponer nuestros resultados a través de un canal de noticias (feed RSS) o usar nuestra vista como un adjunto en otra, lo que se conoce como Attachment views.

Hay que aclarar que en una vista podemos tener múltiples presentaciones lo que nos permitirá reutilizar elementos comunes. En futuros artículos veremos como entender y aprovechar esta gran funcionalidad de Views.

Formato de las vistas

El formato o estilo de una vista es el tipo de salida que le damos a nuestros datos, los estilos incluidos por defecto son la lista HTML, que encuadra nuestros datos en listas ordenadas o no ordenadas, tablas de datos, rejillas o cuadrículas y el enigmático "lista sin formato" que expone los datos encadenando elementos DIV.

La flexibilidad de Views permite que haya disponibles una gran diversidad de formatos además de los que incluye el propio módulo y que son proporcionados a través de otros módulos que extienden Views como puedan ser Views Slideshow, Views Accordion o Views data export.

Estas extensiones incluyen plugins de jQuery para mostrar nuestros datos en forma de carrusel, acordeón o slideshow, pero también alteran el formato, permitiéndonos exportar el contenido en CSV, Excel, PDF e incluso XML y JSON. Algunos módulos incluso proporcionan métodos para mostrar datos en mapas.

Mostrar contenido vs mostrar campos: Estilos de fila

Una de las barreras de entrada para comprender Views es diferenciar y saber elegir entre mostrar contenido y mostrar campos.

Mostrar contenido en cualquiera de sus formas, ya sea resumen, envíos completos, etc implica mostrar un nodo o entidad por cada fila usando las opciones de presentación propias del tipo de contenido, es decir que modificando las opciones de presentación del tipo de contenido, va a modificar cómo vemos la vista.

Es decir, si mostramos contenido del tipo Artículo y elegimos resúmenes o envíos completos, deberemos acceder a Estructura » Tipos de contenido » gestionar presentación, donde podemos elegir los campos del tipo de contenido que queremos mostrar y el modo en el que se van a visualizar.

¿Qué son los campos?

Los campos en el formato de views son trozos de información que pueden ser configurados y que se van a mostrar.

Nos dan la posibilidad de seleccionar de forma específica qué campos del tipo de contenido, usuarios y entidades en general queremos mostrar en nuestra vista. Esto nos proporcionará una mayor flexibilidad y tambien seremos independientes de las opciones de presentación del tipo de contenido o tipo de entidad. 

Hay múltiples razones para seleccionar campos en lugar de un estilo de tipo contenido completo, la primera de ellas es que cuando seleccionamos contenido, éste se carga completamente y entonces estamos cargando información que no vamos a mostrar o utilizar para nada (en Drupal 7 esto ya no es tan importante), y la razón principal es una razón de flexibilidad, ya que podremos escoger exactamente qué queremos recuperar y cuando hagamos relaciones con vistas nos resultará mucho más sencillo usar campos para poder mostrar información procedente de diversos tipos de entidad.

Para poder utilizar campos en nuestra vista, en la edición de la misma, bajo las opciones de formato, tendremos la posibilidad de seleccionar o bien Contenido o bien Campos.

Y en las opciones de Campos podemos agregar nuevos, reordenarlos, eliminarlos y también configurar las múltiples opciones de cada campo haciendo click en el mismo.

Vamos con el ejemplo

Para los ejemplos de estos posts he creado un tipo de contenido Lugar para hacer las pruebas un poco más vistosas. El tipo de contenido tiene un campo de nombre, descripción, imágenes, país (taxonomía), población y página web.

Vamos a hacer una vista básica para familiarizarnos con Views y sus funciones más elementales, una lista de lugares y sus descripciones. Usaremos un único tipo de presentación, de Página.

Lista de lugares y sus descripciones. Tipo de presentación: Página.

Vamos a listar todos los lugares con una descripción en una vista con presentación de página y utilizando campos. Para ello accedemos a Estructura » Vistas y hacemos click en el enlace Agregar nueva vista lo que nos llevará a una página ya conocida, la interfaz simplificada de Views donde rellenaremos los datos básicos de la vista. Así la he configurado yo:

Una vez configuradas las opciones básicas a nuestro gusto, hacemos click en Continuar y editar para seguir configurando la vista.

De momento vamos a fijarnos solamente en la parte izquierda de la vista.

Lo primero en lo que nos podemos fijar es que hay opciones ya configuradas por defecto, Views 3 incorpora estos pequeños detalles de usabilidad, y cuando creamos una vista de cero, nos preconfigura algunas opciones muy habituales como el campo título o filtrar por los nodos publicados.

Podremos configurar el nombre administrativo para nuestra presentación, si solamente tenemos una presentación en nuestra vista, puede que Page nos valga, pero si tenemos una vista con múltiples presentaciones, vamos a necesitar nombrarlas para poder distinguirlas.

El título es una opción bastante descriptiva, será el texto que aparezca en la etiqueta title cuando accedamos a nuestra vista.

En las opciones de formato podremos seleccionar si queremos mostrar nuestros datos en una tabla, una lista html o con divs (sin formato), podremos configurarla con el link Opciones. Vamos a configurarla como lista HTML haciendo click en "Lista sin formato" y seleccionamos Lista HTML.

Una vez le hemos dado a Apply, veremos las opciones, donde podremos seleccionar si queremos ver los resultados en una lista ordenada (ol) o desordenada y algunas opciones más, dándole de nuevo a Apply la tendremos configurada en nuestra vista.

Bajo el título CAMPOS encontramos los campos que se van a mostrar y usando el link agregar podremos añadir otros campos, para nuestro ejemplo, vamos a añadir la descripción de los lugares.

Buscamos y seleccionamos el campo Descripción y hacemos click en Añadir y configurar campo.

Podremos configurar gran cantiddad de opciones en esta pantalla, de momento lo vamos a dejar como está pero desde aquí podemos controlar la etiqueta que sale en el listado, opciones para el html resultante, o exponer el campo como un enlace entre muchas otras. Hacemos click en "Apply (all displays)" y ya podremos guardar nuestra vista.

Así es como queda la vista, recordad que los criterios de filtrado y ordenación los ha rellenado automáticamente Views con las opciones más habituales.

Solamente nos queda hacer click en el botón Guardar que está situado arriba a la derecha y ya tenemos nuestra primera vista con campos, si accedemos a la ruta que hemos configurado en las opciones básicas o en las opciones de ruta del interfaz de Views.

Todo es mucho más fácil de entender con un video

He decidido publicar tanto los tipos de contenido, como las configuraciones y las vistas en una feature en github que podéis descargar directamente con este enlace. Para importar la estructura en vuestro sitio de pruebas necesitaréis instalaros el módulo features, copiar la carpeta en el directorio de módulos y habilitar la feature cambrico_views_ejemplos. El csv lo podéis importar por ejemplo con feeds (la feature provee el importador) o node_export.

Comentarios

No me cansaré de agradecerte el ejemplo que das a los "sabios" drupaleros al usar tu blog para ayudar a los que estamos empezando con este CMS.
Un Saludo.

<p>Gracias a tí por tus comentarios Awe :)</p>

Muchas gracias por compartir estos contenidos que nos son tan útiles.
Salut!

Muy buenos los videotutoriales, me vienen muy bien a mi, que estoy empezando con Drupal, esperando impaciente por los siguientes videotutoriales.

Gracias por el post. Me salvaste el pellejo con este plugin. Ahora sí voy a darle ese toque profesional a mi página.

Hola... cree un view slideshow para la página de inicio, pero mi problema es que si uso campos para mostrar sólo el campo imagen me deja por defecto un link que me lleva al contenido donde se encuentra la imagen. De que forma puedo desactivar este link. Espero me puedas ayudar.
Nota: Esto no pasa al mostrar contenido en lugar de campo, pero el problema acá es que también me muestra el titulo y no lo necesito.
PD.: Muy bueno tus tutoriales espero sigas publicando muchos más.

Hola Pedro: Aunque no tiene nada que ver con lo que has publicado te agradecería me digas si hay alguna forma de duplicar los tipos de contenido, no el contenido en si mismo. Estoy terminando una web y necesito crear tipos de contenido que son prácticamente idénticos. Existe algo así? yo no lo encuentro por ningún lado.

¡Muchas grac as a todos por vuestros comentarios! Estad atentos porque seguiré publicando tutoriales sobre el tema.

@Katherine espero que mi artículo sobre tratamiento de imágenes en Drupal 7 y Views 3 te ayude a solventar la duda

@Francisco pues no tiene mucho que ver no, pero puedes optar por bundle copy o bundle inherit, aunque diría que ambos son bastante experimentales.

hola.
tengo un problema con las views y quizás me puedas ayudar.
tengo una view en español y otra en ingles, cuando hago click en el conmutador del idioma paso de estar en un idioma para estar en el otro, pero la cuestión es que siempre tengo, en el menú principal, las dos views y lo que quiero es que se vea una o la otra, pero no las dos a la vez.
gracias
carlos

Mil gracias!! están excelentes tus explicaciones, estoy iniciando en este mundo de drupal, y me ha servido para practicar y aprender. Gracias por tu apertura y ofrecer ayuda aquellos que estamos iniciando, saludos desde COSTA RICA. "Pura vida!"

Hola, gracias por el tutorial pero tengo algunas consultas que no sé si podrás resolverme. Hace tiempo que utilizo drupal y me encontré con un problema en views que no sé solventar. Tengo una vista en formato tabla con su paginador en ajax y todo ello dentro de un quicktabs. Todo funciona ok. El tema es que al pinchar en cualquier elemento de la tabla, me redirije a su nodo. La vista nodo siempre es la misma y me gustaría que se pudieran ver los campos también en formato tabla. Hay alguna forma de solucionar esto de forma sencilla o es tan tedioso como parece? Gracias y felicitaciones por los tutos, yo hago tutos de audio en youtube y sé lo que cuesta prepararse un tutorial.

Quiero agradecerte la información que compartes con el resto del mundo. No te imaginas el valor que tiene para mi acceder a esta información. Muchas gracias y te animo a seguir así!

Excelente, tu video, soy aprendiz, administro una web y no tienes idea como me ha ayudado. gracias una ves más

hola necesito que me ayuden..estoy diseniando una pagina hice un menu con el modulo Nice Menu esta todo bien.el problema es el siguiente...
en cada botoncito de mi menu quiero insertar un boton ya diseniado en photoshop, es decir quiero inserta una imagen pero no se como hacerlo, busque y busque y no encuentro la solucion ayudenme porfavor :(

Estimado Pedro: mil gracias por tus tutoriales. Este de views está muy bueno. Ya estuve ensayando un poco con ello, antes de leer tus escritos, pero es un tema muy largo y complicado. Estoy ensayando con Drupal 7.34 y con un theme que se llama corporate clean, pero estoy desorientado para armar el Home, pues quiero hacer debajo de los slides una galeria de fotos, pero que tengan títulos cada foto y se pueda hacer click en cada una y me lleve al contenido respectivo. Ademas de armar una vista para la pagina-home (si es que se puede y no estoy equivocado), con que módulo podría cargar imágenes con titulo y enlace a contenido?...sirve colorbox para ello?, o hay otro módulo más apropiado que me permita cargar la imagen, agregarle un titulo bajo la foto, e ingresarle una url ?. Desde ya, muchísimas gracias por tu respuesta. Un cordial saludo desde Córdoba-Argentina.

Muy buena explicación. Gracias.

Muchísimas gracias de nuevo por estos tutoriales, llevo tiempo mirando y aprendiendo views y si bien no terminan de suplir las carencias que tengo sobre la gestión de views, si que arrojan más luz sobre el asunto y me refuerzan conocimientos ya adquiridos. Son los mejores tutoriales al respecto que he encontrado en toda la red, claros y dinámicos. Muy agradecido la verdad XD Continúo leyendo tu blog-web

Una pregunta a ver si me puedes ayudar. Teniendo un formulario de consulta creado como un modulo independiente es posible que este envíe una consulta a una view para que se vean lo datos buscados? Y por otro lado teniendo una view se puede acceder a resultados completos desde los apartados de esta?
Gracias

Muchas gracias por el aporte. Me has ayudado mucho con este tema, ya que drupal es aveces un poco complicado. Pero todo es ponerse.

Gracias, fue muy instructivo. Excelente!

Como harian para mostrar dos campo multi valor (como un campo imagen donde se puedan almacén muchas imágenes y otro donde puedan ingresar muchos iframe´s) y mostrarlo todo como una sola lista? para poderlo presentar con flexslider por ejemplo

Al elegir en el Menu de administracion, "Estructura - Views"
alli aparece dentro de los recuadros de vistas "OPERACIONES", alli sale "EDIT" y dentro de las opciones aparece "CLONE", con ella puedes clonar esa vista, cambiar su nombre y asdf.

Hola amigo, me podrías decir como tengo que agregar imagenes a los canales Feed para luego poder mostrarlos en una vista?

Añadir nuevo comentario