Menús laterales de grupos de Discourse

:information_source: Resumen Crea menús laterales personalizados con acceso restringido a grupos seleccionados
:eyeglasses: Vista previa Únete a este grupo de creadores de temas y luego previsualiza aquí
:hammer_and_wrench: Repositorio \u003chttps://github.com/Lillinator/discourse-group-sidebar-menus\u003e
:question: Guía de instalación Cómo instalar un tema o componente de tema
:open_book: ¿Nuevo en los temas de Discourse? Guía para principiantes sobre el uso de temas de Discourse

Instalar este componente de tema

:woman_technologist:t2: Descripción general

Este componente de tema de Discourse brinda a los administradores del foro la capacidad de crear menús laterales personalizados que solo son accesibles para los miembros de grupos seleccionados.

Características principales:

  • Control de acceso basado en grupos - Las secciones del menú solo se renderizan para los usuarios autorizados
  • Configuración de la interfaz de administración - Todas las configuraciones para crear secciones de menú de grupo se encuentran en la interfaz de administración del componente de tema
  • Múltiples secciones - Crea secciones de menú ilimitadas para diferentes grupos (dentro de lo razonable)
  • Seguridad del lado del cliente - Los usuarios no autorizados no pueden ver las secciones del menú en el DOM, el inspector web o el modo seguro
  • Sin contaminación global - No requiere la creación de secciones de barra lateral globales
  • Enlace de edición rápida para administradores - El icono de lápiz en los encabezados del menú vincula directamente a los administradores a la configuración del componente

:briefcase: Casos de uso

  • Recursos y enlaces rápidos solo para el personal
  • Accesos directos para moderadores de categorías
  • Portales de grupos personalizados (equipos de proyecto, grupos de estudio, clubes de lectura, miembros VIP)
  • Enlaces a recursos de sitios web principales o asociados

:gear: Configuración

Secciones de menú (menu_sections)

Abre el editor de configuración de objetos para configurar secciones de menú de grupo personalizadas.

Propiedades de la sección

Propiedad Descripción
Título del menú Título que se muestra como encabezado de la sección lateral
Grupos permitidos Grupos autorizados para ver esta sección del menú (máx.: 20 grupos por sección)
Enlaces del menú Colección de enlaces para mostrar en esta sección (máx.: 20 enlaces por sección)

Propiedades del enlace

Propiedad Descripción
Icono Nombre del icono de FontAwesome (ej.: circle-info, star, user-group). Puede que necesite añadirse a Admin \u003e Todos los ajustes del sitio \u003e subconjunto de iconos svg
Texto Etiqueta de visualización para el enlace
URL Destino del enlace: admite rutas relativas (/faq, /my/preferences) y URL absolutas (https://example.com)

:wrench: Instalación y configuración

  1. Instala el componente de tema según Installing a theme or theme component.
  2. Ve al Editor de configuración de objetos
  3. Haz clic en el botón + new_menu_section para configurar la primera sección de menú personalizada
  4. Dale un título al nuevo menú en el campo Título del menú y luego selecciona los grupos que tendrán acceso a él.
  5. Haz clic en + new_menu_section para añadir otra sección, o guarda los cambios.
Capturas de pantalla de la configuración de administración con configuración de ejemplo

Instalación nueva: ve al Editor de configuración de objetos.

\u003e #### Escenario de ejemplo con 2 menús personalizados y 3 usuarios, uno de los cuales es administrador:
\u003e * @Catra ama a los gatos y es miembro del grupo pink, que tendrá acceso al Menú de gatos :grinning_cat:
\u003e * @HelloKitty prefiere los perros y es miembro del grupo purple, que tendrá acceso al Menú de perros :dog_face:
\u003e * @Lilly es miembro de purple porque tiene un perro y los perros son mejores. Sin embargo, también es administradora del foro, y los administradores tendrán acceso al Menú de gatos porque los gatos necesitan más supervisión :dog_face: :cat_with_wry_smile:

Crea un nuevo menú personalizado: para nuestro ejemplo, crea Menú de gatos y añade los grupos autorizados a tener acceso a él: pink y admins. Luego haz clic en el botón + menu_link para configurar los enlaces del nuevo menú.

Añade los enlaces del menú: 1. Nombre del icono de Fontawesome, 2. texto a mostrar para el enlace, y 3. la URL, relativa o absoluta. Haz clic en el botón + menu_link para añadir otro enlace a este menú.

Crea otra sección de menú personalizada llamada Menú de perros, dale acceso solo al grupo purple y configura los enlaces:

Capturas de pantalla del acceso al menú lateral resultante

¡El usuario @Catra tiene el menú de gatos! :grinning_cat:

¡El usuario @HelloKitty tiene el menú de perros! :dog_face:

La usuaria administradora @Lilly tiene ambos menús ¡y puede editarlos! :smiling_cat_with_heart_eyes:

Ejemplo de configuración

Título del menú: "Recursos del personal"
Grupos permitidos: staff
Enlaces:
  - Icono: wrench
    Texto: Guía de moderación
    URL: /t/moderation-guide/123
  - Icono: chart-line
    Texto: Panel de análisis
    URL: /admin/dashboard

:light_bulb: Notas importantes

Acceso de administrador

  • Los administradores deben añadirse a los grupos para ver los menús configurados para esos grupos. ¡El estado de administrador por sí solo no otorga acceso a todos los menús personalizados. Esto es intencional!
  • Los administradores que pertenecen a los grupos permitidos de un menú verán un icono de lápiz en el encabezado de la sección que enlaza con la configuración del componente.

Configuración de grupo

  • El grupo everyone no es compatible - Utiliza la interfaz nativa del pie de página lateral para crear menús personalizados globales para todos los usuarios, incluidos los visitantes anónimos.
  • Máximo de 20 grupos por sección de menú. Si necesitas más, crea secciones duplicadas con diferentes asignaciones de grupo.
  • Los usuarios en varios grupos verán todas las secciones de menú a las que tienen acceso.

Pruebas y organización

  • Usa cuentas de prueba para verificar el acceso correcto para diferentes combinaciones de grupos.
  • Lleva un registro de tus configuraciones de menú para evitar confusiones a medida que crece la complejidad; se recomienda una matriz de acceso o documentación similar para foros más grandes con muchos grupos.

Consideraciones de seguridad

Este componente proporciona control de acceso a nivel de interfaz de usuario. Controla el acceso al menú, no el acceso a los recursos; no es un reemplazo de los permisos de seguridad de categorías.

Qué protege este componente:

  • :white_check_mark: Las secciones del menú no pueden ser accedidas por grupos de usuarios no autorizados
  • :white_check_mark: Enlaces no descubribles a través del inspector/consola/modo seguro
  • :white_check_mark: Experiencia de usuario limpia sin desorden en el menú

Prácticas recomendadas para administradores:

  • Configura los permisos de seguridad de cualquier categoría enlazada y la membresía de grupo relevante por separado antes de configurar este componente: planifica tu configuración.
  • Los administradores son responsables de garantizar que los enlaces a recursos externos estén debidamente autorizados para los grupos seleccionados.

Otras notas :pen:

  • Este componente es compatible con Discourse Sidebar Menu Reorder, que se utilizó para colocar las dos secciones de menú de ejemplo en la parte superior de la barra lateral en las capturas de pantalla. Simplemente usa el título de la sección de menú personalizada en formato de slug, por ejemplo: cat-menu.
7 Me gusta

Parece que estoy obteniendo un 404 en el repositorio.

EDIT: ¡Todo bien ahora!

1 me gusta

jaja inténtalo de nuevo. ¡olvidé hacerlo público! :laughing:

4 Me gusta