Customizações e Configuração

Você pode notar que o widget de comentários pode ser usado com um Tenant ID de "demo", por exemplo:

Demo Tenant ID

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo"

7}];

8</script>

9

Isto serve apenas para experimentar e brincar com o widget de comentários. Em produção, você passaria seu Tenant ID, assim:

Defining Your Tenant ID

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "aKa2Z4Q="

7}];

8</script>

9

Seu Tenant ID já pode ser encontrado aplicado no widget de comentários snippet de código na sua conta.

Você também pode encontrar seu Tenant ID e gerenciar suas chaves de API na página de credenciais da API.

A partir deste ponto, se você estiver logado no FastComments, os exemplos de código usarão seu Tenant ID real (se você estiver logado em https://fastcomments.com).

Ao renderizar um thread de comentários, ou ao deixar um comentário, o FastComments precisa saber a que página, artigo ou produto esses comentários pertencem.

Para isso, usamos algo que chamamos de "URL ID". É um identificador, como uma string ou um número, ou uma URL.

Por padrão, se você não especificar o urlId, ele será a URL da página. Nós pegaremos a URL da página atual e a limparemos para remover quaisquer parâmetros de marketing comuns ou identificadores de rastreamento.

No caso de integrações de terceiros, como WordPress, nosso plugin geralmente usará o identificador que representa a informação atual sendo visualizada como o URL ID, por exemplo o id do artigo/página.

Definindo um URL ID Personalizado

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "urlId": "https://example.com/page"

8}];

9</script>

10

Uma coisa que frequentemente referenciamos neste documento é a Interface de Personalização de Widget.

Esta interface pode ser usada para fazer muitas alterações no widget de comentários sem usar código.

Ao criar uma regra de personalização, geralmente queremos que ela se aplique a todas as páginas do nosso site. No entanto, em alguns casos queremos personalizar o widget de comentários em uma página específica, seja para aplicar estilos personalizados ou talvez tornar os comentários daquela página anônimos. Você também poderia, por exemplo, fazer com que comentários ao vivo apareçam imediatamente em algumas páginas, enquanto os oculta sob botões de notificação em outras.

Tudo isso é possível através do campo de entrada URL ID nesta página, que se parece com o seguinte:

Entrada URL ID na Página de Personalização do Widget

O valor neste campo deve corresponder ao parâmetro urlId passado para o widget de comentários. Se você quiser que sua regra de personalização seja agnóstica ao urlId, deixe este campo vazio ou insira *.

A partir de 2023, o campo URL ID na personalização do widget também aceita padrões! Por exemplo, você pode ter */blog/* para adicionar estilos específicos ao seu blog e */store/* para ter estilos específicos à sua loja, tudo usando o mesmo domínio.

Armadilhas

1. Se sua página tem parâmetros de hash (como example.com#page-1) - isso se tornará parte do URL ID, por padrão.
2. Durante migrações, por exemplo de WordPress para Gatsby, você pode precisar migrar os valores de comentários do URL ID após a migração inicial. Para isso, entre em contato conosco.

FastComments foi projetado para ser customizado. O widget de comentários roda dentro de um iframe por razões de segurança, então, para aplicar estilos personalizados, você deve seguir uma das duas abordagens.

A primeira, a abordagem mais fácil e a que preferimos, é usar a página de personalização do widget.

Na página de personalização do widget, veja a seção “Mostrar Opções Avançadas”, sob a qual há uma área rotulada como “Custom CSS”:

Área de Entrada de CSS Personalizado

Esta abordagem tem alguns benefícios:

1. O CSS inserido é minificado antes de ser enviado ao usuário, e a formatação é mantida consistente na UI de edição.
2. Você obtém todos os benefícios da UI de personalização do widget, por exemplo, personalizando facilmente o widget de comentários de forma diferente para diferentes sites.
3. Quando fazemos alterações no widget de comentários, seu estilo personalizado será testado como parte do nosso processo de lançamento.

A segunda abordagem é especificar o parâmetro customCSS na configuração do widget, da seguinte forma:

Passing Custom CSS

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "customCSS": "button { background: red; }"

8}];

9</script>

10

Entretanto, isso tem limitações:

1. Existe um limite de quanto CSS personalizado pode ser passado antes que nossos servidores rejeitem a requisição, devido ao tamanho dos cabeçalhos.
2. Você deve gerenciar o CSS personalizado em sua infraestrutura e sistema de build. Isso pode ser uma vantagem em vez de uma desvantagem, também.
3. Há um custo adicional de enviar o CSS personalizado pela rede duas vezes neste caso de uso, pois ele precisa ser enviado aos nossos servidores e depois devolvido no conteúdo do iframe. Contudo, para a maioria dos tamanhos de payload, isso não é perceptível.
4. Uma otimização comum é minificar o CSS para reduzir seu tamanho na rede; porém, com esta abordagem, você terá que lidar com isso.
5. Seu CSS personalizado não será testado quando fizermos alterações.

Arquivos CSS Externos

Você pode instruir o widget a buscar um arquivo externo usando @import!

É recomendado colocar o @import em uma regra de personalização. Dessa forma, se precisarmos fazer uma mudança no widget de comentários, podemos usar nossa automação para verificar sua configuração. Por exemplo, você criaria uma regra de personalização na UI de Personalização do Widget, clicaria em Avançado e inseriria em Custom CSS:

@import url(https://example.com/styles.css);

No Código - Não Recomendado

Você também pode carregar um arquivo CSS externo via a propriedade customCSS:

External CSS File

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "customCSS": "@import url(https://example.com/styles.css);"

8}];

9</script>

10

Entretanto, lembre‑se de que seu CSS não poderá ser testado por nós se você fizer isso.

Estilização do Modal de Perfil de Usuário

Modais de perfil de usuário também podem ser estilizados com CSS personalizado. Contudo, para garantir que o estilo personalizado seja aplicado aos perfis de usuário, todos os seletores CSS devem ser prefixados com .user-profile. Sem esse prefixo, o estilo personalizado será ignorado nos modais de perfil de usuário.

Por exemplo:

User Profile CSS

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "customCSS": ".user-profile .profile-name { color: blue; }"

8}];

9</script>

10

Compatibilidade Retroativa

Na FastComments, sabemos que nossos clientes personalizam o widget de comentários. Isso faz parte do design – a última coisa que queremos é que nosso produto cause inconsistências de design em seu produto.

Como isso é uma parte importante do nosso produto, temos um pipeline de build que nos permite revisar mudanças no widget de comentários, por cliente, a cada lançamento.

Se encontrarmos pequenos problemas, atualizaremos sua conta para garantir que nosso lançamento ocorra sem contratempos. Se identificarmos mudanças significativas que quebrem a compatibilidade, isso nos permite interromper o lançamento.

Para clientes com contas Pro ou Enterprise, a personalização de marca (white-label) é permitida. Basta entrar em contato conosco e ficaremos felizes em ajudar.

Se você apenas quiser remover nosso logo do widget de comentários, isso é habilitado automaticamente nos planos Flex e Pro.

Esses planos também oferecem a mesma funcionalidade para e-mails enviados pela nossa plataforma.

Para sites que permitem alternar o modo escuro após o carregamento inicial da página, isso é um pouco mais complexo.

Primeiro, todas as versões atuais da biblioteca do widget de Comentários (React, Vue) têm exemplos de alternância do modo escuro em seus respectivos repositórios.

Para o widget VanillaJS, precisaremos fazer um trabalho extra. Primeiro, o FastCommentsUI retorna um objeto com as funções "destroy" e "update".

Podemos simplesmente chamar a função update toda vez que quisermos atualizar a configuração do widget de comentários, como a seguir. Aqui está um exemplo completo funcionando de alternância do modo escuro com o widget VanillaJS.

Exemplo Completo de Alternância do Modo Escuro

Copy Run

1

2<script src="https://fastcomments.com/js/embed-v2.min.js"></script>

3<button id="toggle-dark-mode">Toggle Dark Mode</button>

4<div id="fastcomments-widget"></div>

5<script>

6 (function() {

7 const button = document.getElementById('toggle-dark-mode');

8 const config = {

9 tenantId: 'demo',

10 hasDarkBackground: false

11 };

12 const instance = window.FastCommentsUI(document.getElementById('fastcomments-widget'), config);

13 button.addEventListener('click', function() {

14 config.hasDarkBackground = !config.hasDarkBackground;

15 if (config.hasDarkBackground) {

16 document.body.classList.add('dark');

17 } else {

18 document.body.classList.remove('dark');

19 }

20 instance.update(config);

21 });

22 })();

23</script>

24<style>

25 body.dark {

26 background: #000;

27 color: #fff;

28 }

29</style>

30

Com o FastComments, todo o texto no widget de comentários é personalizável.

Você pode substituir um único trecho de texto, como o botão de enviar, ou todo o texto em todo o widget de comentários.

Por padrão, o texto no widget de comentários é traduzido com base no locale do usuário. No entanto, podemos substituir o texto, se estivermos confiantes de que nossa base de usuários está usando o mesmo local/idioma, por exemplo:

Texto Personalizado

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "translations": {

8 "SUBMIT_REPLY": "Reply"

9 }

10}];

11</script>

12

Todas as traduções personalizáveis podem ser encontradas aqui na aba "opções avançadas".

No entanto, há uma maneira mais fácil, via a interface de personalização do widget. Lá, podemos simplesmente encontrar o texto que aparece no widget de comentários no locale EN_US e especificar uma substituição.

Texto Personalizado

Todas as substituições de traduções atualmente afetam todos os locales.

Isso cobre o próprio texto do widget. Para traduzir os comentários que seus visitantes escrevem, veja Tradução de Comentários.

Quando um usuário comenta com FastComments pela primeira vez, tentaremos buscar seu avatar em https://gravatar.com/.

No entanto, se não encontrarmos um avatar, ou se o usuário nunca definir um em sua conta, exibiremos uma imagem de avatar padrão estática.

Para especificar sua própria imagem de avatar estática, você pode usar a configuração defaultAvatarSrc.

Substituir o Avatar Padrão

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "defaultAvatarSrc": "https://example.com/some-image.png"

8}];

9</script>

10

Isso também pode ser feito sem código. Na página de personalização do widget, veja a seção "Avatar Padrão".

Personalizando o Avatar Padrão

Observe que definir o avatar para um usuário específico, como com SSO, é abordado em sua própria seção.

Avatares podem ser completamente removidos do widget de comentários, mesmo que os usuários tenham definido seu próprio avatar.

Hiding Avatars

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "hideAvatars": true

8}];

9</script>

10

Isso pode ser personalizado sem código, na página de personalização do widget:

Ocultando Avatares

Para projetos de estilização personalizados maiores, pode ser desejável começar do zero e não usar nenhum estilo padrão.

Todo o estilo padrão pode ser removido definindo o parâmetro noStyles como true, da seguinte forma:

Disabling All Default Styles

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "noStyles": true

8}];

9</script>

10

Isso pode ser personalizado sem código, na página de personalização do widget, em Opções Avançadas:

Desativando Todos os Estilos Padrão

Por padrão, as respostas aos comentários de nível superior são exibidas.

Isso pode ser configurado para que o usuário precise clicar em "Mostrar respostas" nos comentários de nível superior para ver as respostas.

Recolher respostas aos comentários de nível superior

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "collapseReplies": true

8}];

9</script>

10

Isso pode ser personalizado sem código, na página de personalização do widget:

Recolher respostas

Esta configuração não afetará o número de comentários de nível superior carregados inicialmente. Se você tem um comentário de nível superior e 29 respostas, com esta configuração ativada você irá:

• Ver o comentário de nível superior.
• Ver Mostrar respostas (29) sob este comentário.

Se você deseja mostrar todos os comentários de nível superior em combinação com esta opção, defina página inicial para -1.

Por padrão, as funcionalidades de formatação no FastComments são feitas adicionando tags de âncora visíveis como <b></b> ao redor do seu texto. Clicar na barra de ferramentas ou usar atalhos faz isso por você. No entanto, algumas comunidades podem querer optar por usar formatação sem tags de âncora. Isso é chamado de habilitar o editor WYSIWYG (what you see is what you get). Este editor parece exatamente o mesmo que o padrão, exceto que ele carrega algum código extra que permite aos usuários deixar o texto em negrito, sublinhado, etc., sem tags de âncora visíveis.

Enabling WYSIWYG Editing

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "enableWYSIWYG": true

8}];

9</script>

10

Isso também pode ser feito sem código. Na página de personalização do widget, veja a opção "Enable Advanced Formatting".

Ativar WYSIWYG

Por padrão, o FastComments exibirá uma barra de ferramentas ao escrever um comentário para fornecer atalhos para decorar texto e fazer upload de imagens.

Esta barra de ferramentas pode ser desativada no código ou com a interface de personalização.

Desativando a barra de ferramentas

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "disableToolbar": true

8}];

9</script>

10

Isso também pode ser feito sem código. Na página de personalização do widget, veja a opção "Desativar a barra de ferramentas de resposta".

Desativando a barra de ferramentas

Por padrão, o FastComments permite que os usuários bloqueiem outros usuários. Bloquear um usuário fará com que seus comentários sejam mascarados, impede notificações entre os usuários, e assim por diante.

Pode ser desejável desativar essa funcionalidade. Isso pode ser feito da seguinte maneira:

Disable Blocking

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "disableBlocking": true

8}];

9</script>

10

Isso também pode ser feito sem código, o que também habilita a validação adequada no lado do servidor, via a interface de personalização do widget:

Desativar bloqueio

Por padrão, datas relativas localizadas são usadas. Por exemplo, ao lado de um comentário recém‑deixado, você pode ver "11 minutos atrás".

Pode ser necessário ou desejado usar datas absolutas, caso em que você define este parâmetro como true.

Usar datas absolutas

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "absoluteDates": true

8}];

9</script>

10

Isso pode ser personalizado sem código, na página de personalização do widget, em Opções avançadas:

Usar datas absolutas

Por padrão, datas relativas localizadas são usadas. Por exemplo, ao lado de um comentário recém‑postado, você pode ver "há 11 minutos".

Pode ser necessário ou desejado manter esse formato de data relativa, mas também exibir a data completa ao lado, caso em que você define este parâmetro como true.

Use Both Absolute and Relative Dates

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "absoluteAndRelativeDates": true

8}];

9</script>

10

Isso pode ser personalizado sem código, na página de personalização do widget, em Opções avançadas. Primeiro, você precisará habilitar Datas Absolutas para ver esta opção na interface.

Usar Datas Absolutas e Relativas

Algum texto, como um cabeçalho ou mensagem, pode ser renderizado abaixo da contagem de comentários, mas acima do texto de status de login.

Chamamos isso de cabeçalho, e por padrão ele está oculto.

Specifying Header HTML

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "headerHTML": "<h1>Leave a Comment!</h1>"

8}];

9</script>

10

Isso pode ser personalizado sem código, na página de personalização do widget, em Opções avançadas:

Especificando HTML de cabeçalho

Por padrão, o FastComments renderizará links assim: https://exmaple.com - onde a URL do link se torna uma tag âncora HTML clicável.

Alguns sites podem querer desativar isso, por exemplo, para desencorajar golpistas. Nós fornecemos isso definindo a Comment HTML Rendering Option para Links as Text.

Isso pode ser personalizado sem código, na página de personalização do widget, para um domínio inteiro ou página:

Renderizar Links como Texto

Por padrão, o FastComments renderiza a caixa de entrada de comentários e a sequência de comentários ao mesmo tempo. Para economizar espaço vertical, ele também oculta quaisquer outros campos obrigatórios até que o widget seja interagido.

No entanto, o widget de comentários pode ser ocultado atrás de um botão, por exemplo:

Click to Show Comments

O botão usa texto traduzido diferente dependendo de os comentários estarem atualmente exibidos ou não. Se os comentários estiverem ocultos, ele usa translations.SHOW_COMMENTS_BUTTON_TEXT. Se os comentários estiverem exibidos, ele usa translations.HIDE_COMMENTS_BUTTON_TEXT. As traduções podem conter o texto [count], que será substituído pela contagem localizada.

Clique para mostrar ou ocultar comentários

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "useShowCommentsToggle": true

8}];

9</script>

10

Isso foi projetado para substituir a configuração hideCommentsUnderCountTextFormat.

A contagem é atualizada em tempo real com a sequência de comentários. O botão não é exibido se não houver comentários.

Isso pode ser habilitado sem código criando uma regra de personalização e ativando "Clique para Mostrar Comentários":

Enable Click to Show Comments

A contagem de comentários exibida no topo do widget de comentários pode ser personalizada.

Isso pode ser substituído por qualquer string, e o valor [count] será substituído pelo valor da contagem, localizado para o usuário.

Customizing The Comment Count Text

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "commentCountFormat": "There are [count] comments."

8}];

9</script>

10

Isso pode ser personalizado sem código, na página de personalização do widget:

Personalizando o Texto da Contagem de Comentários

Quando os usuários inserem hashtags, no formato #someexampletag, o FastComments criará automaticamente essa HashTag e a destacará em seu comentário.

Em alguns casos, pode ser desejável desativar esse recurso ou controlar quais hashtags podem ser usadas via API.

Para isso, basta habilitar Disable Automatic #hashtag Creation através da UI de Personalização do Widget.

Desativando a Criação Automática de HashTag

Por padrão, o FastComments exibirá um sino de notificação no canto superior direito da área de comentários.

Esse sino ficará vermelho e mostrará a contagem de notificações que o usuário tem. Alguns exemplos de notificações são:

• Usuário respondeu a você.
• Usuário respondeu em um tópico no qual você comentou.
• Usuário deu voto positivo ao seu comentário.
• Usuário respondeu a uma página à qual você está inscrito.

O sino de notificação também fornece um mecanismo para assinar uma página inteira, como também.

No entanto, podemos desativar o sino de notificação completamente:

Desativar Sino de Notificação

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "disableNotificationBell": true

8}];

9</script>

10

Isso também pode ser feito sem código. Na página de personalização do widget, veja a seção "Desativar Sino de Notificação".

Desativar Sino de Notificação

Por padrão, o FastComments exibirá o perfil do usuário quando você clicar no avatar dele.

No entanto, podemos desativar essa funcionalidade:

Desativar Perfis

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "disableProfiles": true

8}];

9</script>

10

Isso também pode ser feito sem código. Na página de personalização do widget, veja a seção "Desativar Perfis".

Desativar Perfis

Por padrão, o FastComments exibirá uma aba "Comentários de Perfil" nos perfis de usuário, permitindo que os visitantes deixem comentários no perfil de alguém.

No entanto, podemos desativar esta aba:

Desativar Comentários de Perfil

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "disableProfileComments": true

8}];

9</script>

10

Isso também pode ser feito sem código. Na página de personalização do widget, veja a seção "Desativar Comentários de Perfil".

Desativar Comentários de Perfil

Por padrão, o FastComments exibirá uma aba "Mensagens Diretas" nos perfis de usuário, permitindo que os visitantes enviem mensagens diretas para um usuário.

No entanto, podemos desativar esta aba:

Disable Profile Direct Messages

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "disableProfileDirectMessages": true

8}];

9</script>

10

Isso também pode ser feito sem código. Na página de personalização do widget, veja a seção "Desativar Mensagens Diretas".

Desativar Mensagens Diretas do Perfil

Por padrão, o FastComments exibirá uma mensagem de sucesso após comentar. Isso pode ser desativado da seguinte forma:

Desativar Mensagem de Sucesso

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "disableSuccessMessage": true

8}];

9</script>

10

Isso também pode ser feito sem código. Na página de personalização do widget:

Desativar Mensagem de Sucesso

Por padrão, o widget de comentários FastComments definirá uma gif rating de pg.

As opções disponíveis são g, pg, pg-13 e r.

Isso pode ser definido no código ou via UI. No código, podemos fazer da seguinte forma:

Set Gif Rating

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "gifRating": "pg-13"

8}];

9</script>

10

Na UI, você encontrará isso em Gif Picker Rating desde que Disable Image Uploads? não esteja marcado.

Configurando a classificação do GIF

Por padrão, o widget de comentários FastComments tem a moderação de conteúdo de imagem desativada off.

As opções disponíveis são off, low, medium e high.

Na interface de personalização do widget, você encontrará isso em Image Content Moderation Level enquanto Disable Image Uploads? não estiver marcado.

Configurando o Nível de Moderação de Conteúdo de Imagem

Por padrão, o FastComments renderiza as opções de votação como setas para cima e para baixo, permitindo que os usuários votem um comentário para cima ou para baixo.

No entanto, é possível alterar o estilo da barra de votação. As opções atuais são os botões padrão de Subir/Descer, ou usar um mecanismo de votação no estilo de Coração.

Usamos a flag voteStyle da seguinte forma:

Enable Heart Button

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "voteStyle": 1

8}];

9</script>

10

Recomendamos fortemente que você faça isso sem código, pois também habilita validações no lado do servidor. Na página de personalização do widget, veja a seção "Vote Style".

Alterar Estilo de Votação

A votação também pode ser desativada, veja Disable Voting acima das opções de estilo.

Por padrão, o FastComments permitirá que os usuários excluam seus comentários.

No entanto, é possível impedir isso.

Na página de personalização do widget, veja a opção "Desativar Exclusão".

Desativar Exclusão de Comentário

• Isso afeta apenas os Comentadores regulares e não os moderadores ou administradores, que ainda poderão excluir.
• Isso também afetará integrações de API quando contextUserId for passado.

Por padrão, o FastComments permitirá que os usuários editem seus comentários.

No entanto, é possível impedir isso.

Na página de personalização do widget, veja a opção "Desativar edição".

Desativar Edição de Comentário

• Isso afeta apenas os Comentadores regulares e não os moderadores ou administradores, que ainda poderão editar.
• Isso também afetará integrações de API quando contextUserId for passado.

Por padrão, o tamanho de página do FastComments é 30. Isso inclui respostas em tópicos.

O tamanho de página pode ser personalizado na Widget Configuration UI em tamanhos variados de 10 a 200.

Observe que alterar o tamanho de página requer recalcular todos os tópicos de comentários em sua conta. Isso pode levar alguns minutos.

Isso não pode ser configurado no widget do lado do cliente, pois as páginas são calculadas no servidor.

Um exemplo de configuração é mostrado abaixo:

Tamanhos de Página Personalizados

Os tamanhos de página podem ser personalizados globalmente, ou por domínio, ou por página, criando diferentes regras de personalização.

Isso afetará todos os clientes, integrações e frameworks que você possa estar usando para exibir comentários através da nossa plataforma.

Por padrão, o FastComments exibirá o nome do usuário exatamente como ele foi inserido, ou como foi passado para nós via SSO.

Entretanto, pode ser desejável mascarar ou exibir o nome do usuário de uma forma diferente. Por exemplo, se o nome do usuário for Allen Rex, talvez você queira exibir apenas “Allen R.”.

Isso pode ser feito sem código na UI de Personalização do Widget, na configuração chamada Commenter Name Format:

Alterar Formato do Nome

Os formatos disponíveis são:

• Capitalizar (exibir usuário de exemplo como Exemplo Usuário)
• Inicial do Último (exibir Exemplo Usuário como Exemplo U.)
• Todas as Iniciais (exibir Exemplo Usuário como E. U.)
• Mostrar "Anônimo"

O efeito da alteração é imediato. Os usuários ainda verão seu nome de usuário completo no topo da área de comentários, para eles mesmos, mas seus comentários exibirão o nome de usuário modificado.

Os nomes de usuário são mascarados no lado do servidor para proteger os usuários.

Por padrão, o FastComments permite o upload de imagens. Isso pode ser desativado definindo a flag noImageUploads como true.

Desativando Upload de Imagens

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "noImageUploads": true

8}];

9</script>

10

Isso pode ser personalizado sem código, na página de personalização do widget:

Desativando Upload de Imagens

Por padrão, o FastComments não permite iframes nos comentários. Quando você ativa a incorporação de mídia, os comentaristas podem colar o código de incorporação (o trecho <iframe>) de provedores confiáveis como YouTube, Vimeo, SoundCloud e Spotify, e ele será renderizado inline no comentário.

Por segurança, esta não é uma flag de configuração do widget no lado do cliente. É uma configuração do lado do servidor, validada quando cada comentário é salvo, portanto não pode ser ativada a partir da página. Apenas iframes apontando para uma lista integrada de provedores confiáveis são permitidos. Qualquer outro iframe é removido.

Isso é feito sem código, na página de personalização do widget:

Permitir Incorporação de Mídia

Adicionando Seus Próprios Provedores

Se você quiser permitir incorporações de um provedor que não está na lista integrada de confiáveis, adicione seu hostname no campo "Domínios de Incorporação Adicionais" na mesma página. Esses hostnames são permitidos além dos provedores integrados. A correspondência é exata, então inclua o hostname completo (por exemplo, player.example.com). Tudo que você não listar permanece bloqueado.

Tanto a caixa de comentário simples quanto o editor WYSIWYG suportam colar uma incorporação. No editor WYSIWYG, a incorporação é inserida como um bloco removível.

Por padrão, não há caixa de pesquisa exibida no widget de comentários.

No entanto, podemos ativá‑la definindo a flag enableSearch como true:

Ativando a pesquisa

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "enableSearch": true

8}];

9</script>

10

Isso também pode ser feito sem código. Na página de personalização do widget, veja a opção "Enable Search Box".

Caixa de Pesquisa Habilitada

Podemos habilitar o suporte a spoilers definindo a flag enableSpoilers como true:

Enabling Spoilers

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "enableSpoilers": true

8}];

9</script>

10

Isso também pode ser feito sem código. Na página de personalização do widget, veja a opção "Enable Spoilers".

Habilitar Spoilers

Quando o texto está destacado e o botão SPOILER agora visível é clicado, o texto será mascarado até que o usuário passe o mouse sobre ele. No modo escuro fazemos o mesmo, com cores diferentes que combinam melhor com o modo escuro.

Isso também é compatível com o editor WYSIWYG.

Por padrão, o FastComments não rastreia quem visualizou cada comentário nem fornece quaisquer estatísticas sobre isso.

No entanto, podemos habilitar esse recurso, e, então, o sistema começará a rastrear à medida que cada usuário rola até um comentário.

Quando isso acontece, uma contagem ao lado de um ícone de olho exibido em cada comentário será incrementada. A contagem é atualizada em tempo real e abreviada de acordo com o locale do usuário.

Podemos habilitar isso definindo a flag enableViewCounts como true:

Habilitando Contagem de Visualizações de Comentários

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "enableViewCounts": true

8}];

9</script>

10

Isso pode ser personalizado sem código, na página de personalização do widget:

Habilitando Contagem de Visualizações de Comentários

Rastreamos o ID do usuário* que visualizou o comentário por uma semana, de modo que, se você visualizar o comentário novamente dentro dessa semana, ele não será incrementado. Se você visualizar o comentário novamente após a semana ter passado, a contagem será incrementada novamente.

• *Nota: ou o ID da sessão anônima, ou o IP do usuário como um valor hashado.

Por padrão, a postagem ao vivo está habilitada. Isso significa que se quaisquer comentários forem adicionados, excluídos, editados ou fixados, as alterações devem aparecer para todos os usuários que visualizam o thread de comentários ao mesmo tempo.

No entanto, por padrão esses novos comentários aparecerão sob um botão exibido dinamicamente com texto semelhante a "Mostrar 2 Novos Comentários".

Se os novos comentários forem respostas diretamente à página, o botão será exibido no topo do thread de comentários. Se forem respostas a um comentário específico, o botão será exibido abaixo desse comentário.

Isso serve para evitar que o tamanho da página mude constantemente para o usuário, potencialmente causando frustração ao tentar pegar a barra de rolagem.

Para alguns casos de uso, como leilões ao vivo ou eventos online, esse não é o comportamento desejado – você pode querer que o widget de comentários seja mais como uma caixa de "chat" onde novos comentários "aparecem imediatamente".

Portanto, o nome da flag que habilita esse recurso: showLiveRightAway.

Podemos ativá-la da seguinte forma:

Mostrar Comentários ao Vivo Imediatamente

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "showLiveRightAway": true

8}];

9</script>

10

Isso pode ser personalizado sem código, na página de personalização do widget:

Mostrar Comentários ao Vivo Imediatamente

Por padrão, o FastComments terá comentários ao vivo habilitados.

Isso significa que cada visualizador da sequência de comentários deve ver o mesmo conteúdo.

Por exemplo, se um comentário for adicionado, esse comentário deve ser exibido. Se um comentário for editado ou removido, então esses comentários serão editados ou removidos para todos os visualizadores da sequência. O mesmo vale para votos e todas as ações de moderação.

No entanto, podemos desativar isso:

Disable Live Commenting

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "disableLiveCommenting": true

8}];

9</script>

10

Isso também pode ser feito sem código. Na página de personalização do widget, veja a seção "Desativar Comentários ao Vivo".

Desativar Comentários ao Vivo

Por padrão, o FastComments ordenará os comentários pela direção de classificação "Mais Relevante".

A ordenação Mais Relevante leva em conta o horário em que o comentário foi deixado e o número de votos para a classificação.

O usuário pode então mudar a direção de classificação para Mais Antigos ou Mais Recentes Primeiro na interface do widget de comentários.

No entanto, podemos alterar o padrão para qualquer um dos três. Por exemplo, se você quiser mostrar os comentários mais antigos primeiro:

Alterando a classificação padrão para Mais Antigos Primeiro

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "defaultSortDirection": "OF"

8}];

9</script>

10

Definimos o valor de defaultSortDirection como "OF" para definir a direção como "OF".

Para a direção de classificação mais recentes primeiro, faríamos o seguinte:

Alterando a classificação padrão para Mais Recentes Primeiro

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "defaultSortDirection": "NF"

8}];

9</script>

10

Os valores válidos para defaultSortDirection são:

• MR: "Mais Recente"
• NF: "Mais Recentes Primeiro"
• OF: "Mais Antigos Primeiro"

Isso também pode ser feito sem código. Na página de personalização do widget, veja a seção "Direção de Classificação Padrão".

Alterando a Direção de Classificação Padrão

Observe que os comentários em cada página para cada direção de classificação são pré-calculados, portanto todas as direções de classificação têm o mesmo desempenho.

Por padrão, a área de entrada de comentários está antes do thread de comentários. No entanto, ao definir este parâmetro de configuração como true, podemos movê-la para depois.

Movendo a Caixa de Resposta para a Parte Inferior

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "inputAfterComments": true

8}];

9</script>

10

Isso pode ser personalizado sem código, na página de personalização do widget:

Movendo a Caixa de Resposta para a Parte Inferior

O número máximo de caracteres permitidos para serem inseridos no campo de entrada de comentário pode ser limitado pelo parâmetro maxCommentCharacterLength.

O padrão é 2000.

Itens como URLs de imagens não são incluídos na determinação do comprimento.

Limitar Tamanho do Comentário

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "maxCommentCharacterLength": 500

8}];

9</script>

10

Isso pode ser personalizado sem código, na página de personalização do widget:

Limitar Tamanho do Comentário

Por padrão, o FastComments permite que o usuário insira um comentário com quantas linhas quiser, até o limite de caracteres padrão.

No entanto, pode ser desejável limitar o usuário a inserir apenas uma única linha de texto. Alguns casos de uso exemplares incluem lances online ou chat ao vivo, para os quais o FastComments pode ser usado.

Nós habilitamos a flag useSingleLineCommentInput da seguinte forma:

Habilitar Entrada de Comentário de Linha Única

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "useSingleLineCommentInput": true

8}];

9</script>

10

Isso também pode ser feito sem código. Na página de personalização do widget, veja a seção "Enable Single-Line Comment Input".

Enable Single-Line Comment Input

Observe que os comentários em cada página para cada direção de ordenação são pré-computados, portanto todas as direções de ordenação têm o mesmo desempenho.

Por padrão, cada usuário pode enviar até 5 comentários no mesmo minuto.

Isso é rastreado por ID de usuário, ID de usuário anônimo e endereço IP (hash).

Isso pode ser personalizado sem código, na página de personalização do widget:

Limitando o Volume de Comentários por Usuário

Observe que, se você estiver usando a API de criação de comentários, pode querer passar o endereço ip original do usuário na solicitação ao nosso backend para que a limitação de taxa seja aplicada por usuário e não globalmente à sua conta.

O FastComments permite exigir que comentaristas de primeira viagem aceitem seus Termos de Serviço antes de enviar um comentário.

Quando ativado:

• Usuários anônimos verão uma caixa de seleção dos TOS toda vez que comentarem
• Usuários autenticados verão a caixa de seleção apenas no primeiro comentário, ou quando você atualizar seus TOS

Configuração

Navegue até a página de personalização do widget e ative a caixa de seleção "Require Terms of Service acceptance". Uma vez ativada, você verá as seguintes opções:

Opções de Termos de Serviço

• TOS Text Mode: Por padrão, a caixa de seleção exibe "I agree to the Terms of Service and Privacy Policy" com links para ambos os documentos. Selecione "Customize text per locale" para fornecer seu próprio texto para cada idioma.
• TOS Last Updated Date: Quando você atualizar seus Termos de Serviço, defina esta data. Usuários que aceitaram antes desta data serão obrigados a aceitar novamente.

Como Funciona

• O timestamp de aceitação dos TOS é armazenado por usuário e por comentário
• Quando um usuário aceita os TOS, a data é registrada no perfil do usuário (por tenant)
• Se você definir uma data de "Last Updated" posterior à data de aceitação do usuário, ele precisará aceitar novamente
• Para usuários anônimos que não podem ser rastreados, a caixa de seleção aparece em cada envio de comentário

Enquetes permitem que os comentaristas anexem uma pergunta com 2 a 10 opções a um comentário. Todos na página votam no local e veem os resultados sendo atualizados em tempo real.

As enquetes ficam desativadas por padrão. Marque Enable Polls nas configurações de personalização do widget para adicionar um botão de enquete à barra de ferramentas de comentários. Então, mais duas configurações aparecem:

• Quem pode criar enquetes: Apenas Administradores/Moderadores (o padrão), ou Todos.
• Permitir votos anônimos em enquetes: quando desmarcado (o padrão), apenas usuários logados podem votar.

Habilitar Enquetes

Veja o Guia de Enquetes para entender como criação, votação, privacidade e notificações de enquetes funcionam.

FastComments Secure SSO usa criptografia HMAC-SHA256 como o mecanismo para implementar SSO. Primeiro iremos explicar a arquitetura geral, fornecer exemplos e passos detalhados.

Também há documentação sobre migração de outros provedores com mecanismos de SSO semelhantes, e as diferenças.

O fluxo é o seguinte:

Fluxo SSO Seguro

Como o Secure SSO envolve desenvolvimento full-stack, exemplos de código completos e funcionais em Java/Spring, NodeJS/Express e PHP vanilla estão atualmente no GitHub.

Embora usemos ExpressJS no exemplo NodeJS e Spring no exemplo Java, não são necessárias bibliotecas/frames de trabalho nesses runtimes para implementar o FastComments SSO - os pacotes nativos de criptografia funcionam.

Você não precisa escrever novos endpoints da API com o FastComments SSO. Simplesmente criptografe as informações do usuário usando sua chave secreta e passe o payload para o widget de comentários.

Obtenha sua chave secreta da API

Sua chave secreta da API pode ser recuperada a partir desta página. Você também pode encontrar esta página indo para My Account, clicando no bloco API/SSO e então clicando em "Get API Secret Key".

Parâmetros do widget de comentários

A documentação de alto nível da API para o widget de comentários pode ser encontrada aqui.

Vamos aprofundar o que esses parâmetros significam.

O widget de comentários recebe um objeto de configuração - você já passa isso se estiver usando o FastComments para enviar seu id de cliente (chamado tenantId).

Para habilitar SSO, passe um novo objeto "sso", que deve ter os seguintes parâmetros. Os valores devem ser gerados no servidor.

• userDataJSONBase64: Os dados do usuário em formato JSON, que então são codificados em Base64.
• verificationHash: O hash HMAC-SHA256 criado a partir de UNIX_TIME_MILLIS + userDataJSONBase64.
• timestamp: Timestamp em epoch, em milissegundos. Não deve estar no futuro, nem com mais de dois dias no passado.
• loginURL: Uma URL que o widget de comentários pode mostrar para autenticar o usuário.
• logoutURL: Uma URL que o widget de comentários pode mostrar para desconectar o usuário.
• loginCallback: Quando fornecido em vez do login URL, uma função que o widget de comentários irá invocar ao clicar no botão de login.
• logoutCallback: Quando fornecido em vez do logout URL, uma função que o widget de comentários irá invocar ao clicar no botão de logout.

Secure SSO Client Code

Copy

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "sso": {

8 "userDataJSONBase64": "...",

9 "verificationHash": "...",

10 "timestamp": 1794130022575.0,

11 "loginURL": "https://example.com/login",

12 "logoutURL": "https://example.com/logout",

13 "loginCallback": null,

14 "logoutCallback": null

15 }

16}];

17</script>

18

O Objeto do Usuário

The User Object

O Objeto do Usuário

Copy

1

2interface SSOUser {

3 /** Obrigatório. Máximo de 1k caracteres. **/

4 id: string;

5 /** Obrigatório. Máximo de 1k caracteres. Observação: Deve ser único. **/

6 email: string;

7 /** Obrigatório. Máximo de 1k caracteres. Observação: O nome de usuário não pode ser um e-mail. Não precisa ser único. **/

8 username: string;

9 /** Opcional. Máximo de 3k caracteres para URLs. Padrão é do gravatar baseado no email. Suporta imagens codificadas em base64, nesse caso o limite é de 50k caracteres. **/

10 avatar?: string;

11 /** Opcional. Padrão: false. **/

12 optedInNotifications?: boolean;

13 /** Opcional. Padrão: false. **/

14 optedInSubscriptionNotifications?: boolean;

15 /** Opcional. Máximo de 100 caracteres. Este rótulo será mostrado ao lado do nome. Padrão é Administrator/Moderator quando aplicável. **/

16 displayLabel?: string;

17 /** Opcional. Máximo de 500 caracteres. Isso será exibido em vez do username. **/

18 displayName?: string;

19 /** Opcional. Máximo de 2k caracteres. O nome do usuário será vinculado a este. **/

20 websiteUrl?: string;

21 /** Opcional. Até 100 grupos por usuário. Um id de grupo não pode ter mais que 50 caracteres. **/

22 groupIds?: string[];

23 /** Opcional. Indica que o usuário é um administrador. **/

24 isAdmin?: boolean;

25 /** Opcional. Indica que o usuário é um moderador. **/

26 isModerator?: boolean;

27 /** Opcional, padrão true. Configure como false para habilitar a aba "activity" no perfil do usuário. **/

28 isProfileActivityPrivate?: boolean;

29 /** Opcional, padrão false. Configure como true para desabilitar comentários no perfil. **/

30 isProfileCommentsPrivate?: boolean;

31 /** Opcional, padrão false. Configure como true para desabilitar mensagens diretas para este usuário. **/

32 isProfileDMDisabled?: boolean;

33 /** Configuração opcional para badges do usuário. **/

34 badgeConfig?: {

35 /** Array de IDs de badges globais a atribuir. Limitado a 30 badges. A ordem é respeitada. **/

36 badgeIds: string[];

37 /** Array de IDs de badges com escopo para a página atual (urlId). Exibido somente na página atribuída. **/

38 pageBadgeIds?: string[];

39 /** Se true, substitui badges exibidos existentes. Global e com escopo de página são sobrescritos independentemente. **/

40 override?: boolean;

41 /** Se true, atualiza propriedades de exibição das badges a partir da configuração do tenant. **/

42 update?: boolean;

43 };

44}

45

Moderadores e Administradores

Para admins e moderadores, passe as respectivas flags isAdmin ou isModerator no objeto SSOUser.

Notificações

Para habilitar ou desabilitar notificações, defina o valor de optedInNotifications como true ou false, respectivamente. Na primeira vez que o usuário carregar a página com esse valor no payload SSO, as configurações de notificação dele serão atualizadas.

Além disso, se você quiser que os usuários recebam e-mails de notificação por atividade em páginas às quais se inscreveram (em oposição a apenas notificações no aplicativo), então defina optedInSubscriptionNotifications como true.

Usuários VIP & Rótulos Especiais

Você pode exibir um rótulo especial ao lado do nome do usuário usando o campo opcional "displayLabel".

Usuários não autenticados

Para representar um usuário não autenticado, simplesmente não preencha userDataJSONBase64, verificationHash ou timestamp. Forneça um loginURL.

Esses usuários não poderão comentar e, em vez disso, serão apresentados com uma mensagem de login (mensagem, link ou botão, dependendo da configuração).

Exemplos diretos para serializar e gerar hash dos dados do usuário

Mais detalhes e exemplos aqui (js), aqui (java) e aqui (php).

Entendemos que qualquer integração pode ser um processo complicado e doloroso. Não hesite em contatar seu representante ou usar a página de suporte.

Com o Simple SSO, podemos fornecer ao widget de comentários informações sobre o usuário para que ele não precise inserir seu nome de usuário ou e‑mail para comentar.

Podemos configurar o Simple SSO da seguinte forma:

Simple SSO

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "simpleSSO": {

8 "username": "Bob",

9 "email": "bob@example.com",

10 "avatar": "https://example.com/bob.png",

11 "websiteUrl": "https://example.com/profiles/bob",

12 "displayName": "Bob's Name",

13 "displayLabel": "VIP User",

14 "loginURL": "https://example.com/login",

15 "logoutURL": "https://example.com/logout",

16 "badgeConfig": {

17 "badgeIds": [

18 "badge-id-1",

19 "badge-id-2"

20 ],

21 "pageBadgeIds": [

22 "badge-id-3"

23 ],

24 "override": false

25 }

26 }

27}];

28</script>

29

O usuário será autenticado e criará um Usuário SSO nos bastidores. O usuário terá createdFromSimpleSSO definido como true se for obtido da API.

Observações:

• E‑mail é o identificador único para o Simple SSO.
• Fornecer um e‑mail com Simple SSO não é obrigatório, porém, por padrão, os comentários deles aparecerão como "Unverified". Se nenhum e‑mail for fornecido, o usuário não pode ser totalmente autenticado.
• NOVO Desde Jan 2022: Nomes de usuário não precisam ser únicos em todo o fastcomments.com
• O Simple SSO pode criar e atualizar usuários SSO automaticamente, se um e‑mail for fornecido, e o usuário não foi originalmente criado a partir do Secure SSO. Se um payload Simple SSO nomear um usuário criado pelo Secure SSO ou pela API, esse usuário permanecerá inalterado e o visitante receberá um usuário separado.
• Você pode especificar emblemas para o usuário com a propriedade badgeConfig. O array badgeIds contém os IDs dos emblemas globais a serem associados ao usuário. O array pageBadgeIds contém IDs de emblemas limitados à página atual (urlId) — esses emblemas são exibidos apenas na página onde foram atribuídos. Se override for definido como true, ele substituirá os emblemas exibidos existentes (globais e de página são sobrescritos independentemente); se for false, ele será adicionado aos emblemas existentes.

Configurações do Simple SSO

O Simple SSO está sempre disponível. Dois ajustes controlam o quanto o FastComments confia nele. Você pode encontrá-los pesquisando por SSO em uma regra de personalização. Ambos estão desativados por padrão, e se aplicam independentemente de "Require SSO To View Comments" estar ativado.

Contas que já utilizavam Simple SSO quando essas configurações foram adicionadas têm ambas ativadas, portanto nada mudou para elas.

Somente a regra de personalização que melhor corresponde a uma página é aplicada, então, se você tiver mais de uma regra, defina-as em cada uma delas. Uma nova regra começa com elas ativadas se alguma das suas outras regras as tiver ativado.

Verificar Comentários Automaticamente via Simple SSO

Quando isso está ativado, os comentários de usuários Simple SSO são verificados imediatamente.

Quando isso está desativado, os comentários de usuários Simple SSO aparecem como "Unverified" até que o usuário clique em um link que enviamos por e‑mail para o endereço no payload Simple SSO. Se você aprova automaticamente apenas comentários verificados, eles também aguardam esse link. Se não houver e‑mail no payload, o comentário permanece não verificado.

Esta configuração afeta apenas comentários. Votos de usuários Simple SSO são sempre contabilizados imediatamente.

Permitir Administradores Simple SSO

Quando isso está ativado, um usuário Simple SSO pode ser administrador ou moderador da sua conta:

• Um usuário Simple SSO que tem permissões de administrador ou moderador as mantém.
• Um usuário Simple SSO com o mesmo e‑mail de um dos seus administradores ou moderadores assume suas permissões.

Quando isso está desativado, o Simple SSO não concede essas permissões. Um payload Simple SSO que nomeia um usuário que as possui gera um usuário separado sem permissões, e o usuário original permanece inalterado.

Os payloads Simple SSO não são assinados, portanto, quando isso está ativado, qualquer pessoa que conheça o e‑mail ou ID de usuário de um administrador pode agir como ele. Se isso for importante para o seu site, deixe desativado e use Secure SSO para seus administradores.

Usuários criados pelo Secure SSO ou pela API não podem ser alcançados pelo Simple SSO, independentemente de isso estar ativado ou não.

FastComments SSO (detalhes aqui) oferece aos seus usuários uma forma de comentar sem precisar fazer login em outra plataforma.

No entanto, isso por si só não protege seus tópicos de comentários, pois, por padrão, os dados dos comentários são informações publicamente disponíveis – qualquer pessoa que possa visualizar a página pode ver os comentários.

Alterando uma configuração, podemos restringir a obtenção dos comentários, a menos que seja feita por um administrador ou usuário SSO válido.

Configuração sem código

Podemos impedir a visualização e a interação com nossos tópicos de comentários, quando o SSO está configurado, criando uma regra de personalização.

Ao fazer isso, procure por SSO, e você encontrará esta opção:

Exigir SSO para Visualizar Comentários

Ative-a e salve a regra de personalização.

Proteger Apenas um Domínio ou Página Específica

Para proteger apenas um determinado Domínio ou Página, basta configurar a regra de personalização para isso.

No topo da interface de personalização, encontraremos dois campos de entrada, Domínio e ID da URL.

Para proteger apenas um domínio específico, insira o domínio em questão no campo "domain".

Para proteger uma página específica, insira a URL da página no campo "URL ID". Se você tem uma integração personalizada com o FastComments, pode inserir um tipo de ID aqui em vez de uma URL.

Níveis de Segurança

Ao exigir SSO, você precisará decidir se requer SSO Simples ou SSO Seguro. Se você exigir SSO Simples, ambos são permitidos, mas se exigir SSO Seguro, o conteúdo deve ser obtido com um payload de SSO Seguro hashado com sua chave de API para ser visualizado.

A opção de nível de segurança aparecerá quando você selecionar "Require SSO To View Comments", e só terá efeito enquanto essa opção estiver ativada.

As configurações Verificar Comentários Automaticamente via SSO Simples e Permitir Administradores SSO Simples são separadas e se aplicam independentemente de esta opção estar ativada.

Proteção Além da Leitura

Ativar esta opção protegerá a página ou domínio de ser comentado, a menos que o usuário esteja conectado via SSO.

Armadilhas

Qualquer usuário que tenha criado comentários antes da sua integração SSO não poderá vê-los, a menos que faça login via sua integração SSO.

Por padrão, o FastComments exigirá um e‑mail para comentar. Não precisa ser um e‑mail válido, porém até que o usuário clique no link enviado a ele, seu comentário exibirá um rótulo "Comentário Não Verificado".

No entanto, podemos remover a exigência de e‑mail. O campo de entrada de e‑mail ainda será exibido, mas não será mais obrigatório.

Isso pode ser configurado via a interface de personalização do widget:

Habilitando Comentários Anônimos

Um nome de usuário ainda é obrigatório. Para remover essa etapa também, você pode definir um nome de usuário padrão que todos compartilham, ou fazer o FastComments gerar um nome de usuário único para cada visitante.

FastComments pode ser configurado para remover comentários não verificados após um número desejado de dias. Isso ajuda a combater spam.

Por padrão, ele não faz isso.

Isso pode ser configurado ou desativado através da página Configurações de Moderação.

Configurações de Moderação

Quando os usuários comentam e não estão logados, será solicitado que forneçam seu e‑mail.

Isso criará uma "sessão não verificada" para esse usuário, e pediremos que ele verifique essa sessão via e‑mail.

Para alguns sites ou aplicativos, pode ser desejável não solicitar o e‑mail do usuário ao comentar ou votar.

Habilitar comentários anônimos torna o campo de entrada de e‑mail opcional. No entanto, podemos desativá‑lo completamente. Primeiro, habilite os comentários anônimos, e então a opção de desativar os campos de entrada de e‑mail aparecerá.

Desativar Entradas de E‑mail

Com isso ativado, os campos de e‑mail não serão exibidos em nenhum dos nossos produtos de comentários.

Observe que, com esta configuração, todos os comentários serão não verificados, a menos que o usuário crie uma conta e faça login em https://fastcomments.com.

Você pode querer considerar desativar o rótulo não verificado.

Por padrão, o FastComments exibirá um rótulo "Comentário Não Verificado" para comentários que foram deixados para um usuário que tem uma sessão de navegador não verificada. Leia mais sobre comentários não verificados aqui.

Disable The Unverified Label

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "disableUnverifiedLabel": true

8}];

9</script>

10

Além disso, esse recurso pode ser usado, sem escrever código, na interface de personalização:

Desativar o rótulo de comentário não verificado

Quando os usuários tentam votar em um comentário e não estão conectados, eles serão solicitados a fornecer seu nome de usuário e e‑mail.

Podemos remover esse requisito, permitindo que qualquer pessoa vote em um comentário sem deixar nenhuma informação.

Permitir Votos Anônimos

Quando os usuários comentam ou votam e não estão logados, eles serão solicitados a fornecer seu e‑mail e nome de usuário.

No caso de comentários anônimos, às vezes é desejável definir um nome de usuário padrão para reduzir o atrito ao comentar. Isso pode ser feito na UI de Personalização. Comentários Anônimos devem ser habilitados primeiro.

Definindo o Nome de Usuário Padrão

Compartilhando o Nome de Usuário Padrão

O nome de usuário padrão é um nome de exibição compartilhado, não uma identidade. Um visitante que mantém o padrão e insere seu e‑mail obtém sua própria conta, com o padrão exibido como seu nome público. Qualquer número de visitantes pode manter o mesmo padrão, de modo que “Anonymous” nunca é relatado como já usado.

Nomes de usuário que um visitante digita por conta própria ainda precisam ser únicos.

Se você preferir que cada visitante receba um nome distinto sem precisar pensar em um, veja Gerar Nomes de Usuário Automaticamente.

Quando os usuários comentam ou votam, e não estão logados, eles serão solicitados a fornecer seu e-mail e nome de usuário.

Para alguns sites, pedir a um visitante que invente um nome de usuário único é uma barreira, especialmente no celular. O FastComments pode gerar um nome de usuário neutro para cada novo visitante e pré-preencher o campo de nome de usuário, como BraveOtter4172.

O visitante pode mantê-lo como está, ou substituí-lo por um nome de sua escolha.

Isso pode ser ativado na UI de Customização, na configuração chamada Generate Usernames Automatically:

Gerar Nomes de Usuário Automaticamente

Como Funciona

• Cada nome gerado é único. Ele é verificado contra contas existentes e reservado para a sessão do navegador daquele visitante, então dois visitantes não recebem o mesmo nome.
• O nome só é gerado para visitantes que ainda não têm um. Usuários logados, usuários SSO e visitantes que já comentaram mantêm seu nome existente.
• Funciona com ou sem comentários anônimos. Com os comentários anônimos desativados, o visitante ainda insere seu e-mail, mas não precisa mais pensar em um nome de usuário.
• Um visitante recorrente que insere um e-mail que já usou antes é correspondido à sua conta existente e mantém o nome dessa conta.
• Se um Nome de Usuário Padrão também estiver definido, o nome gerado tem precedência.

Por padrão, o FastComments renderizará o widget de comentários no locale determinado pelo sistema e navegador do usuário.

Quando um usuário comenta ou faz login, atualizamos o locale usado pela última vez por ele e também o utilizamos para enviar e‑mails.

Isso afeta como o widget de comentários é traduzido para o usuário. O locale consiste no idioma e região do usuário, portanto, configurar o locale geralmente mudará o idioma usado para exibir o texto ao usuário.

Via a UI

Isso pode ser definido usando a UI de personalização do widget. Veja a opção "Locale / Language":

Alterando o Locale / Language

Via Código

Isso pode ser sobrescrito com um locale desejado.

Definindo Manualmente o Locale do Usuário

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "locale": "ru_ru"

8}];

9</script>

10

Idiomas Suportados e Códigos de Locale

Você pode encontrar a lista completa de idiomas suportados e os códigos de locale correspondentes aqui.

Observação sobre SSO

Se você estiver usando SSO, talvez queira passar o locale do usuário no objeto do usuário, para que e‑mails e outras coisas sejam localizados corretamente para ele.

Por padrão, o FastComments não limita os idiomas usados para comentar.

Pode ser desejável limitar os idiomas que uma comunidade usa.

Isso pode ser configurado sem código, na página de personalização do widget:

Idiomas Permitidos

O sistema analisará o comentário e determinará seu idioma, e então o comparará com a lista de permitidos.

Se o comentário for escrito em um idioma que não é permitido, uma mensagem de erro localizada será exibida.

Por padrão, o FastComments traduz a própria interface do widget (botões, rótulos, mensagens de erro) para o idioma do visualizador, mas os comentários são exibidos exatamente como foram escritos.

A Tradução de Comentários adiciona a tradução dos próprios comentários, para que uma comunidade que escreve em mais de um idioma possa ler cada comentário no seu próprio.

Há dois modos:

• Automático: comentários escritos em um idioma diferente do idioma do widget são exibidos traduzidos. Uma linha "Traduzido do espanhol" aparece abaixo do comentário com um link Mostrar original que alterna entre a tradução e o texto não traduzido.
• Manual: cada comentário recebe um link Traduzir. Ao clicar nele, aquele comentário é traduzido para o idioma do visualizador, com o mesmo alternador Mostrar original depois. Comentários que já estão no idioma do visualizador indicam isso em vez disso.

O idioma de destino é o idioma do widget: a configuração Locale / Language na mesma regra de personalização, se estiver definida, caso contrário, o idioma do navegador do visitante. Nada é exigido do visitante, sem conta, extensão ou software adicional, e funciona da mesma forma no widget incorporado e nas páginas de comentários independentes.

Isso é ativado por regra de personalização, então pode se aplicar ao seu site inteiro, a um domínio ou a uma única página. Fica desativado por padrão.

Tradução de Comentários

A tradução é uma configuração do lado do servidor. Passar commentTranslation na configuração JavaScript do widget não a ativa; a regra sim.

Cada comentário é traduzido no máximo uma vez por idioma de destino e o resultado é armazenado com o comentário, então um comentário lido por mil falantes de espanhol é traduzido uma vez. Se o autor ou um moderador editar o comentário, a tradução armazenada é descartada e o comentário é traduzido novamente na próxima visualização. O texto traduzido passa pelas mesmas regras de sanitização e de links que o comentário original. Comentários muito longos, ou cujo idioma não pode ser detectado, são exibidos sem tradução.

O uso é cobrado como tokens de LLM pela mesma taxa dos AI Agents e aparece no mesmo lugar nos seus detalhes de faturamento.

A postagem de comentários pode ser bloqueada para que novos comentários ou votos não possam ser deixados definindo a flag readonly como true.

Os comentários também não poderão ser editados ou excluídos.

Tornando o Thread de Comentários Somente Leitura

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "readonly": true

8}];

9</script>

10

Isso pode ser personalizado sem código, na página de personalização do widget, para um domínio inteiro ou página:

Tornando o Thread de Comentários Somente Leitura

Update!

A partir de novembro de 2022, os threads podem ser bloqueados ou desbloqueados ao vivo por administradores e moderadores via o menu de três pontos acima da área de resposta.

Isso impedirá novos comentários, enquanto ainda permite votação e permite que os usuários excluam seus comentários, se desejado, enquanto readonly não permite essas coisas.

Isso corresponde ao campo isClosed na API Page.

Por padrão, o FastComments permite vincular a qualquer site externo.

Isso pode ser restrito a uma lista desejada de sites ou domínios. Tentar publicar um link para um site ou domínio que não esteja na lista definida fará com que um erro seja exibido ao usuário.

Essa validação é apenas para o Widget de Comentários e a API. Importações não são afetadas.

Isso é feito sem código, na página de personalização do widget:

Restringir Domínios de Link Externo

Por padrão, o FastComments solicitará ao usuário apenas seu comentário, seu nome de usuário e seu e‑mail.

No entanto, em algumas situações você pode querer que o usuário deixe um link para seu próprio blog ou site.

Podemos habilitar a exibição de um campo de entrada extra para inserir a URL do site do usuário definindo a flag enableCommenterLinks como true:

Habilitando Links de Comentadores

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "enableCommenterLinks": true

8}];

9</script>

10

Quando essa URL for fornecida, a conta do usuário será atualizada e todos os seus nomes de usuário em comentários passados e futuros serão vinculados a essa URL.

Isso pode ser personalizado sem código, na página de personalização do widget:

Habilitando Links de Comentadores

Uma lista de ids gerados a partir da página Grupos de Moderação.

Quando especificado, os comentários deixados usando a configuração especificada conterão o mesmo conjunto de moderationGroupIds.

Se um Moderator tiver um ou mais Grupos de Moderação definidos, ele(a) verá apenas os comentários na página Moderate Comments associados ao(s) seu(s) grupo(s).

Specify Moderation Groups

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "moderationGroupIds": [

8 "mxZAhjzdb",

9 "FT19nXbqA"

10 ]

11}];

12</script>

13

Para autenticação, o FastComments depende de cookies de terceiros estarem habilitados no seu navegador. Sem eles, os usuários sempre precisarão deixar seu e‑mail para comentar (a menos que o campo de entrada de e‑mail esteja oculto), e seus comentários sempre aparecerão como não verificados (por padrão).

Para contornar isso, você pode habilitar a bypass de cookies de terceiros.

Quando essa configuração está habilitada, ela causará um pequeno pop‑up que mostra uma mensagem indicando que o usuário está sendo autenticado. Esse pop‑up é exibido sempre que o usuário interage com o widget de comentários; por exemplo, se ele deixar um comentário.

Podemos fazer isso no código definindo a flag enableThirdPartyCookieBypass como true:

Habilitando Bypass de Cookie de Terceiros

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "enableThirdPartyCookieBypass": true

8}];

9</script>

10

Também podemos configurar isso via a UI de Personalização do Widget, em Enable Third-Party Cookie Popup:

Habilitando Bypass de Cookie de Terceiros

Por padrão, os usuários podem excluir seus próprios comentários. Além disso, excluir seu comentário exclui automaticamente todos os comentários filhos e transitórios na thread. Esse comportamento também está ativo.

Você pode restringir isso das seguintes maneiras:

• Em vez disso, anonimizar o comentário excluído (definir nome e texto como [deleted] ou um valor personalizado).
• Não permitir a exclusão de comentários quando houver respostas. Uma mensagem de erro personalizável é exibida.
• Restringir a exclusão de comentários que têm respostas apenas a administradores e moderadores.

Isso pode ser configurado na seção Comment Thread Deletion na UI de Personalização do Widget.

Personalizar comportamento de exclusão para respostas

Por padrão, o FastComments exibirá os emblemas dos usuários apenas em seus comentários dentro da thread de comentários.

No entanto, podemos mostrar os emblemas dos usuários ao lado de seu nome acima do formulário de comentário habilitando este recurso na página de personalização do widget:

Opção Mostrar Emblemas na Barra Superior

Isso exibirá os emblemas do usuário ao lado de seu nome na área da barra superior, tornando suas conquistas e status mais proeminentes enquanto ele está compondo um comentário.

Observe que este recurso deve estar habilitado na interface de personalização do widget para funcionar. Você pode, opcionalmente, definir a flag showBadgesInTopBar como false na sua configuração de código para desativá‑lo seletivamente mesmo quando ele está ativado no nível do servidor:

Disable Show Badges in Top Bar

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "showBadgesInTopBar": false

8}];

9</script>

10

Por padrão, o FastComments não exibe uma lista de usuários na página.

Você pode renderizar uma lista de pessoas que estão visualizando a página no momento, ao lado do widget de comentários. A lista é atualizada em tempo real à medida que os usuários entram e saem, e mostra seu nome, avatar e um indicador online.

Existem três opções de layout:

• 1 - Top: uma linha horizontal de avatares sobrepostos renderizada acima dos comentários.
• 2 - Left: uma barra lateral com nomes e pontos online renderizada à esquerda do widget.
• 3 - Right: a mesma barra lateral renderizada à direita do widget.

Defina a flag usersListLocation para habilitar o recurso:

Show Users List on the Right

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "usersListLocation": 3

8}];

9</script>

10

Por padrão, a lista mostra apenas os usuários atualmente online. Para também incluir pessoas que comentaram na página no passado (mas que não estão visualizando no momento), defina usersListIncludeOffline como true:

Include Past Commenters

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "usersListLocation": 3,

8 "usersListIncludeOffline": true

9}];

10</script>

11

Os comentaristas passados são renderizados sem o ponto verde online, para que fique claro quem está presente agora.

Usuários com perfis privados são exibidos com um avatar genérico e um rótulo "Perfil Privado" para que a contagem permaneça precisa sem revelar identidades.

Isso também pode ser configurado sem código. Na página de personalização do widget, veja a opção "Users List Location". Quando a localização é definida para algo diferente de Off, uma caixa de seleção "Include past commenters" aparece abaixo dela.

Configurações da Lista de Usuários

Com base nos últimos 500 usuários ativos, a lista pode estar desatualizada em até 30 segundos.