DiscPage: um plugin para criar páginas estáticas e inserir balões de discussão no texto

:warning: Descontinuado

Este plugin não é mais mantido e não funciona com as versões atuais do Discourse.
Recomendamos removê-lo de sites em produção para evitar problemas de atualização.
Agradecemos a todos que usaram e contribuíram para este plugin ao longo dos anos. :folded_hands:

Com o DiscPage, você cria páginas estáticas adicionando a categoria “Página” a qualquer tópico.

Você pode então inserir ícones de balão, permitindo que os usuários discutam subseções da página.

Veja a antiga demonstração a nova demonstração e o repositório.

41 curtidas

The discussion topics show up oddly in /latest - perhaps they should go in their own category, “Page Comments” or similar?

The use of structured tags is pretty neat :slight_smile:

5 curtidas

Sure, you can use the discpage balloon category setting to set a category for the “balloon” discussions.

6 curtidas

Incrível!!! Minha ONG certamente vai precisar disso!

6 curtidas

Existe alguma maneira de mostrar as categorias/subcategorias à esquerda?

Existe alguma maneira de exibir as categorias/subcategorias à esquerda?

Não há uma maneira automática de exibir as categorias nas páginas estáticas do DiscPage. No entanto, você pode adicionar links para as categorias manualmente. Em seguida, pode estilizar esses links para colocá-los em uma barra lateral à esquerda (usando um componente de tema).

P.S.: você provavelmente já sabe disso, mas lembre-se de que é possível acessar as categorias pelo menu hambúrguer.

2 curtidas

Obrigado @syl pelo ótimo plugin :slight_smile:

Você pode, por favor, explicar também como este plugin é diferente do seguinte?

1 curtida

O plugin que você mencionou parece ótimo. Ainda não o testei, mas diria que as diferenças são:

  • A autoria de páginas é diferente: o ProCourse oferece um backend rico em recursos, enquanto o DiscPage apenas transforma um tópico (então você fica limitado à edição padrão em Markdown).
  • O ProCourse não suporta balões de discussão dentro das páginas.
4 curtidas

Acabei de descobrir este plugin hoje e estou impressionado! Muito obrigado pelo seu trabalho, @syl.

Só para confirmar: essa funcionalidade pode ser “contida” em uma categoria, sem assumir todo o fórum, certo? A ideia (potencial) que temos em mente para nosso projeto é escrever um guia colaborativo usando uma categoria, mantendo o restante do fórum (um Discourse padrão) como está.

Sim, você está correto.

Sim, parece algo que o DiscPage pode fazer.

1 curtida

Obrigado, @syl!

Última pergunta (por enquanto): :slight_smile: Como o plugin define as permissões? Quem pode criar / modificar / excluir essas páginas estáticas?

1 curtida

Uma página estática do DiscPage não é nada mais do que um tópico em uma categoria pré-definida específica. Vamos chamá-la de “Página”. Consequentemente:

  • Páginas estáticas podem ser criadas por qualquer pessoa que possa criar tópicos na categoria Página. Você precisa configurar as permissões da categoria Página de acordo com suas necessidades. O caso usual é restringir a permissão “Criar” para administradores, como explicado aqui, para que apenas administradores possam criar páginas estáticas.

  • Páginas estáticas podem ser modificadas/excluídas pelo autor do tópico e por usuários da equipe (como qualquer tópico normal).

1 curtida

Por que seu plugin modifica o ícone de hambúrguer? Ele o deixou vermelho e agora tenho que descobrir como reescrever o CSS de volta ao normal. Gosto do seu plugin, mas por favor, corrija isso?

Olá @Erik_Manger, seu problema está descrito aqui:

Meu menu hambúrguer ficou vermelho, o que devo fazer?

Menu Hambúrguer
Um menu hambúrguer vermelho significa que o DiscPage está desativado. Isso ocorre:

  1. quando um erro impede que o DiscPage inicie (nesse caso, verifique o console de depuração para um erro relacionado ao DiscPage), e
  2. quando você desativa o DiscPage manualmente (veja abaixo).

@syl Estou tendo muita dificuldade com essas etapas. Desculpe, sei que isso é um problema super de iniciante. MAS você poderia fornecer um modelo simples para copiar e colar? Ou um vídeo curto explicando o passo a passo? Ou, se você me orientar pessoalmente, farei um vídeo no YouTube para outras pessoas que são SUPER iniciantes.

  • Para editar uma página estática, clique no botão de “lápis” no canto superior direito da página (você também pode desativar o DiscPage pelo menu hambúrguer e, em seguida, editar o tópico como faria normalmente).
  • Para estilizar páginas estáticas, use a classe .dpg-page-content. Para estilizar uma página individual, use o atributo de dados html[data-dpg-page-id]. Por exemplo, vá em Configurações > Personalizar > Tema Claro > Editar CSS/HTML e insira o seguinte na seção Comum > CSS:
1 curtida

Uma página estática pode importar um arquivo JS ou fazer link para um?

1 curtida

Uma página estática é renderizada como um tópico padrão do Discourse, então as regras para scripts JS em tópicos se aplicam. Acredito que haja várias discussões sobre isso aqui no meta: isso implica criar um componente de tema e personalizá-lo (também existe uma configuração do Discourse para permitir a vinculação de scripts externos).

Você também pode querer verificar a seção “Para personalizar uma página estática” nesta página e ver este exemplo de JS em uma página estática (caixas de combinação no topo).

1 curtida

Você já criou uma página estática? Consegue ver o botão de lápis?

Estilizar uma página estática é semelhante a estilizar uma página de tópico padrão do Discourse: você cria um componente de tema e o personaliza. Há um exemplo aqui. Você também pode pesquisar por “Componentes de Tema” aqui no meta. A classe .dpg-page-content permite criar regras CSS que se aplicam apenas às páginas estáticas, em vez de todas as páginas de tópicos.

Sobre esse assunto, digamos que eu tenha uma API que recupera uma imagem com base na entrada do usuário. No link que você enviou, há algumas caixas de combinação no topo. Se o usuário selecionar algo na caixa de combinação, o JavaScript exibirá algo com base nessa entrada do usuário. Isso é possível dentro de uma página estática?

1 curtida

Acho que sua ferramenta está funcionando 100% corretamente. O problema é minha falta de conhecimento sobre como usá-la :frowning: Vou dar uma olhada naquele link que você forneceu com .dpg-page-content

Página: https://community.tigergraph.com/t/this-is-a-test-page/606

Clique no botão Editar. Insira um trecho de código. Clique em Configurações. Vá em Personalizar. Insira o trecho de código e você verá uma página web HTML básica aparecer. Isso ajudaria um super iniciante como eu, haha!

Agradeço por ter tirado um tempo para responder à minha pergunta :slight_smile:

Vou mantê-lo informado sobre meu progresso. Espero conseguir fazer o meu ficar parecido com o seu!

1 curtida