Moetwemoji: Emojis Animados Leves (AVIF) - Dê vida ao seu fórum

PixPin_2026-01-04_22-04-17

Olá a todos! :waving_hand:

Criei um novo plugin para trazer mais energia e expressões dinâmicas às comunidades do Discourse. Moetwemoji apresenta um conjunto de emojis animados que tornam as interações mais vivas e divertidas.

:rocket: Principais Recursos

  • Super Leve: Todos os emojis são codificados no formato AVIF.

  • Alto Desempenho: O tamanho médio do arquivo é de apenas cerca de 10KB, garantindo que seu fórum carregue rapidamente enquanto fica ótimo.

  • Implantação Flexível: Ofereço duas versões diferentes dependendo das suas necessidades (Substituição ou Suplemento).


:package: Escolha Sua Versão

Preparei dois repositórios separados dependendo de como você deseja integrar esses emojis ao seu fórum.

Opção 1: A Versão de Substituição (Total Replacement)

Se você deseja substituir completamente o conjunto padrão estático Twemoji por estes animados, use esta versão. Ela substitui as configurações padrão do sistema, tornando a animação a experiência padrão.

Opção 2: A Versão em Pacote (Supplement)

Se você prefere manter os emojis padrão e simplesmente adicioná-los como um "Pacote" extra no seletor de emojis, use esta versão. Ela adiciona uma nova aba ao seu seletor de emojis sem alterar os padrões.


17 curtidas

Obrigado por compartilhar :+1:

Eu tentei testar, mas não funciona, apesar de ter adicionado o repositório no arquivo app.yaml

Há algum parâmetro a ser configurado?

Obrigado

OK, tente a Instalação Manual

Guia de Instalação Manual (Versão de Substituição)

Este guia explica como instalar e aplicar manualmente o plugin discourse-moetwemoji-twemoji-fakepng-override dentro de um contêiner Discourse em execução, e esclarece por que uma reconstrução completa não é estritamente necessária para a versão de substituição.


1. Entrar no Contêiner Discourse

No seu servidor, navegue até o diretório do Docker do Discourse (geralmente /var/discourse) e entre no contêiner em execução:

cd /var/discourse
./launcher enter app

Você deve estar agora dentro do shell do contêiner.


2. Clonar o Plugin de Substituição Manualmente

Navegue até o diretório de plugins e clone o repositório:

cd /var/www/discourse/plugins
git clone https://github.com/constansino/discourse-moetwemoji-twemoji-fakepng-override.git

Verifique se o diretório existe:

ls discourse-moetwemoji-twemoji-fakepng-override


3. Aplicar a Substituição de Emoji

Volte para o diretório raiz do Discourse:

su - discourse
cd /var/www/discourse

Verifique o status atual (opcional, mas recomendado):

RAILS_ENV=production bundle exec rake moetwemoji_twemoji:status

Aplique a substituição:

RAILS_ENV=production bundle exec rake moetwemoji_twemoji:apply

Se o comando for concluído sem erros, os arquivos PNG do Twemoji foram substituídos pelo Moetwemoji.


4. Notas Importantes Sobre Reconstruções (Persistência)

:red_exclamation_mark: Nenhuma reconstrução é necessária para que a substituição funcione

Esta versão de substituição funciona substituindo diretamente os arquivos no contêiner em execução.
Portanto:

  • :white_check_mark: Você NÃO precisa executar ./launcher rebuild app

  • :white_check_mark: As alterações entram em vigor imediatamente após a execução da tarefa rake

:warning: Mas a alteração NÃO é persistente

Como isso é feito dentro do sistema de arquivos do contêiner:

  • Qualquer ./launcher rebuild app futuro

  • Ou recriação/atualização do contêiner

irá apagar as alterações, e a substituição de emoji será perdida.

:backhand_index_pointing_right: Se você precisar de persistência entre reconstruções, você deve instalar o plugin através dos hooks do app.yml e reconstruir corretamente.


5. Limpar o Cache do CDN e do Navegador (Muito Importante)

Após aplicar a substituição, os emojis podem ainda aparecer inalterados devido ao cache.

5.1 Limpar o Cache do CDN (ex: Cloudflare)

Se você estiver usando um CDN como o Cloudflare:

  • Exclua o cache para:

    • /images/emoji/*

    • ou execute uma limpeza completa do cache, se necessário

Caso contrário, os arquivos PNG antigos do Twemoji podem continuar sendo servidos.

5.2 Limpar o Cache do Navegador

No lado do cliente:

  • Atualização forçada da página (Ctrl + F5 / Cmd + Shift + R)

  • Ou limpar o cache do navegador

  • Ou testar em uma janela anônima/privada

Até que os caches do CDN e do navegador sejam limpos, as alterações de emoji podem não ser visíveis.


6. Resumo

  • Este plugin de substituição pode ser instalado e aplicado sem reconstrução

  • A instalação manual é útil para:

    • Testes

    • Uso temporário

    • Depuração

  • A desvantagem é a falta de persistência

  • Sempre limpe o cache do CDN + cache do navegador após aplicar substituições de emoji


Você executou a tarefa conforme descrito no README?

Este README fornece dois métodos de instalação:

  1. O primeiro método requer uma reconstrução.
  2. O segundo método é entrar manualmente no contêiner e baixá-lo do GitHub.

Não há diferença entre os dois métodos; o primeiro é simplesmente mais persistente. Se o download falhar ao reconstruir usando o primeiro método, considere tentar o segundo método, que envolve a instalação direta dentro do contêiner. Isso ocorre porque ele essencialmente baixa e substitui as imagens de emoji existentes.

Notei que o Readme explica 2 métodos de instalação, mas também menciona:

cd /var/discourse
./launcher enter app

su - discourse
cd /var/www/discourse

RAILS_ENV=production bundle exec rake moetwemoji_twemoji:status
RAILS_ENV=production bundle exec rake moetwemoji_twemoji:apply

o que não é mencionado na primeira postagem aqui no Meta. Assim como as informações sobre cache. É por isso que pensei que alguém poderia perder isso.


A propósito, ambos os seus links na primeira postagem contêm uma pesquisa do Google. Existe algum motivo para você não ter vinculado diretamente ao GitHub?

1 curtida

Por que é chamado de “moetwemoji”, e a pasta de emojis de “twemoji” quando os emojis animados são emojis animados oficiais do Google Noto?

No entanto, isso é mencionado neste arquivo, onde a atribuição está incompleta. Diz-se que o arquivo está em andamento, mas eu esperaria que uma atribuição estivesse completa antes de distribuir seu componente de tema :face_with_tongue:

5 curtidas

Desculpe, minha postagem pode não ter sido abrangente o suficiente. Eu a revisarei mais tarde. Obrigado pela sua correção.

2 curtidas

Obrigado por apontar isso — você está absolutamente certo.

A nomenclatura é histórica e vem da estrutura de emoji padrão do Discourse, mas os ativos animados reais são do Google Noto Emoji, não do Twemoji. Concordo que isso é confuso e precisa ser esclarecido.

Atualmente estou:

  • Atualizando a atribuição para cumprir totalmente a licença do Noto Emoji
  • Esclarecendo a fonte dos ativos no README
  • Revisando a nomenclatura / estrutura de pastas para reduzir a confusão

Obrigado pela revisão e por notar isso.

2 curtidas

Vou esperar porque, apesar das manipulações, não está funcionando. Por outro lado, meu Discourse está em um servidor autônomo meu, no Ubuntu Server. Não sei se preciso fazer alguma manipulação adicional em relação ao cache?

apenas tente
https://"seusite"/images/emoji/twemoji/hugs.png?v=15

e

https://"seusite"/images/emoji/twemoji/hugs.png?v=15&cache=0

Ambos os URLs fornecem emojis muito estáveis e imóveis. Portanto, com base nisso, não vejo motivos para instalar isto. Uma questão de dispositivo?

Eu acho que esses links são para testar o plugin após instalá-lo. Contanto que você não use o plugin, você verá o emoji que o plugin substituiria.

Eu realmente instalei, e não vejo nada. Talvez eu deva usar outros emojis nas configurações do Discourse ou algo mais, eu não sei [1]


  1. além disso, eu pessoalmente acho que elementos em movimento são ecos dos anos 90 :squinting_face_with_tongue: Então não estou muito motivado para começar a investigar isso mais a fundo. ↩︎

Desculpe, como você disse que não vê razão para instalá-lo, presumi que você não o tinha feito.

Você executou a tarefa rake que é explicada no readme do repositório do plugin? Eu acho que é isso que coloca o emoji animado onde você tentou acessá-los com os links.

1 curtida

Minha culpa. Estou no telefone e estava/estou com preguiça de escrever então.

Não, eu não fiz.

Edição.

Eu nunca li o readme, porque o OP oferece apenas um link (inútil) para a pesquisa do Google. Agora fiz etapas extras no repositório original para encontrar informações que deveriam ou poderiam estar no OP.

1 curtida

Eu vejo os emojis animados com “https://“seu_domínio”/images/emoji/twemoji/hugs.png?v=15”, mas quando tento selecionar um emoji no chat, por exemplo, não funciona :thinking:

Para reduzir a complexidade, recomendo remover tudo relacionado a não reconstruir e entrar no contêiner para clonar. Isso é desnecessário e não é a maneira padrão de gerenciar plugins.

Quase todos os administradores estarão reconstruindo periodicamente e a persistência é o aspecto mais importante, então o método app.yml é o melhor.

Você também pode vincular às instruções padrão e apenas detalhar as etapas que são exclusivas.

3 curtidas