vocabulario

Vistas y Taxonomías | Creación de un catálogo con vistas (Parte 2)

Video de Youtube
URL de Video remoto

Si no ves el video, puedes refrescar el navegador, presionando (Ctrl+Shift+R | Ctrl+F5 o Shift+F5), o abrirlo directamente desde el Canal de Youtube... HAZ CLIC AQUI

      Ahora que ya tenemos la base de conocimiento suficiente, para crear y configurar, nuestra vista Catálogo usando Taxonomías, hoy abordaremos otros aspectos relacionados con el funcionamiento y personalización, no a nivel gráfico, sino a nivel de la interfaz de administración del usuario, para que puedas obtener el listado de categorías y de productos relacionados con ellas.

     Si quieres aprender sobre diseño Frontend en Drupal, tienes varios videos relacionados, donde te explico la creación de Themes personalizados para Drupal, utilizando Bootstrap 3, Bootstrap 4, o el diseño de Patrones con Emulsify; también el uso de javascript y otros módulos adicionales que te permitirán dar el aspecto que buscas en tus proyectos. 

     Para saber más sobre diseño Frontend en Drupal haz clic en el siguiente enlace: Básicos de Frontend para Drupal

     Cómo configurar las URL para las taxonomías

          Por defecto, Drupal trae en su configuración inicial un módulo llamado Path, cuyo objetivo es encargarse de las rutas con las que podrás acceder y navegar a través de tus proyectos. Pero en la mayoría de los casos, es necesario un módulo adicional, que nos permitirá personalizar las urls amigables, para que podamos cumplir con los requisitos del SEO. 

          Este módulo se llama Pathauto y lo tienes explicado en detalle en este artículo Módulos impresindibles: Pathauto; con él una vez activado, podremos configurar los patrones para las urls, que se generarán automáticamente, cada vez que vayamos creando nuevas Taxonomías, o cualquier otro tipo de contenido dentro de nuestro proyecto Drupal.

          Con el módulo Pathauto, podremos configurar nombre automáticos para las taxonomías, añadiendo simplemente el siguiente Token en el campo Patrón de Ruta: 

/[term:vocabulary]/[term:name]

     Una vez añadido estos tokens, en nuestro caso, que nuestra primera taxonomía o vocabulario se llama "Categoría", obtendremos urls del tipo (localhost/categoria/aceites).

Drupal Views | www.drupaladicto.com - Consultor especializado en drupal y symfony

     ¿Cómo hago si ya he creado las taxonomías antes del patrón?

          Por si no lo recuerdas, si haz creado las taxonomías o cualquier otro tipo de contenido, antes de configurar los patrones para las urls, sólo tienes que dirigirte a la dircción "/admin/config/search/path/update_bulk", dentro de tu proyecto y seleccionar las opciones para regeneración en masa.

Drupal Views | www.drupaladicto.com - Consultor especializado en drupal y symfony

     Personalización de la Taxonomía

          Al igual que el resto de tipos de contenido en Drupal, las taxonomías nos ofrecen la oportunidad de gestionar su presentación. Esto significa, que podremos añadir nuevos campos con imágenes, textos o cualquier otro elemento, añadiendo mayor atractivo y/o funcionalidades de cara al usuario.

         Podremos utilizar la opción de presentación que nos viene por defecto, o también podremos añadir, nuestra propio modo de presentación, desde la misma pestaña, una vez dentro de la taxonomía.

Drupal Views | www.drupaladicto.com - Consultor especializado en drupal y symfony

     Módulos complementarios muy útiles

          Paragraphs:

             Aunque no lo aplicaremos en este ejercicio, podríamos combinar el modo de vista de la Taxonomía, con el módulo Paragraphs, para generar páginas con un aspecto parecido al de la siguiente imagen, con elementos fácilmente configurables desde un mismo lugar, como en este caso, un carrusel, varios textos,y a continuación el listado de productos o servicios.

             Si todavía no conoces el Módulo Paragraphs haz clic en el enlace: Creación de contenidos con Paragraphs

Drupal Views | www.drupaladicto.com - Consultor especializado en drupal y symfony

          Fieldgroup:

              Otro de los módulos que puede ayudarte, en la configurar una interfaz de usuario mucho más atractiva y fácil de manejar, es el módulo FieldGroup, que te permitirá agrupar en Secciones o Pestañas, mostrando a los editores del sitio, sólo la información que necesitan para realizar sus tareas de mantenimiento, sin agobiarlos con información que no les hace falta.

         Si todavía no conoces el Módulo Field Group, haz clic en el enlace: Field Group

Drupal Views | www.drupaladicto.com - Consultor especializado en drupal y symfony

     Creación del listado de Productos/servicios

            Ya que hemos terminado con la configuración de nuestra taxonomía, llamada "Categoría", y que ahora conocemos diferentes formas, módulos y opciones para cambiar su configuración, gestión y aspecto, sólo nos queda añadir, el listado de productos o servicios, que se mostrará cada vez que entremos en una de estas "Categorías".

             Para crear este listado de productos o servicios, tendremos que generar una nueva vista, del tipo bloque, a la que pasaremos como parámetro el id de la Taxonomía correspodiente y marcaremos la opción de "Exigir relación", para que sólo se muestren los correspodientes en cada caso.

             Una vez configurada la vista con el listado de productos, lo último que tendríamo que hacer es configurar en el listado de bloques, para limitar nuestra nueva vista a las páginas con las taxonomías.

Drupal Views | www.drupaladicto.com - Consultor especializado en drupal y symfony

Vistas y Taxonomías | Creación de un catálogo con vistas (Parte 1)

Video de Youtube
URL de Video remoto

Si no ves el video, puedes refrescar el navegador, presionando (Ctrl+Shift+R | Ctrl+F5 o Shift+F5), o abrirlo directamente desde el Canal de Youtube... HAZ CLIC AQUI

       En este artículo te voy a enseñar cómo crear un bloque del tipo catálogo, que podrás colocar en tu página principal o cualquier otra página, usando vistas y taxonomías.

     Prerrequisitos:

        Conocer cómo se crean contenidos y tipos de contenido en Drupal, te recomiendo ver los videos y documentacíon relacionados con Trabajando con contenidos y tipos

        Conocer el uso de las vistas, te recomiendo que dediques un tiempo a ver los videos y documentacíon relacionados con Trabajo con vistas en Drupal 9

        Conocer el uso de las taxonomías en Drupal,  te recomiendo que dediques un tiempo a ver los videos y documentacíon relacionados con Taxonomías, filtros y vistas en Drupal 9

     Cómo crear un catálogo usando Vistas y Taxonomías en Drupal 9

           Paso 1 - Crear el tipo de contenido

                Para este ejercicio, deberás haber creado al menos un tipo de contenido, al que en este ejemplo le llamaremos Producto, pero que en tu caso puede ser Noticia, Libro, Publicación, etc. ya que se trata de generar un listado de todos estos contenidos clasificándolos a través de sus categorías correspondientes, para ello, utilizaremos un vocabulario, al que llamaré Categoría, que deberá formar parte de los campos dentro de tu tipo de contenido.

Drupal Views | www.drupaladicto.com - Consultor especializado en drupal y symfony

Drupal Views | www.drupaladicto.com - Consultor especializado en drupal y symfony

               Si todavía no conoces cómo trabajar con contenidos y tipos de contenido, dedica un tiempo a mirar el video donde te lo explico y podrás entender más fácilmente el resto del ejercicio. Haz clic en el siguiente enlace para ver la documentación y video explicativo: Trabajando con contenidos y tipos

            Paso 2 - Generar contenidos categorizados

              Además, para que tenga sentido, generaremos varios contenidos, añadiéndoles diferentes Categorías, para comprobar que todo funciona según lo esperado. Si estás trabajando con un proyecto nuevo, puedes generar estos contenidos de prueba usando el Módulo Devel Generate, puedes ver cómo hacerlo en el siguiente enlace Cómo generar contenidos de Prueba con el módulo Devel

 

Vistas Drupal | www.drupaladicto.com - Consultor especializado en drupal y symfony

Vistas Drupal | www.drupaladicto.com - Consultor especializado en drupal y symfony

Vistas Drupal | www.drupaladicto.com - Consultor especializado en drupal y symfony

             Para categorizar los contenidos utilizaremos las Taxonomías o Vocabularios, cuya función en Drupal es exactamente esa, "clasificar". Así que añadiremos un nuevo vocabulario llamado "Categoría" y, a continuación, agregaremos el campo con el mismo nombre en nuestro tipo de contenido, seleccionando la opción de "Crear entidades referenciadas si no existieran previamente".

Vistas Drupal | www.drupaladicto.com - Consultor especializado en drupal y symfony

Vistas Drupal | www.drupaladicto.com - Consultor especializado en drupal y symfony

Vistas Drupal | www.drupaladicto.com - Consultor especializado en drupal y symfony

Vistas Drupal | www.drupaladicto.com - Consultor especializado en drupal y symfony

             Si todavía no conoces las taxonomías y cómo trabajar con ellas, dedica un tiempo a mirar el video donde te lo explico y podrás entender más fácilmente el resto del ejercicio. Haz clic en el siguiente enlace para ver la documentación y video explicativo:  Taxonomías, Filtros en vistas, Menús y CSS   

            Una vez creado el vocabulario y añadido como parte del tipo de contenido, podremos comenzar a clasificar nuestros contenidos, ya sea añadiendo previamente diferentes categorías desde la misma taxonomía o generando nuevos contenidos y añadiéndolas directamente, como parte de dicho proceso.

 

Vistas Drupal | www.drupaladicto.com - Consultor especializado en drupal y symfony

Vistas Drupal | www.drupaladicto.com - Consultor especializado en drupal y symfony

             Paso 3 - Crear la vista de Categorías

                  Existen varias maneras de crear catálogos utilizando Taxonomías, podemos crear una Vista tipo Página o podemos crear una Vista tipo Bloque, para incluirla dentro de una Página que hayamos creado paralelamente.

             Opción 1 - Creación de Página Categorías usando taxonomías

                   En este caso, vamos a crear una Vista del tipo Página, que configuraremos como nuestra página de inicio, mostrando el listado de la Taxonomía o vocabulario llamado "Categoría", el objetivo es conseguir el listado de las categorías para luego hacer que apunten a sus respectivos productos, al hacer clic sobre cualquiera de ellas.

                  Accederemos a la url "/admin/structure/views" y crearemos nuestra vista tipo página con el nombre "Catálogo", donde mostraremos las taxonomías del tipo Categoría, luego configuraremos el resto de datos correspondientes, como el tipo de la vista "Página" y la url de acceso; finalmente activaremos el paginador en caso de que tuviéramos muchas categorías. Podremos modificar estos parámetros o ajustarlos una vez creada la vista, en la pantalla de configuración.

Vistas Drupal | www.drupaladicto.com - Consultor especializado en drupal y symfony

            Ajustes de configuración de la vista

                 Al hacer clic en el botón "Guardar y continuar", de la parte inferior de la página, accederemos a la parte de la configuración interna, donde podremos realizar aquellos ajustes que nos hagan falta y, a su vez, comprobar que lo que se nos muestra es lo que esperábamos.

Vistas Drupal | www.drupaladicto.com - Consultor especializado en drupal y symfony

            Configuración del catálogo como página principal

                 Ya que hemos comprobado, que efectivamente se muestra el listado de las categorías en nuestra "Vista Catálogo", lo siguiente que deberíamos hacer es configurar nuestro sitio, para que la utilice como página principal.

                 Para ello nos dirigiremos al apartado de Configuraciones básicas del sitio , ubicado en "/admin/config/system/site-information", y colocaremos la url de nuestrra vista en el lugar correspodiente, tal y como te muestro en la siguiente imagen. Una vez realizado el cambio, podremos volver a nuestra página principal y comprobaremos que ha sido realizado el cambio.

Vistas Drupal | www.drupaladicto.com - Consultor especializado en drupal y symfony

Vistas Drupal | www.drupaladicto.com - Consultor especializado en drupal y symfony

              Añadir imágenes a las taxonomías

              Aunque hemos conseguido el resultado esperado, ya que tenemos configurada nuestra página "Catálogo" como página principal de nuestro sitio, y que se muestran las categorías que habíamos añadido previamente, todavía está muy lejos de lo que esperaríamos encontrar en una web de productos. Así que, a continuación añadiremos un campo del tipo imagen a nuestra taxonomía y de esta manera, podremos mostrar un aspecto más llamativo e impactante a nivel visual para nuestros usuarios.

              Para realizar este cambio, volveremos a la url de configuración de los campos en la Taxonomía accediendo a :

 "/admin/structure/taxonomy/manage/categoria/overview/fields"

y a continuación añadiremos un campo del tipo imagen, como lo haríamos en cualquier otro contenido de Drupal. Crearemos nuestro propio campo personalizado de imágenes para esta taxonomía y rellenaremos los campos correspodientes, una vez realizado el proceso, guardaremos los cambios y ya podremos añadir las imágenes de cada una de nuestras categorías.

Vistas Drupal | www.drupaladicto.com - Consultor especializado en drupal y symfony

                Ahora que ya hemos añadido el nuevo campo del tipo imagen, podremos acceder a cada una de nuestras Taxonomías y agregarle las imágenes que las harán más fáciles de identificar y atractivas a ojos de nuestros usuarios, llamándolos a la acción de clicar en ellas.

Vistas Drupal | www.drupaladicto.com - Consultor especializado en drupal y symfony

              Una vez añadidas todas las imágenes, tendremos que hacer lo mismos en la vista "Catálogo", para que podamos tenerlas en la página de inicio. En ese caso, accederemos a la configuración de la vista, añadiremos el nuevo campo "Imagen Categoría" y ajustaremos el formato de presentación de la imagen para que no se vea muy grande.

Vistas Drupal | www.drupaladicto.com - Consultor especializado en drupal y symfony

Vistas Drupal | www.drupaladicto.com - Consultor especializado en drupal y symfony

             Si volvemos a nuestra página de inicio, el resultado debería ser algo parecido a la siguiente imágen, que ya nos da una mejor idea del objetivo final, que será conseguir un catálogo atractivo y funcional, para presentar nuestros contenidos o productos.

Vistas Drupal | www.drupaladicto.com - Consultor especializado en drupal y symfony

Views | Vistas con taxonomías y Cotenidos relacionados

Video de Youtube
URL de Video remoto

Si no ves el video, puedes refrescar el navegador, presionando (Ctrl+Shift+R | Ctrl+F5 o Shift+F5), o abrirlo directamente desde el Canal de Youtube... HAZ CLIC AQUI

     Ahora que ya conocemos el potencial que nos ofrece el módulo "Vistas" o "Views", integrado en el núcleo de Drupal a partir de la versión 8, y que además hemos aprendido a Cómo trabajar con vistas en Drupal 9 y nos aventuramos creando nuestra primera Vista mostrando contenidos relacionados pasándole parámetros, para la que utilizamos un campo referenciado, que nos permitió, crear esa relación entre varios contenidos manualmente; llegados a este punto, nos encontramos con la incógnita siguiente: ¿Cómo podríamos crear una vista de contenidos relacionados, basándonos específicamente, en los términos o taxonomías que comparten?.

     Las taxonomías o términos de Drupal, se crearon específicamente para categorizar o clasificar nuestros contenidos, facilitándonos de esta forma, la configuración de relaciones entre ellos y por consiguiente, simplificando el uso de "Vistas" dinámicas, donde podríamos mostrar contenidos que compartan uno o varios términos.

     Por esta razón, hoy vamos a explicar cómo crear vistas de contenidos relacionados, que comparten términos o taxonomías, pasando como parámetros, el id del contenido principal, con el cual haremos la relación y posteriormente, el id del término o términos que comparte con otros contenidos, permitiéndonos de esta forma, la construcción de una vista, tipo bloque, que mostrará todos los contenidos relacionados cada vez que accedamos a la página el contenido principal.

Requisitos:

     Como relacionar contenidos usando taxonomías en una vista Drupal 9

     Paso 1 Creación de contenidos y taxonomías:

          Para que puedas realizar este ejercicio, lo primero que deberías crear son las taxonomías o términos, con los que relacionarás tus contenidos, y luego añadir el campo correspondiente, del tipo Taxonomía, dentro de tus tipos de contenido, para que puedas configurarlos al momento de crearlos o posteriormente.

     Paso 2 Creación de la vista contenidos relacionados:

          Como ya tienes todos los contenidos con los que vamos a trabajar, es el momento de crear una vista, del tipo bloque, a la que llamaremos "Artículos relacionados", porque en nuestro ejemplo, hemos decidido utilizar los artículos que trae por defecto Drupal.

          La idea en este ejercicio, es que al entrar en cualquier artículo, veremos una columna a su izquierda, donde se mostrarán todos los artículos que compartan el mismo término o taxonomía. 

Drupal Views | www.drupaladicto.com - Consultor especializado en drupal y symfony

     Una vez creada la vista, del tipo bloque, lo siguiente que haremos es añadir, en los filtros contextuales, un primer filtro en el que vamos a utilizar el ID del contenido, para eliminarlo del listado de resultados una vez que entremos en él.

Drupal Views | www.drupaladicto.com - Consultor especializado en drupal y symfony

     Una vez hayamos añadido la opción del valor predeterminado, sin salir de la misma pantalla, nos desplazamos haca la parte inferior, y haremos clic en el más que aparece justo debajo de "TÍTULO ADMINISTRATIVO" y marcaremos la opción excluir.

Drupal Views | www.drupaladicto.com - Consultor especializado en drupal y symfony

Drupal Views | www.drupaladicto.com - Consultor especializado en drupal y symfony

     Ya podemos hacer clic en el botón aplicar y podremos añadir el siguiente Filtro Contextual, esta vez, será el id de la taxonomía que nos permitirá crear el listado de contenidos que comparten el o los mismos términos o taxonomías.

Drupal Views | www.drupaladicto.com - Consultor especializado en drupal y symfony

     Al igual que en el ejemplo anterior, nos moveremos hacia la parte inferior de la pantalla, pero esta vez marcaremos la opción "Permitir múltiples valores", ya que nos interesa filtrar por uno o varios términos o taxonomías.

Drupal Views | www.drupaladicto.com - Consultor especializado en drupal y symfony

Drupal Views | www.drupaladicto.com - Consultor especializado en drupal y symfony

     Después podremos hacer clic en el botón guardar de la vista y ya podremos continuar con el siguiente paso, que consiste en la activación del bloque para que se muestre dentro de los artículos.

     Paso 3 Activación del bloque:

          El último paso consiste en activar nuestra "Vista tipo bloque", para ello nos moveremos a la url "/admin/structure/block", y en la pantalla de configuración seleccionaremos la zona o área donde mostraremos nuestro bloque, en mi caso he optado por el "Sidebar First", para mostrarlo en la columna izquierda del artículo.

Drupal Views | www.drupaladicto.com - Consultor especializado en drupal y symfony

     Ya podemos entrar a cualquiera de nuestros artículos, y si hemos añadido correctamente las taxonomías en varios artículos, veremos en la parte izquierda nuestra vista con los artículos relacionados.

Drupal Views | www.drupaladicto.com - Consultor especializado en drupal y symfony