네비게이션 링크에 아이콘을 추가하는 방법?

여기 “Chat” 앞에 Font Awesome 아이콘을 추가하고 싶습니다:

image

이를 어떻게 구현할 수 있을까요?

참고: 이 버튼은 Custom Top Navigation Links 를 사용하고 있습니다.

안녕하세요,

데스크톱 헤더에 이런 식으로 추가하는 건 어떨까요?

document.querySelector('#navigation-bar li a[href="/chat"]'); 줄을 수정하여 올바른 a[href="..."] 경로로 지정할 수 있습니다.

또한 iconHTML('comment');에서 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>

좋아요!

(최소 20자)