Links de cabeçalho personalizados (ícones)

Minha resposta abaixo foi para uma postagem que foi excluída e que continha o seguinte. Ainda estou interessado nos ícones do FA5…

Ainda é possível adicionar ícones usando este plugin? Pergunto porque não está funcionando mais. Preciso adicionar Facebook, Twitter e Instagram.

Não há opção para ícone SVG aqui: [screenshot]

Funcionou para você antes? O que mudou e o que você já tentou?

Será que você baixou a versão deste plugin sem ícones?

Consegui fazer os ícones do Font Awesome 4 funcionarem, mas não os do Font Awesome 5 (exceto os 2 ou 3 integrados): veja minha postagem acima.

Sim, eu na verdade baixei a versão sem ícone, percebi isso após algumas pesquisas. Agora está funcionando com o discourse-icon-header-links.

Isso é ótimo. Você poderia compartilhar as configurações que usou? Gostaria de experimentá-las para ver onde estava errando. Obrigado.

Claro, aqui está: - Screenshot by Lightshot

Facebook, fab-facebook, https://www.facebook.com/, vdo, blank
Twitter, fab-twitter, https://www.twitter.com/, vdo, blank
Instagram, fab-instagram, https://www.instagram.com/, vdo, blank

Me avise se isso ajudar :slight_smile:

1 curtida

Muito obrigado. Estes são os três nativos, que funcionaram para mim também.

Você poderia tentar outros ícones FA5 e me dizer como ficou?

Tentei o LinkedIn e funciona: Screenshot by Lightshot

Se você estiver adicionando qualquer ícone FA5, certifique-se de incluir as classes de ícones do FontAwesome 5 para cada ícone usado na lista na seção de ícones SVG aqui: Screenshot by Lightshot

Obrigado!

1 curtida

Eu realmente aprecio isso. Funciona também com ícones que não sejam do fab?

Não, não funcionou sem o fab-.

Acho que isso pode estar errado, embora peço desculpas antecipadamente se não for…

Por exemplo, para usar o ícone de cartão de endereço em Address Card Icon | Font Awesome, você precisa mudar far fa-address-card para far-address-card (e adicioná-lo à configuração subconjunto de ícones svg). Simplesmente usá-lo sem o fa- não funciona.

Eu só percebi isso depois de olhar para FEATURE: Update Font Awesome to v5.4.1 and SVGs by pmusaraj · Pull Request #6557 · discourse/discourse · GitHub e FEATURE: Update Font Awesome to v5.4.1 and SVGs by pmusaraj · Pull Request #6557 · discourse/discourse · GitHub.

1 curtida

Existe alguma maneira de remover os links de cabeçalho existentes?

Consegui instalar. Agora quero colocar este ícone Rocket Icon | Font Awesome com o link para a categoria de veículos. Fiz o seguinte: Link mobile/desktop, fas-rocket, c / vehiculos / 69, vdm, blank. E abaixo coloquei fas-rocket. Mas o ícone não está aparecendo. Como faço para carregar o ícone?

Tente apenas com “rocket”.

Essa suposição é baseada apenas na busca por “rocket” em https://github.com/discourse/discourse/pull/6557/commits/bf3f958cdd516d09136bee33e3d51b36c05dcbfe.

3 curtidas

Obrigado, você sabe se este ícone está disponível?

Acho que vou ter que adicioná-lo manualmente. Um pouco difícil para mim.
Seria assim?

Em plugins: basta incluir um arquivo SVG sprite na pasta plugins/nome-do-seu-plugin/svg-icons. Reinicie seu servidor (se estiver em desenvolvimento) ou reconstrua o site se estiver em um container Docker e seus ícones personalizados devem estar automaticamente disponíveis.

Alguém poderia me dar um resumo de como adicionar o ícone de máscara em um fórum que está na DigitalOcean e não sabe nada? Obrigado

Acabei de testar no meu fórum, alterando temporariamente um dos meus ícones. O ícone funciona se você o chamar de rocket (sem as aspas) em header links. Se não funcionar, talvez haja um problema com o restante da sua linha. Não há necessidade de adicioná-lo a svg icons.

1 curtida

Sim, muito obrigado, o foguete funcionou perfeitamente. Mas agora eu quero adicionar isso:

Peço desculpas. Eu assumi incorretamente que você ainda se referia ao ícone original. O ícone do teatro não está mencionado no código, então não funcionará.

Fiz uma verdadeira maratona tentando adicionar ícones FA5, mas não consegui. Nenhuma das sugestões aqui funcionou para mim.

Nada que eu coloquei em svg icons fez diferença. Vale notar que o ícone do Instagram mencionado em uma postagem relativamente recente aparece no código, então acredito que funcione por esse motivo (não porque foi adicionado a svg icons).

1 curtida

Recebi o seguinte relatório de segurança para este componente; posso configurá-lo para usar o código rel="noreferer, noopener"?

1 curtida

Após atualizar para a versão mais recente do Discourse, os ícones não estão mais sendo exibidos. Qual poderia ser o problema?

2 curtidas

Adicionamos isso à nossa instância e ficou fantástico. Muito obrigado por este plugin!

Seria possível ter uma configuração para adicionar algum espaço em branco entre os novos ícones e os existentes, os padrão? Posso simular isso adicionando ,,,,, mas isso acaba linkando para a página de configurações do tema, embora o visual seja exatamente o que gostaríamos;
Screen Shot 2021-05-20 at 13.22.40

3 curtidas

Que ótimo saber isso :+1:

Claro, acabei de adicionar isso aqui (desativado por padrão)

Remova a configuração vazia das suas configurações, atualize o componente, ative a nova configuração e ela deverá começar a funcionar após uma atualização da página.

5 curtidas