# 自定义顶部导航链接

**URL:** <https://meta.discourse.org/t/custom-top-navigation-links/87225>\
**Category:** Theme component\
**Tags:** official, top-navigation-links\
**Created:** [2018年五月11日 02:14 UTC](https://meta.discourse.org/t/custom-top-navigation-links/87225 "2018-05-11T02:14:07Z")\
**Posts on this page:** 1\
**Showing post:** 88

<div class="post-metadata">

**Author:** ![Moin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/moin/32/554653_2.png) [@Moin](https://meta.discourse.org/u/Moin)\
**Post date:** [2025年七月30日 11:24 UTC](https://meta.discourse.org/t/custom-top-navigation-links/87225/88 "2025-07-30T11:24:08Z")

</div>

有一个组件可以让你在顶部导航中为链接添加图标：[Discourse Nav Item Icon / Emoji](https://meta.discourse.org/t/discourse-nav-item-icon-emoji/301105)  
它也可以与此组件添加的自定义链接一起使用。唯一的区别是，你需要在导航项名称前加上 `custom_`。

例如，  
我添加了一个“Preferences”链接，借助了这个组件：`Preferences;edit your preferences;/my/preferences`

 ![Configuration of nav links setting: Preferences;edit your preferences;/my/preferences](https://global.discourse-cdn.com/meta/original/4X/8/b/4/8b40d468660da2bb0c634884e151683ae32d527d.png)

然后我配置了图标/表情符号组件来添加扳手图标：`icon:custom_preferences:solid:wrench:currentColor`

 ![Configuration of the Nav item prefix setting: icon:custom_preferences:solid:wrench:currentColor](https://global.discourse-cdn.com/meta/original/4X/9/0/6/906768f71db8ee6d13543c41e0a8d91f7dacf450.png)

结果：  
 ![image](https://global.discourse-cdn.com/meta/original/4X/4/8/4/4848a653c2b2caebc1a3e6606aa71f847b6a56c8.png)

---

_[View the full topic](https://meta.discourse.org/t/custom-top-navigation-links/87225)._