# (Superseded) Add new link on header beside search icon

**URL:** https://meta.discourse.org/t/superseded-add-new-link-on-header-beside-search-icon/48621
**Category:** Site Management
**Tags:** how-to
**Created:** [14.Август.2016 18:40:02 UTC](https://meta.discourse.org/t/superseded-add-new-link-on-header-beside-search-icon/48621 "2016-08-14T18:40:02Z")
**Posts on this page:** 4
**Page:** 1

<div class="post-metadata">

### Author: ![techAPJ](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/techapj/32/342990_2.png) [@techAPJ](https://meta.discourse.org/u/techAPJ)
#### Post date: [14.Август.2016 18:40:02 UTC](https://meta.discourse.org/t/superseded-add-new-link-on-header-beside-search-icon/48621/1 "2016-08-14T18:40:02Z")

</div>

> 📣 This feature is now available as a [dedicated theme component](https://meta.discourse.org/t/iconified-header-links/86307).

Want to add a new link right next to search icon on header? Follow below steps:

### Add this JavaScript code to your site theme

1. Go to _Admin_
2. _Customize_
3. _Themes_
4. Select the theme you wish to customize
5. _Edit CSS/HTML_
6. `</head>`

```plaintext
<script type="text/discourse-plugin" version="0.4">
const { iconNode } = require("discourse-common/lib/icon-library");
api.decorateWidget('header-icons:before', helper => {
    return helper.h('li', [
        helper.h('a#home-button.icon', {
            href:'https://www.google.com/',
            title: 'Google'
        }, iconNode('arrow-circle-up')),
    ]);
});
</script>

```

(Props to @Yuun for above code)

Change `href`, `title` and icon (`arrow-circle-up`) as per your requirement. See the complete list of available _Font Awesome_ icons [here](https://fontawesome.com/icons?d=gallery&m=free). If using an icon that isn’t already included in Discourse, please also add the icon to the `svg icon subset` site setting. (See [this guide](https://meta.discourse.org/t/introducing-font-awesome-5-and-svg-icons/101643) to Font Awesome 5 in Discourse for more details.)

Ensure the theme is enabled and you should be able to see the new icon linking to Google right next to search icon! 🎉

Desktop:

 ![](https://global.discourse-cdn.com/meta/original/3X/f/6/f6f0a89a7f21e10d302571d6ea7904d6ffe38aff.png)

Mobile:

 ![](https://global.discourse-cdn.com/meta/original/3X/4/3/4343860f0d1713039754609ab33e6b42e407da1f.png)

### Debugging

If it’s not working, try:

- Look for error message in Browser console
- View page source and see the error in a `<script type='text/discourse-js-error'>` block

---

<div class="post-metadata">

### Author: ![techAPJ](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/techapj/32/342990_2.png) [@techAPJ](https://meta.discourse.org/u/techAPJ)
#### Post date: [28.Апрель.2018 04:17:10 UTC](https://meta.discourse.org/t/superseded-add-new-link-on-header-beside-search-icon/48621/60 "2018-04-28T04:17:10Z")

</div>

We now have theme component for this:

> [@Custom Header Links (icons)](https://meta.discourse.org/t/iconified-header-links/86307):
>
> discourse2Summary Custom Header Links (icons) will allow you to easily add linked icons to the Discourse header.eyeglassesPreview [Preview on Discourse Theme Creator](https://discourse.theme-creator.io/theme/Discourse/custom-header-links-icons)hammer_and_wrenchRepository Link [https://github.com/discourse/discourse-icon-header-links](https://github.com/discourse/discourse-icon-header-links)open_bookNew to Discourse Themes? [Beginner’s guide to using Discourse Themes](https://meta.discourse.org/t/beginners-guide-to-using-discourse-themes/91966) Install this theme component Features Screenshots Desktop Mobile Settings This component includes a …

---

<div class="post-metadata">

### Author: ![mcwumbly](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/mcwumbly/32/103861_2.png) [@mcwumbly](https://meta.discourse.org/u/mcwumbly)
#### Post date: [22.Сентябрь.2022 14:39:55 UTC](https://meta.discourse.org/t/superseded-add-new-link-on-header-beside-search-icon/48621/62 "2022-09-22T14:39:55Z")

</div>



---

<div class="post-metadata">

### Author: ![mcwumbly](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/mcwumbly/32/103861_2.png) [@mcwumbly](https://meta.discourse.org/u/mcwumbly)
#### Post date: [22.Сентябрь.2022 14:39:58 UTC](https://meta.discourse.org/t/superseded-add-new-link-on-header-beside-search-icon/48621/63 "2022-09-22T14:39:58Z")

</div>


