# 如何在品牌标题中使用自定义/非标准图标？

**URL:** <https://meta.discourse.org/t/how-to-use-custom-non-standard-icons-in-brand-header/312629>\
**Category:** Development\
**Tags:** css, brand-header\
**Created:** [2018年四月19日 05:53 UTC](https://meta.discourse.org/t/how-to-use-custom-non-standard-icons-in-brand-header/312629 "2018-04-19T05:53:59Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![icaria36](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/icaria36/32/426431_2.png) [@icaria36](https://meta.discourse.org/u/icaria36)\
**Post date:** [2018年四月19日 05:53 UTC](https://meta.discourse.org/t/how-to-use-custom-non-standard-icons-in-brand-header/312629/1 "2018-04-19T05:53:59Z")

</div>

重新发布：

使用 Font Awesome 来为社交服务添加图标，对于商业服务来说效果很好，因为大多数（如果不是全部）知名服务都有对应的图标。然而，对于我们这些使用免费/开源社交服务的人来说，情况似乎没那么幸运。

关于如何为例如 Riot.im / Matrix、Mastodon、GNUSocial、Diaspora、IRC 等服务添加图标，有什么建议吗？

---

<div class="post-metadata">

**Author:** ![vinothkannans](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/vinothkannans/32/86465_2.png) [@vinothkannans](https://meta.discourse.org/u/vinothkannans)\
**Post date:** [2018年四月19日 06:15 UTC](https://meta.discourse.org/t/how-to-use-custom-non-standard-icons-in-brand-header/312629/2 "2018-04-19T06:15:58Z")

</div>

您可以通过自定义 CSS 实现。

例如，如果在“图标”主题设置中添加 `diaspora,https://diasporaurl.com`，它将为该菜单创建 `fa-diaspora` 类。然后，使用 [自定义 CSS](https://stackoverflow.com/a/45729759)，您可以为该类添加相应的图标。

---

<div class="post-metadata">

**Author:** ![icaria36](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/icaria36/32/426431_2.png) [@icaria36](https://meta.discourse.org/u/icaria36)\
**Post date:** [2018年四月21日 20:41 UTC](https://meta.discourse.org/t/how-to-use-custom-non-standard-icons-in-brand-header/312629/3 "2018-04-21T20:41:50Z")

</div>

它有效！@vinothkannans 非常感谢。

品牌页头主题，包含 Riot.im 和 Mastodon（通过图标和自定义 CSS），以及通过 fa-rss 实现的 RSS：

 ![Screenshot%20from%202018-04-21%2022-42-26](https://global.discourse-cdn.com/meta/original/3X/b/b/bb90d02b9ad6d61400c23b6f387810dc71cbd1df.png)

---

<div class="post-metadata">

**Author:** ![system](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/system/32/443519_2.png) [@system](https://meta.discourse.org/u/system)\
**Post date:** [2024年六月18日 20:40 UTC](https://meta.discourse.org/t/how-to-use-custom-non-standard-icons-in-brand-header/312629/4 "2024-06-18T20:40:33Z")

</div>

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