Organizador de categorías de la barra lateral

[Drew-ART (Drew)]

He creado un organizador de barra lateral. Hubo muchas discusiones al respecto hace un tiempo y otros sintieron que no era necesario, pero yo siempre sentí que mis usuarios no son muy técnicos o no saben cómo funciona el foro lo suficientemente bien al principio, así que he creado este organizador desplegable para ayudar.

Hay un pequeño interruptor en la parte superior para que los usuarios puedan cambiar y elegir el que prefieran.

Organizador de Categorías de la Barra Lateral

Un componente de tema de Discourse que organiza las categorías de la barra lateral en secciones personalizables, con código de colores y contraíbles, con funciones avanzadas.

Características

• 10 Secciones Contraíbles: Agrupa categorías en hasta 10 secciones personalizadas
• Personalización de Color: Establece colores de fondo y de texto para el encabezado de cada sección
• Fondos Degradados: Efecto de desvanecimiento degradado opcional como en las fotos
• Insignias de Categoría: Las insignias de color predeterminadas de Discourse junto a las categorías se pueden activar y desactivar
• Soporte para Subcategorías: Alternancia por sección para mostrar/ocultar subcategorías (visualización con sangría)
• Ocultar Categorías: Oculta categorías específicas de todas las vistas
• Interruptor Bidireccional: Cambia entre las secciones personalizadas y la vista predeterminada de Discourse (el botón de alternancia aparece en ambas vistas)
• Estado Persistente: Recuerda qué secciones están abiertas/cerradas y la preferencia de vista del usuario
• Conciencia de Permisos: Solo muestra las categorías a las que los usuarios tienen acceso
• Categorías Sin Agrupar: Muestra automáticamente cualquier categoría sin categorizar en una sección separada
• Diseño Responsivo Móvil: Funciona en todos los tamaños de dispositivo

Instalación

1. Ve a Administrador → Personalizar → Temas en tu instancia de Discourse
2. Haz clic en Instalar → Desde un repositorio de Git
3. Introduce: https://github.com/focallocal/sidebar-categories-organizer
4. Haz clic en Instalar
5. Añade el componente a tu tema activo

Configuración

Ajustes Globales

• Habilitar Organizador de Barra Lateral: Activa/desactiva la vista personalizada
• Mostrar Botón de Alternancia: Muestra el icono para cambiar entre vistas (aparece en los encabezados de las vistas personalizada y predeterminada)
• Mostrar Insignias de Categoría: Muestra cuadrados de colores junto a los nombres de las categorías
• Usar Desvanecimiento Degradado: Habilita el efecto de fondo degradado en los encabezados de sección (50% color sólido, 50% desvanecimiento a transparente)
• Categorías a Ocultar: Coma separadas por comas las “slugs” de las categorías a ocultar de todas las vistas (ej: staff,private)
• Vista Predeterminada: Elige qué vista se carga por defecto (personalizada o predeterminada)

Ajustes de Sección (1-10)

Cada sección tiene:

• Habilitado: Activa/desactiva la sección
• Título: Texto del encabezado de la sección
• Color de Fondo: Selector de color para el fondo del encabezado de la sección
• Color de Texto: Selector de color para el texto del encabezado
• Categorías: Coma separadas por comas las “slugs” de las categorías (ej: general,support,feedback)
• Mostrar Subcategorías: Alternar para mostrar/ocultar subcategorías para esta sección
• Predeterminado Abierto: Si la sección comienza expandida o contraída

Encontrar “Slugs” de Categorías

Las “slugs” de las categorías están en la URL:

• tudominio.com/c/general/5 → la “slug” es general
• tudominio.com/c/feature-requests/12 → la “slug” es feature-requests

Uso

Una vez instalado y configurado:

1. Vista Personalizada: Las categorías se agrupan en tus secciones configuradas con encabezados de colores
2. Expandir/Contraer: Haz clic en los encabezados de las secciones para alternar la visibilidad del contenido
3. Alternar Vistas: Haz clic en el icono del encabezado para cambiar entre las vistas personalizada y predeterminada
   • En la vista personalizada: El botón de alternancia aparece en el encabezado de la vista personalizada
   • En la vista predeterminada: El botón de alternancia aparece en el encabezado de “Categorías” predeterminado
4. Subcategorías: Cuando se habilita por sección, las subcategorías aparecen con sangría debajo de las categorías principales
5. Insignias de Categoría: Pequeños cuadrados de colores (si están habilitados) muestran el color de cada categoría
6. Categorías Sin Agrupar: Cualquier categoría no asignada a secciones aparece en “Otras Categorías”
7. Preferencias: Tu elección de vista y el estado abierto/cerrado se guardan por navegador

Características Avanzadas

Fondos Degradados

Cuando se habilita, los encabezados de las secciones utilizan un degradado suave:

• 50% color sólido (tu color de fondo elegido)
• 50% desvanecimiento a transparente
• Crea una apariencia moderna y elegante

Ocultar Categorías

Especifica las “slugs” de las categorías para ocultarlas completamente de la barra lateral:

• Útil para categorías solo para personal o categorías obsoletas
• Se aplica tanto a las vistas personalizadas como a las predeterminadas
• Lista separada por comas (ej: staff,private,archived)

Subcategorías

• Alternancia por sección (no global)
• Visualización con sangría con fuente ligeramente más pequeña
• Opacidad reducida para jerarquía visual
• Mantiene los colores de las insignias de categoría

Versión

• Actual: 1.0.1
• Discourse Mínimo: 3.3.0
• Autor: Andy@Focallocal

Licencia

Licencia MIT - Consulta el archivo LICENSE

Soporte

Reporta problemas: GitHub · Where software is built

[Lilly (Lillian Louis)]

¡Buen trabajo!

Consejo de configuración de categoría

En lugar de hacer que los administradores introduzcan slugs de categoría, puedes usar esto en tu archivo settings.yml, por ejemplo:

categories_to_hide:
  type: list
  list_type: category
  default: ""
  description:
    en: "Categories to hide from sidebar completely."

lo que te dará una configuración como esta:

También puedes hacer lo mismo con los grupos si alguna vez quieres un menú desplegable de grupos:

groups_this_setting_applies_to:
  type: list
  list_type: group
  default: ""
  description:
    en: "Groups this setting will apply to."

lo que dará algo como esto: