Collapsible Drag 'n Drop
Agrega funcionalidad de colapsar y expandir a las tablas arrastrables de Drupal, facilitando la gestión de grandes estructuras jerárquicas como menús.
collapsible_dnd
Instalar
composer require 'drupal/collapsible_dnd:^3.0'
composer require 'drupal/collapsible_dnd:8.x-2.1'
Overview
Collapsible Drag 'n Drop mejora la funcionalidad integrada de tablas arrastrables de Drupal añadiendo la capacidad de colapsar y expandir subárboles jerárquicos. Esto resuelve un problema significativo de usabilidad al gestionar grandes estructuras de menú o cualquier contenido organizado en tablas arrastrables con anidación profunda.
Al trabajar con el sistema de menús de Drupal, arrastrar elementos para reordenarlos o cambiar su jerarquía se vuelve cada vez más difícil a medida que el menú crece. Si un elemento padre tiene muchos hijos, el subárbol puede exceder fácilmente la altura de la pantalla, haciendo que las operaciones de arrastre sean engorrosas o casi imposibles. Este módulo añade botones de colapsar/expandir a cada fila que tiene hijos, permitiendo a los administradores ocultar temporalmente los subárboles durante las operaciones de arrastre.
El módulo funciona automáticamente con cualquier tabla arrastrable en la interfaz de administración de Drupal, no solo con menús. Se adjunta como dependencia a la biblioteca tabledrag del Core de Drupal, por lo que no se necesita configuración adicional: simplemente instale el módulo y la funcionalidad estará disponible inmediatamente donde se utilicen tablas arrastrables.
Features
- Añade botones de alternar colapsar/expandir a las filas con hijos en tablas arrastrables
- Oculta automáticamente los elementos hijos cuando se colapsa una fila padre, facilitando las operaciones de arrastre
- Inicia con todas las jerarquías colapsadas por defecto para una vista inicial más limpia
- Recalcula dinámicamente las relaciones padre-hijo después de completar las operaciones de arrastre
- Funciona con cualquier tabla arrastrable en Drupal, incluyendo gestión de menús, ordenación de términos de taxonomía e implementaciones personalizadas
- Estilos adaptados al Theme con ajustes específicos para los temas de administración Seven y Claro
- Utiliza MutationObserver para detectar cuándo se arrastran y sueltan elementos, actualizando los estados de colapso en consecuencia
- Oculta suavemente los elementos con animación de desvanecimiento cuando se sueltan en un padre colapsado
Use Cases
Gestión de menús de navegación grandes
Cuando su sitio tiene una estructura de menú compleja con muchos elementos anidados (por ejemplo, un mega menú con múltiples niveles), arrastrar elementos del menú para reordenarlos se vuelve extremadamente difícil porque el menú expandido puede ser más largo que su pantalla. Con este módulo, puede colapsar los elementos del menú padre para ocultar temporalmente sus hijos, facilitando arrastrar el padre a una nueva posición o reordenar elementos del mismo nivel.
Organización de términos de taxonomía con jerarquías profundas
Los sitios que usan vocabularios de taxonomía con muchos niveles de términos anidados enfrentan desafíos similares al reordenar términos. Este módulo le permite colapsar secciones de la jerarquía, haciendo manejable trabajar con la interfaz de arrastrar y soltar incluso con cientos de términos.
Trabajo con ordenación de campos de referencia a Entity
Algunas configuraciones de Drupal utilizan tablas arrastrables para ordenar entidades referenciadas. Cuando estas referencias tienen relaciones jerárquicas, este módulo hace que la interfaz de ordenación sea más usable al permitir colapsar subárboles.
Implementaciones personalizadas de tablas arrastrables
Si tiene módulos personalizados que implementan tablas arrastrables usando la biblioteca tabledrag de Drupal, este módulo las mejora automáticamente con funcionalidad de colapsar/expandir sin ningún cambio de código adicional.
Tips
- Todos los elementos comienzan colapsados por defecto para una vista inicial más limpia: haga clic en los iconos de flecha para expandir las secciones según sea necesario
- Después de arrastrar elementos, el módulo recalcula automáticamente qué elementos tienen hijos y actualiza los botones de colapsar en consecuencia
- Si está trabajando con una jerarquía muy grande, colapse los elementos con los que no está trabajando para mantener la interfaz manejable
- El módulo utiliza transiciones CSS para retroalimentación visual suave al colapsar y expandir elementos
Technical Details
Hooks 3
hook_library_info_alter
Se utiliza para adjuntar la biblioteca collapsible_dnd como dependencia de la biblioteca drupal.tabledrag del Core de Drupal, asegurando que la funcionalidad de colapsar/expandir esté disponible automáticamente donde se utilicen tablas arrastrables.
hook_preprocess_html
Añade una clase CSS al elemento body indicando el Theme de administración activo (por ejemplo, 'theme-claro', 'theme-seven'), permitiendo estilos específicos del Theme para los botones de colapsar/expandir.
hook_help
Implementa la página de ayuda del módulo, mostrando el contenido de README.md como texto plano o renderizado a través del módulo Markdown si está disponible.
Troubleshooting 3
Asegúrese de que el módulo esté habilitado y limpie el Cache de Drupal. El módulo adjunta su biblioteca al tabledrag del Core, por lo que puede ser necesario limpiar el Cache para que la dependencia surta efecto.
El módulo incluye estilos específicos para los temas Seven y Claro. Para temas de administración personalizados, puede necesitar añadir sobrescrituras CSS. El módulo añade una clase como 'theme-[nombredeltheme]' al elemento body que puede usar para orientar estilos.
Este es el comportamiento esperado: cuando suelta un elemento en un padre colapsado, se ocultará junto con los otros hijos colapsados. Expanda el padre para ver el elemento en su nueva posición.