# Able to use the 'extraNavItem' custom html outlet?

**URL:** https://meta.discourse.org/t/able-to-use-the-extranavitem-custom-html-outlet/51928
**Category:** Development
**Created:** [October 23, 2016, 3:38pm UTC](https://meta.discourse.org/t/able-to-use-the-extranavitem-custom-html-outlet/51928 "2016-10-23T15:38:49Z")
**Posts on this page:** 1
**Showing post:** 5

<div class="post-metadata">

### Author: ![ebadgley](https://avatars.discourse-cdn.com/v4/letter/e/e19b73/32.png) [@ebadgley](https://meta.discourse.org/u/ebadgley)
#### Post date: [February 14, 2017, 8:43pm UTC](https://meta.discourse.org/t/able-to-use-the-extranavitem-custom-html-outlet/51928/5 "2017-02-14T20:43:28Z")

</div>

Thanks, the example is helpful (I’m not kidding when I said I was very new!)

I see what you are saying about getting this to look nice – the custom\_html is defaulting to inserting a `<div>` when it needs to be a `<li>` for that particular location (nav items). For example, when I do:

`register_custom_html(extraNavItem: "<a href='/faq'>Faq</a>")`

I get:

```
<ul id="ember950" class="ember-view nav nav-pills">
<li id="ember963" title="topics with recent posts" class="ember-view active"><a href="/latest">Latest</a></li>
<li id="ember965" title="topics created in the last few days" class="ember-view"><a href="/new">New (1)</a></li>
<li id="ember967" title="topics you are currently watching or tracking with unread posts" class="ember-view has-icon"><a href="/unread"><span class="unread"></span>Unread</a></li>
<li id="ember969" title="the most active topics in the last year, month, week or day" class="ember-view"><a href="/top">Top</a></li>
<li id="ember971" title="all topics grouped by category" class="ember-view"><a href="/categories">Categories</a></li>
<div id="ember972" class="ember-view"><a href="/faq">Faq</a></div>
<!----></ul>

```

where the last item is the one added via custom\_html. I’ve tried several variations and the `<div>` seems to be a given.

However: the navigation-bar.js does contain an actual declared plugin outlet (see the last line):

```
{{#each navItems as |navItem|}}
  {{navigation-item content=navItem filterMode=filterMode}}
{{/each}}
{{custom-html "extraNavItem"}}
{{plugin-outlet "extra-nav-item" tagName="li"}}

```

I’ve experimented with creating a connector for the `extra-nav-item` outlet as in [Part 2 of the relevant tutorial](https://meta.discourse.org/t/beginners-guide-to-creating-discourse-plugins-part-2-plugin-outlets/31001), but it doesn’t appear to be getting picked up right now. If anyone has good examples of this outlet in use, I’d appreciate them.

(My fallback is the JS method linked above, but I’d prefer to avoid it.)

---

_[View the full topic](https://meta.discourse.org/t/able-to-use-the-extranavitem-custom-html-outlet/51928)._