Formatação da seção de comentários do Discourse no Wordpress (tema Divi)

Olá @newspring, dei uma olhada e você tem dois problemas aí.

Estilo

Primeiramente, como sugeri acima, o tema Divi está usando seus próprios elementos de comentário personalizados e fornecendo estilos apenas para esses elementos. Isso significa que os elementos de comentário padrão usados pelo Discourse não têm nenhum estilo. Também significa que o Divi não pode estilizar os comentários, pois está procurando por seus próprios elementos de comentário personalizados.

Essencialmente, isso significa que você só pode usar blocos de comentário do Divi com um tema Divi “direto da caixa”. Se você usar um bloco de comentário do Discourse ou qualquer outro bloco de comentário que não seja do Divi, precisará estilizar manualmente. Você pode ver o que quero dizer se aplicar um tema padrão do WordPress, como o Twenty Nineteen. Os comentários do Discourse serão estilizados pelo CSS fornecido por esse tema e aparecerão normalmente.

Mas não se preocupe! O CSS é relativamente simples. Aqui está uma maneira fácil de fazê-lo parecer mais normal. Você pode adicionar este CSS ao Divi ou a qualquer outro tema que o carregue:

CSS
.comment-meta,
.comment-metadata,
.comment-author,
.comment-content,
.comment-author img {
  display: flex;
  align-items: center;
  margin-right: 10px;
  font-size: 1rem !important;
}

.comment::marker {
  content: '';
}

.comment-body {
  margin-bottom: 10px;
}

.et_pb_comments_0 {
  background-color: white; 
}

O resultado final ficará assim:

Acho que o motivo pelo qual “Continue a discussão em…” e “Participantes” aparecem em azul e amarelo é porque você conseguiu adicionar estilos diretamente a eles via Divi. Se quiser alterar essas cores, remova esse estilo personalizado no Divi.

Conflito entre comentários do Discourse e do WordPress

Você também ainda tem os comentários do WordPress ativados, é por isso que está vendo outro campo de composição de comentários no final da postagem. Se quiser usar os comentários do Discourse, provavelmente deverá desativá-los. Confira minha explicação mais detalhada sobre isso aqui:

4 curtidas