# Brand Header
**URL:** https://meta.discourse.org/t/brand-header/77977
**Category:** Theme component
**Tags:** official, brand-header
**Created:** [1월 14, 2018, 6:27오전 UTC](https://meta.discourse.org/t/brand-header/77977 "2018-01-14T06:27:03Z")
**Posts on this page:** 6
**Page:** 2
### Author:  [@JammyDodger](https://meta.discourse.org/u/JammyDodger)
#### Post date: [7월 8, 2024, 5:16오후 UTC](https://meta.discourse.org/t/brand-header/77977/265 "2024-07-08T17:16:00Z")
그렇지 않으면 ✋ 🙂
이것은 #official 테마 컴포넌트이므로 Discourse 팀에서 관리하고 있습니다(또한 꽤 인기가 많기도 하죠). 따라서 어떤 의미에서든 폐기된 상태가 아닙니다.
다만 다른 주제에서 이미 답변을 받으셨을 것 같습니다:
> [@awesomerobot](#):
>
> 현재 버전인 3.3이 아니라 Discourse 3.2를 사용 중인 것 같습니다. 이 컴포넌트에는 3.3 버전에 의존하는 업데이트가 있으므로, 현재는 해당 업데이트를 받지 못하고 있습니다.
---
### Author:  [@pacharanero](https://meta.discourse.org/u/pacharanero)
#### Post date: [10월 1, 2025, 3:24오후 UTC](https://meta.discourse.org/t/brand-header/77977/266 "2025-10-01T15:24:01Z")
> [@Discourse](#):
>
> 이 테마 컴포넌트에서 Font Awesome 6 아이콘이 올바르게 표시되려면 Discourse의 3개 위치에 아이콘을 추가해야 합니다:
>
> 1. `svg icon subset` 사이트 설정
> 2. 컴포넌트의 `custom font awesome icons` 설정
> 3. 컴포넌트의 `icons` 설정
몇 달 동안 Brand Header에 깨진 아이콘이 몇 개 있었습니다. 아마도 FA6 이름 변경 이후부터였던 것 같습니다. 마침 이제 수정하게 되어, 어떻게 이름을 처리해야 하는지 작동하는 방법을 다른 분들에게 알려드리고자 이렇게 댓글을 남깁니다.
[소스 코드에서 매핑을 찾아보고](https://github.com/discourse/discourse/blob/fbc2cfb6185c00950da8e915b1a32546e7020913/lib/deprecated_icon_handler.rb#L5-L682), FA 웹사이트를 확인한 뒤, `fa-`, `fas-` 접두사(그리고 _접두사 없는_ 경우)를 이리저리 바꿔가며 작동하는 방법을 찾아내야 하는 것이 다소 혼란스럽다고 생각합니다. 삼중으로 번거롭고, 아이콘을 찾지 못할 경우 콘솔에 오류 메시지가 표시되지 않아 완전히 눈감고 시험해 보는 것과 같습니다.
마침 작동하게 만들었고, 각 설정에 무엇이 들어가는지 설명하는 표를 아래에 올립니다:
| 컴포넌트의 `Icons` 객체 설정 | 컴포넌트의 `custom font awesome icons` 설정 | `svg icon subset` 사이트 설정 |
| --- | --- | --- |
| `user` | `fa-user` | `fa-user` |
| `envelope` | `fa-envelope` | `fa-envelope` |
| `calendar-days` | `fa-calendar-days` | `fa-calendar-days` |
| `fab-facebook` | (필요 없음) | (필요 없음) |
Discourse 전체에서 FA 아이콘을 참조하는 방식이 하나여야 하고, 모든 것이 그 하나의 방식에 따라야 한다고 생각합니다.
---
### Author:  [@jeffbyrnes](https://meta.discourse.org/u/jeffbyrnes)
#### Post date: [12월 16, 2025, 5:12오후 UTC](https://meta.discourse.org/t/brand-header/77977/267 "2025-12-16T17:12:46Z")
이렇게 하면 원하는 결과의 일부는 얻을 수 있었지만, 여전히 두 개의 아이콘을 표시하는 데 어려움을 겪고 있습니다:
- `fa-mastodon`
- [`fa-bluesky`](https://fontawesome.com/v6/icons/bluesky?f=brands&s=solid)
또한 `fa-facebook`, `fa-instagram`, `fa-discord` 아이콘도 표시되지 않고, `fab-facebook`과 같은 `fab-*` 계열만 표시됩니다.
어떤 팁이 있을까요?
---
### Author:  [@Moin](https://meta.discourse.org/u/Moin)
#### Post date: [12월 16, 2025, 5:27오후 UTC](https://meta.discourse.org/t/brand-header/77977/268 "2025-12-16T17:27:24Z")
전통적으로 `fab`를 접두사로 사용해야 한다고 생각합니다. 제가 아는 한, fab의 `b`는 "brand(브랜드)"를 의미합니다. 따라서 아이콘에는 브랜드용 `fab`, 솔리드용 `fas`, 또는 레귤러 버전용 `fa` 중 하나가 사용되어야 합니다.
따라서 `fab-mastodon`과 `fab-bluesky`가 맞을 것 같습니다. `fa-facebook`과 같은 버전은 존재하지 않습니다. 다른 Facebook 아이콘 중 하나를 선호하시나요?
또한, 아이콘 이름을 `custom_font_awesome_icons` 설정에 추가하는 것을 잊지 마세요.
---
### Author:  [@pacharanero](https://meta.discourse.org/u/pacharanero)
#### Post date: [12월 16, 2025, 6:35오후 UTC](https://meta.discourse.org/t/brand-header/77977/269 "2025-12-16T18:35:53Z")
네, `fab-bluesky`를 사용해서 작동하도록 만들었습니다.
---
### Author:  [@jeffbyrnes](https://meta.discourse.org/u/jeffbyrnes)
#### Post date: [12월 17, 2025, 5:31오후 UTC](https://meta.discourse.org/t/brand-header/77977/270 "2025-12-17T17:31:13Z")
감사합니다. 어떻게 놓쳤는지 모르겠지만, `fab-bluesky`와 `fab-mastodon`을 “Custom font awesome icons” 설정 목록에 추가하고 메뉴 항목도 함께 추가한 것이 마침내 문제를 해결해 주었습니다.
정말 감사합니다!
[Previous page](https://meta.discourse.org/t/brand-header/77977.md?page=1)