Menus da barra lateral de grupos do Discourse

:information_source: Resumo Crie menus de barra lateral personalizados para grupos selecionados
:eyeglasses: Pré-visualização Junte-se a este grupo de Criador de Temas e depois visualize aqui
:hammer_and_wrench: Repositório https://github.com/Lillinator/discourse-group-sidebar-menus
:question: Guia de Instalação Como instalar um tema ou componente de tema
:open_book: Novo em Temas do Discourse? Guia para iniciantes sobre o uso de Temas do Discourse

Instale este componente de tema

:woman_technologist:t2: Visão Geral

Este componente de tema do Discourse oferece aos administradores do fórum a capacidade de criar menus de barra lateral personalizados acessíveis apenas aos membros de grupos selecionados.

Principais Recursos:

  • Visibilidade de menu baseada em grupo — Seções de menu são renderizadas na barra lateral apenas para usuários autorizados
  • Configuração baseada em objetos — Interface de configurações fácil de usar para criar menus
  • Múltiplas seções — Crie seções de menu ilimitadas para diferentes grupos (dentro do razoável)
  • Link de edição rápida para administradores — O ícone de lápis nos cabeçalhos do menu leva os administradores diretamente às configurações do componente

:briefcase: Alguns Casos de Uso

  • Recursos e links rápidos exclusivos para a equipe
  • Atalhos para moderadores de categorias
  • Portais personalizados para grupos (equipes de projeto, grupos de estudo, clubes de leitura, membros VIP)
  • Links para recursos de sites de parceiros ou da organização principal

:gear: Configurações

Seções de Menu (menu_sections)

Abre o editor de configurações de objetos para configurar seções de menu de grupo personalizadas.

Propriedades da Seção

Propriedade Descrição
Título do menu Título exibido como cabeçalho da seção na barra lateral
Grupos permitidos Grupos autorizados a visualizar esta seção de menu (máx: 20 grupos por seção)
Links do menu Coleção de links para exibir nesta seção (máx: 20 links por seção)

Propriedades do Link

Propriedade Descrição
Ícone Nome do ícone do FontAwesome (por exemplo, circle-info, star, user-group). Pode ser necessário adicioná-lo em Admin > Todas as configurações do site > subconjunto de ícones svg
Texto Rótulo de exibição para o link
URL Destino do link — suporta tanto caminhos relativos (/faq, /my/preferences) quanto URLs absolutos (https://example.com)

:wrench: Instalação e Configuração

  1. Instale o componente de tema conforme descrito em Installing a theme or theme component.
  2. Acesse o Editor de configurações de objetos
  3. Clique no botão + new_menu_section para configurar a primeira seção de menu personalizada
  4. Dê um título ao novo menu no campo Menu title e, em seguida, selecione os grupos que devem ter acesso a ele.
  5. Clique em + new_menu_section para adicionar outra seção ou salve as alterações.
Capturas de tela da configuração administrativa com exemplo

Instalação nova — acesse o Editor de configurações de objetos.

Cenário de exemplo com 2 menus personalizados e 3 usuários, sendo um administrador:

  • @Catra adora gatos e é membro do grupo pink, que terá acesso ao Cat Menu :grinning_cat:
  • @HelloKitty gosta de cachorros e é membro do grupo purple, que terá acesso ao Dog Menu :dog_face:
  • @Lilly é membro do grupo purple porque tem um cachorro e cachorros são melhores. No entanto, ela também é administradora do fórum, e os administradores terão acesso ao Cat Menu porque os gatos precisam de mais supervisão :dog_face: :cat_with_wry_smile:

Crie um novo menu personalizado — para nosso exemplo, crie Cat menu e adicione os grupos autorizados a acessá-lo — pink e admins. Em seguida, clique no botão + menu_link para configurar os links do novo menu.

Adicione os links do menu — 1. Nome do ícone do FontAwesome, 2. texto a ser exibido para o link e 3. o URL, relativo ou absoluto. Clique no botão + menu_link para adicionar outro link a este menu.

Crie outra seção de menu personalizada chamada Dog menu, concedendo acesso apenas ao grupo purple e configure os links:

Capturas de tela do acesso resultante ao menu da barra lateral

O usuário @Catra tem o Cat menu! :grinning_cat:

O usuário @HelloKitty tem o Dog menu! :dog_face:

O usuário administrador @Lilly tem ambos os menus e pode editá-los! :smiling_cat_with_heart_eyes:

Exemplo de Configuração

Menu Title: "Cat Stuff"
Allowed Groups: team-cat
Links:
  - Icon: link
    Text: Cat videos & photos
    URL: /t/cat-videos-and-photos/123
  - Icon: magnifying-glass
    Text: Cat wiki
    URL: https://en.wikipedia.org/wiki/Cat

:light_bulb: Notas Importantes

Acesso de Administrador

Os administradores devem se adicionar aos grupos para ver os menus configurados para esses grupos. O status de administrador por si só não concede acesso a todos os menus personalizados. Isso é intencional! Além disso, administradores que pertencem aos grupos permitidos de um menu verão um ícone de lápis no cabeçalho da seção, que leva às configurações do componente.

Configuração de Grupos

  • O grupo everyone não é suportado — Use a interface nativa do rodapé da barra lateral para criar menus personalizados globais para todos os usuários, incluindo visitantes anônimos.
  • Máximo de 20 grupos por seção de menu. Se precisar de mais, crie seções duplicadas com atribuições de grupo diferentes.
  • Usuários em múltiplos grupos verão todas as seções de menu às quais têm acesso.

Testes & Organização

Use contas de teste para verificar o acesso correto para diferentes combinações de grupos. Mantenha um registro das configurações dos seus menus para evitar confusão à medida que a complexidade aumenta; uma matriz de acesso ou documentação similar é recomendada para fóruns maiores com muitos grupos.

Considerações de Segurança

Este componente fornece controle de acesso apenas no nível da interface do usuário. Ele controla a visibilidade do menu, não o acesso aos recursos — este componente controla apenas o que é renderizado na barra lateral, não quem pode acessar os recursos reais.

Sempre confie no sistema de permissões integrado do Discourse para proteger os recursos reais:

  • Configure corretamente as permissões de categoria
  • Defina restrições de visibilidade de tópicos
  • Use controles de acesso baseados em grupos para conteúdo
  • Garanta que recursos privados requeiram autenticação

Melhor prática para administradores:
Configure as permissões de segurança da categoria vinculada e a associação de grupos separadamente — por exemplo: um link do menu para uma categoria privada deve ter as permissões dessa categoria configuradas corretamente. Os administradores são responsáveis por garantir que links para recursos externos estejam adequadamente autorizados para os grupos selecionados.


Este foi um projeto colaborativo com @Moin — sua contribuição, inspiração e feedback foram inestimáveis.


Confira meu outro material do Discourse
12 curtidas

Parece que estou recebendo um 404 no repositório.

EDIT: Tudo certo agora!

2 curtidas

haha tente novamente. esqueci de deixar público! :laughing:

6 curtidas

Fabuloso! Eu estava querendo isso há algum tempo. Eu construí uma boa coleção de menus laterais personalizados úteis para mim – links para moderação, para tarefas de administradores e referência, para documentação do Discourse, para conteúdo externo que frequentemente referenciamos no fórum, etc. Um menu tem links para as várias reuniões periódicas que simplesmente usa o link tag, por exemplo, /tag/comm-mgt-monthly que me ajuda a pular rapidamente para as agendas e atas atuais e anteriores.

Muitas vezes desejei uma maneira de exportar minhas configurações de menu lateral personalizado para que outros membros da minha equipe pudessem importar – esta é uma configuração muito superior!

E ícones! Viva! Pelo que sei, a única maneira de fazer isso era adicionar CSS personalizado. Esta nova solução é elegante.

E sustentável! Todos os administradores poderão editar os arquivos de configuração, então não dependerão apenas de mim. Obrigado @Lilly e @Moin!

1 curtida

Olá @Lilly e @Moin,

Obrigado por construir este componente.

Eu estava usando Group sidebar menu sections - deprecated no meu site auto-hospedado e na minha atualização mais recente fui avisado de que o componente de tema antigo havia sido descontinuado e para instalar este, em vez disso.

Instalei o componente e criei meu menu de grupo personalizado, mas simplesmente não estou vendo como mover o menu do grupo. (Eu devo estar olhando bem para algo óbvio. :see_no_evil_monkey:) Nas suas capturas de tela, seu Cat Menu e Dog Menu estão na navegação da barra lateral acima da seção Topics, mas meu menu de grupo personalizado está aparecendo na parte inferior da minha navegação da barra lateral. Como eu o movo para cima, acima de Topics?

1 curtida

Não está óbvio. A Lilly usou Discourse Sidebar Menu Reorder para colocar cat-menu no topo

3 curtidas

Muito obrigado! Foi muito fácil de configurar.

3 curtidas