Gifs do Discourse

||||
-|-|
:discourse2: | Resumo | Discourse Gifs adiciona um botão ao editor que permite buscar GIFs e inserir facilmente o melhor deles na sua publicação.
:hammer_and_wrench: | Link do Repositório | https://github.com/discourse/discourse-gifs
:open_book: |Novo nos Temas do Discourse? | Guia para iniciantes sobre como usar Temas do Discourse

Instale este componente de tema

Funcionalidades

Após a busca, você obtém uma parede de GIFs relacionados com rolagem infinita:

recording

Ao clicar em um deles, ele é inserido no seu editor atual, que fica assim:

shut up and take my money GIF by Product Hunt

Isso é fortemente baseado em um fork antigo do ReplyGif: Adicionando GIF de reação facilmente, então agradecimentos ao @cpradio.

As grandes diferenças são:

  • Ele pode usar WebP animado em vez de GIFs, tornando-o muito mais eficiente para a largura de banda.

  • É um componente de tema, então é muito mais fácil de instalar e atualizar.

  • Oferece a escolha entre a API do Giphy ou a API do Tenor.

  • Rolagem infinita para os resultados

  • Os GIFs resultantes são baixados para o Discourse usando nossa proteção nativa contra bitrot. Você pode desativar esse comportamento usando as configurações existentes se o espaço for uma preocupação.

  • Não há necessidade de mexer com o nginx para configurar um proxy para HTTPS

Obtendo uma Chave de API do Giphy

Para que o componente funcione, você precisa visitar Dashboard | GIPHY Developers e clicar como indicado:

Preencha o formulário e a chave da API será exibida como:

Obtendo uma Chave de API do Tenor

Obtenha essa chave no site oficial do Tenor: GIF API - Melhor, Mais Rápido & Gratuito | Obtenha Seus GIFs com o Tenor

Depois disso, visite a página do componente de tema no Discourse e preencha as configurações, por exemplo:

Configurações

Nome Descrição
provedor de api Qual provedor de GIF devemos usar?
chave da api do giphy GIPHY: Chave da API
formato de arquivo do giphy GIPHY: Formato de imagem a ser usado. O WEBP tem arquivos menores que carregam mais rápido, enquanto o GIF oferece compatibilidade com navegadores antigos.
classificação de conteúdo do giphy GIPHY: Classificação de conteúdo para os resultados da busca. Encontre mais informações em https://developers.giphy.com/docs/optional-settings#rating .
localidade do giphy GIPHY: Idioma a ser usado na busca. Usado para adaptar a busca ao conteúdo regional. Defina conforme a localidade padrão do seu fórum.
limitar resultados da busca infinita Limite o número de resultados de GIF retornados conforme o usuário rola infinitamente para evitar o limite de taxa da API.
limite máximo de resultados Tenor & GIPHY: Quando “limitar resultados da busca infinita” está habilitado, buscaremos até obtermos esse número máximo de resultados de GIF. Cada chamada de API recupera 24 resultados, por exemplo, 240 Limite Máx: 240 / 24 = 10 Chamadas de API .
chave da api do tenor Tenor: Chave da API V2. Instruções para obter uma podem ser encontradas em Meta do Discourse - Discourse Gifs .
chave de cliente do tenor Tenor: (opcional) string especificada pelo cliente que representa a integração
detalhe do arquivo do tenor Tenor: Formato de imagem a ser usado
filtro de conteúdo do tenor Tenor: Nível de segurança de conteúdo para os resultados do Tenor. Encontre mais informações em Guias da API do Tenor .
país do tenor Tenor: Código de País de Origem de Duas Letras para a solicitação. Encontre o código do seu país em Wikipedia - ISO_3166-1 .
localidade do tenor Tenor: Idioma a ser usado na busca. O código do país (opcional) pode ser fornecido para diferenciar entre dialetos.
Tradução Padrão
gif.modal_title Buscar GIFs
gif.query Termo
gif.insert Inserir Imagens Selecionadas
gif.composer_title Buscar GIFs
gif.no_results Digite uma palavra-chave na caixa de entrada acima para buscar GIFs.
gif.bad_api_key Chave de API do $api_provider inválida. Administradores do site, por favor verifique sua chave e/ou sua conta do $api_provider.
gif.error_rate_limit Alcançamos nossos Limites de Taxa da API do $api_provider. Por favor, aguarde e tente novamente mais tarde. Se esse problema persistir, entre em contato com o administrador do site.
gif.error_search_too_long Por favor, encurte sua consulta de busca para menos de 50 caracteres e tente novamente.

:discourse2: Hospedado por nós? Componentes de tema estão disponíveis para uso em nossos planos Standard, Business e Enterprise.

84 curtidas

Olá @Heather_Dudley,

Adicionei uma nova configuração de site para permitir que você force o componente a usar o formato GIF em vez de WebP.

Apenas esteja ciente de que ele ocupa mais que o dobro do espaço em disco/largura de banda de rede, enquanto oferece menos qualidade.

Este GIF aqui:

GIF: 3,5 MB
giphy

WEBP: 1,4 MB
Detective Pikachu Reaction GIF

MP4: 1 MB

AVIF: 276,8 KB

Para todos os outros, adicionei o foco automático no modal de pesquisa!

17 curtidas

incrível, muito obrigado! estava procurando por esse recurso :slight_smile:

3 curtidas

Onde está a configuração, @Falco? Não consegui encontrá-la para ativá-la.

1 curtida

1 curtida

Ok, então não estou cego, não tenho essa opção. Eu só tenho a chave da API:

repositório ao qual estou vinculado: https://github.com/discourse/discourse-gifs/tree/giphy

1 curtida

Oh, você está instalado na branch antiga. Reinstale usando a branch principal em GitHub - discourse/discourse-gifs · GitHub

3 curtidas

Aaaah, isso resolveria. Obrigado. Não prevejo problemas, mas avisarei caso tenha algum!

4 curtidas

Não é possível usar a plataforma Tenor do Google? Depois que o Facebook adquiriu o Giphy, parei de usá-lo e migrei para o Tenor.

3 curtidas

Este componente usava o Tenor na primeira versão, mas migrei para o Giphy, pois usar GIFs no formato WEBP é muito melhor para a usabilidade em comparação com outros formatos. E o Tenor não suporta GIFs no formato WEBP.

4 curtidas

Ironicamente, considerando quem criou o formato WebP e quem agora é dona do Tenor.

8 curtidas

Talvez eles vão direto para o AVIF animado? Ele já está disponível no Chrome e em breve estará em todos os navegadores modernos.

Eu o adicionei a esta postagem acima, o tamanho do arquivo é incrível:

5 curtidas

Como está o desenvolvimento desse formato? Quanto tempo você acha que levará para outras empresas o adotarem (incluindo o Discourse :wink:)?

2 curtidas

O Discourse pode suportá-lo facilmente assim que houver suporte nos navegadores: AVIF image format | Can I use... Support tables for HTML5, CSS3, etc

4 curtidas

Graças ao @eviltrout, agora renderizamos o botão GIF em um local melhor em dispositivos móveis, então isso não acontecerá mais!

10 curtidas

Obrigado, @Falco. É possível ocultar o botão de GIF ao visualizar a mensagem?


Obrigado.

1 curtida

Não tenho muita familiaridade com os componentes de tema. É possível habilitar isso apenas em uma categoria?

Temos uma categoria aleatória / fora do tópico / divertida onde isso seria uma adição brilhante, mas se eu adicionar a todas as categorias, o caos se instaura :rofl:

4 curtidas

Você pode tentar com CSS, mas como o composer permanece aberto ao navegar no fórum, não tenho certeza se funcionaria 100%.

Seria algo assim:

:not(.category-your_category_id) .d-icon-discourse-gifs-gif-icon {
    display: none
}
4 curtidas

Boa ideia. Adicionado na última versão, por favor atualize!

8 curtidas

Isso é incrível! Bom trabalho, acabei de adicionar isso ao meu fórum!

4 curtidas