Como adicionar um ícone em um link de navegação?

Suporte
1

Gostaria de adicionar um ícone do Font Awesome antes de “Chat” aqui:

image

Como posso conseguir isso?

Observação: Eu uso Custom Top Navigation Links para este botão.

2

Olá,

Talvez algo assim para o cabeçalho da área de trabalho?

Você pode alterar a navegação de destino alterando a linha document.querySelector('#navigation-bar li a[href=\"/chat\"]'); para apontar para o caminho a[href=\"...\"] correto.

E também você pode alterar o ícone com iconHTML('comment'); alterando o comment.

Screenshot 2022-04-22 at 18.43.45

<script type="text/discourse-plugin" version="0.8">
  api.onPageChange(() => {
    const { iconHTML } = require("discourse-common/lib/icon-library");
    const navItem = document.querySelector('#navigation-bar li a[href="/chat"]');

    let icon = iconHTML('comment');
       
    if (navItem) {
      navItem.insertAdjacentHTML('afterbegin', icon)
    }
  });
</script>
4 curtidas
3

Legal!

(Pelo menos 20 caracteres)

2 curtidas
4

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.