Better Exposed Filters
Reemplaza los cuadros de selección predeterminados de Views con widgets más avanzados como botones de radio, casillas de verificación, enlaces de alternancia, controles deslizantes y selectores de fecha para filtros expuestos, ordenamientos y paginadores.
better_exposed_filters
Install
composer require 'drupal/better_exposed_filters:^7.1'
Overview
Better Exposed Filters (BEF) mejora los elementos de formulario expuestos de Views en Drupal proporcionando widgets de visualización alternativos que ofrecen una mejor experiencia de usuario y funcionalidad. Cuando expones un filtro en Views, permites a los usuarios interactuar con la vista y personalizar sus resultados de búsqueda. BEF te da mayor control sobre cómo se renderizan estos elementos expuestos.
El módulo reemplaza los cuadros desplegables estándar de selección única o múltiple con opciones más amigables para el usuario, incluyendo casillas de verificación, botones de radio, enlaces clicables, controles deslizantes jQuery UI para rangos numéricos y selectores de fecha para campos de fecha. Soporta visualización jerárquica para términos de taxonomía, funcionalidad de auto-envío, grupos de filtros colapsables y opciones secundarias para escenarios de búsqueda avanzada.
BEF funciona con todos los tipos de filtros estándar de Views incluyendo filtros de taxonomía, booleanos, fecha, numéricos y de texto. También se integra con filtros de Search API y proporciona extensibilidad a través de su sistema de plugins para desarrollo de widgets personalizados.
Features
- Reemplazar desplegables de filtros expuestos con casillas de verificación para filtros de selección múltiple o botones de radio para filtros de selección única
- Mostrar filtros expuestos como enlaces clicables que alternan valores de filtro con soporte AJAX
- Usar controles deslizantes basados en jQuery UI para filtros de rango numérico con configuraciones ajustables de mínimo, máximo, paso y animación
- Proporcionar widgets de selector de fecha para filtros de fecha con manejo automático de formato de fecha
- Auto-envío de formularios expuestos cuando los valores de filtro cambian, con retraso configurable y requisitos de caracteres mínimos para campos de texto
- Ocultar botones de envío cuando el auto-envío está habilitado para una interfaz de usuario más limpia
- Añadir enlaces 'Seleccionar Todo/Ninguno' para filtros de casillas de verificación con soporte para selecciones anidadas jerárquicas
- Mostrar opciones de casillas de verificación y botones de radio en línea para diseños compactos
- Implementar funcionalidad de 'límite suave' para mostrar/ocultar opciones de filtro excedentes vía JavaScript con etiquetas personalizables de mostrar más/menos
- Envolver filtros en elementos de detalles colapsables para mejor organización
- Agrupar filtros en área de opciones secundarias para funcionalidad de búsqueda avanzada
- Reescribir etiquetas de opciones de filtro usando una interfaz simple de reemplazo de texto
- Ordenar opciones de filtro alfabéticamente con manejo adecuado de términos de taxonomía jerárquicos
- Combinar campo de ordenamiento y dirección de ordenamiento en un solo desplegable para interfaz de usuario simplificada
- Añadir opción 'Restablecer ordenamiento' para volver al orden de clasificación predeterminado
- Soportar elementos de paginador expuestos (elementos por página) con opciones de visualización de botones de radio y enlaces
- Proporcionar sugerencias de hook de tema para sobrescrituras de plantilla granulares basadas en vista, display y nombre de campo
- Soporte de Token para descripciones de filtro cuando el módulo Token está habilitado
- Soporte para instalación local de librería nouislider o respaldo CDN
Use Cases
Filtrado de Catálogo de Productos
Crear un listado de productos de comercio electrónico con filtros de casillas de verificación para categorías, un control deslizante de rango de precios y auto-envío para resultados instantáneos. Habilitar 'Seleccionar Todo/Ninguno' para filtros de categoría y usar límites suaves para mostrar solo las primeras 10 categorías con un enlace 'Mostrar más'.
Formulario de Búsqueda Avanzada
Construir una página de búsqueda con filtros primarios visibles (palabras clave, tipo de contenido) y filtros secundarios en una sección colapsable 'Opciones Avanzadas' (autor, rango de fechas, etiquetas). Usar la característica de opciones secundarias para organizar conjuntos de filtros complejos sin abrumar a los usuarios.
Filtrado de Calendario de Eventos
Crear un listado de eventos con filtros de selector de fecha para fechas de inicio/fin, filtros de botones de radio para tipos de evento y filtros de ubicación basados en enlaces con AJAX para navegación fluida sin recargas de página.
Navegación de Taxonomía Jerárquica
Mostrar un filtro de término de taxonomía como casillas de verificación anidadas que reflejan la jerarquía del vocabulario. Habilitar 'selección anidada todo/ninguno' para que al marcar un término padre se seleccionen automáticamente todos los términos hijos.
Controles de Ordenamiento Simplificados
Combinar campo de ordenamiento y orden de clasificación en un solo desplegable mostrando opciones como 'Fecha (más reciente primero)', 'Fecha (más antiguo primero)', 'Título (A-Z)'. Reescribir las etiquetas predeterminadas a texto amigable para el usuario y añadir una opción 'Restablecer a predeterminado'.
Filtros Optimizados para Móvil
Usar grupos de filtros colapsables para minimizar el espacio vertical en dispositivos móviles. Habilitar auto-envío con botón de envío oculto para una interfaz táctil optimizada donde tocar una opción de filtro actualiza inmediatamente los resultados.
Tips
- Usar las sugerencias de hook de tema para crear sobrescrituras de plantilla específicas por vista o campo: bef_checkboxes__VIEW_ID__DISPLAY_ID__FIELD_NAME
- Para widgets de control deslizante, calcular valores apropiados de min/max/paso basados en el rango real de datos para proporcionar controles de filtro significativos
- Combinar auto-envío con la opción 'Ocultar botón de envío' para la interfaz de usuario más limpia cuando JavaScript está disponible
- Usar la opción 'Reescribir basado en clave' cuando necesites reescrituras de etiquetas consistentes independientemente de la traducción o cambios de etiqueta
- Cuando uses límites suaves, asegurarse de que el CSS maneje correctamente la animación de mostrar/ocultar para una experiencia de usuario fluida
- El reemplazo de Token en descripciones de filtro funciona bien para texto de ayuda dinámico como mostrar la fecha actual o información del usuario
Technical Details
Admin Pages 1
/admin/structure/views/view/{view_id}/edit
Configurar ajustes de Better Exposed Filters para una vista seleccionando 'Better Exposed Filters' como el estilo de formulario expuesto. Acceder a la configuración de BEF a través de la opción 'Exposed form style' bajo la sección Advanced del editor de vistas.
Hooks 3
hook_better_exposed_filters_options_alter
Modifica las opciones de BEF antes de que se construyan los widgets del formulario expuesto. Permite modificación programática de configuraciones de filtro como valores min/max de controles deslizantes.
hook_better_exposed_filters_display_options_alter
Modifica la lista de opciones de widget disponibles para un filtro específico. Permite añadir o eliminar opciones de widget para filtros individuales.
hook_theme_better_exposed_filters_options_alter
Hook alter a nivel de tema para opciones de BEF (misma firma que el hook alter de módulo)
Troubleshooting 6
Asegurarse de que la librería nouislider esté correctamente cargada. Instalarla localmente en libraries/nouislider o verificar que el acceso CDN no esté bloqueado. Limpiar todos los cachés después de instalar la librería.
Verificar que el auto-envío esté habilitado y que 'Excluir campo de texto' no esté marcado. Verificar la configuración de longitud mínima - el auto-envío no se activará hasta que se alcance el conteo mínimo de caracteres.
Para filtros de taxonomía con jerarquía, no incluir guiones iniciales en el campo 'texto actual'. La reescritura coincide con el texto real de la opción, no con el texto mostrado con indicadores de jerarquía.
Esta opción requiere que 'Permitir selecciones múltiples' esté habilitado en la configuración del filtro. Editar el filtro y marcar la casilla 'Permitir selecciones múltiples'.
Asegurarse de que 'Permitir a las personas elegir el orden de clasificación' esté habilitado en la configuración del formulario expuesto. La característica de combinación requiere que tanto el campo de ordenamiento como el orden de clasificación estén expuestos.
Habilitar AJAX en la configuración Advanced de la vista. El módulo añade automáticamente soporte AJAX para widgets de enlaces cuando la vista tiene AJAX habilitado.