# Adding a billing section in the member section

**URL:** https://meta.discourse.org/t/adding-a-billing-section-in-the-member-section/81610
**Category:** Development
**Created:** [February 26, 2018, 10:56pm UTC](https://meta.discourse.org/t/adding-a-billing-section-in-the-member-section/81610 "2018-02-26T22:56:11Z")
**Posts on this page:** 8
**Page:** 1

<div class="post-metadata">

### Author: ![Francois\_Douville](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/francois_douville/32/94221_2.png) [@Francois\_Douville](https://meta.discourse.org/u/Francois_Douville)
#### Post date: [February 26, 2018, 10:56pm UTC](https://meta.discourse.org/t/adding-a-billing-section-in-the-member-section/81610/1 "2018-02-26T22:56:11Z")

</div>

I use the Memberful-Discourse integration.

I want to add a “billing” section right here :

 ![billing](https://global.discourse-cdn.com/meta/original/3X/b/e/bebc8f91c1ac74cd2d6d0ddf0da25704a3192a4e.png)

In fact, when a user will click on billing, it will convert to the memberful account of the user. I will put a simple link to make it happen. I already have this link. I just want to know the code to add a section here.

Is it possible?

---

<div class="post-metadata">

### Author: ![joebuhlig](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/joebuhlig/32/193054_2.png) [@joebuhlig](https://meta.discourse.org/u/joebuhlig)
#### Post date: [February 27, 2018, 12:10am UTC](https://meta.discourse.org/t/adding-a-billing-section-in-the-member-section/81610/2 "2018-02-27T00:10:46Z")

</div>

You could likely tie into the `user-main-nav` connector and add it to the users profile. It’s not exactly the same placement but it would have roughly the same effect.

> <https://github.com/discourse/discourse/blob/8296f493ed5548698647d6890ca1d2e069630198/app/assets/javascripts/discourse/templates/user.hbs#L207>

---

<div class="post-metadata">

### Author: ![Francois\_Douville](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/francois_douville/32/94221_2.png) [@Francois\_Douville](https://meta.discourse.org/u/Francois_Douville)
#### Post date: [February 27, 2018, 12:22am UTC](https://meta.discourse.org/t/adding-a-billing-section-in-the-member-section/81610/3 "2018-02-27T00:22:18Z")

</div>

Ok interesting, can you tell me exactly what I have to do please?

---

<div class="post-metadata">

### Author: ![joebuhlig](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/joebuhlig/32/193054_2.png) [@joebuhlig](https://meta.discourse.org/u/joebuhlig)
#### Post date: [February 27, 2018, 12:44am UTC](https://meta.discourse.org/t/adding-a-billing-section-in-the-member-section/81610/4 "2018-02-27T00:44:46Z")

</div>

Combine that plugin outlet with this:

> [@Using Plugin Outlet Connectors from a Theme or Plugin](https://meta.discourse.org/t/adding-plugin-outlets-using-a-theme/32727):
>
> Discourse includes hundreds of Plugin Outlets which can be used to inject new content or replace existing contend in the Discourse UI. ‘Outlet arguments’ are made available so that content can be customized based on the context. Choosing an outlet To find the name of a plugin outlet, search Discourse core for “\<PluginOutlet”, or use the [plugin outlet locations](https://meta.discourse.org/t/plugin-outlet-locations-theme-component/100673) theme component. (e.g. topic-above-posts). Wrapper outlets Some outlets in core look like \<PluginOutlet @name="foo" /\>. These allow you…

---

<div class="post-metadata">

### Author: ![Francois\_Douville](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/francois_douville/32/94221_2.png) [@Francois\_Douville](https://meta.discourse.org/u/Francois_Douville)
#### Post date: [February 27, 2018, 1:16am UTC](https://meta.discourse.org/t/adding-a-billing-section-in-the-member-section/81610/5 "2018-02-27T01:16:24Z")

</div>

> [@Using Plugin Outlet Connectors from a Theme or Plugin](https://meta.discourse.org/t/using-plugin-outlet-connectors-from-a-theme-or-plugin/32727/1):
>
> /connectors/OUTLET-NAME/UNIQUE-ID

`{{plugin-outlet name="user-main-nav" tagName='' connectorTagName='li' args=(hash model=model)}}`

What is the unique-id?

My code so far is this (what do I have to change?) :

```
<script type='text/x-handlebars' data-template-name='/connectors/user-main-nav/add-header-links'>
       <a class="nav-link " href="https://lepeuplier.memberful.com/account" target="_blank">Facturation</a>
</script>

```

---

<div class="post-metadata">

### Author: ![joebuhlig](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/joebuhlig/32/193054_2.png) [@joebuhlig](https://meta.discourse.org/u/joebuhlig)
#### Post date: [February 27, 2018, 1:22am UTC](https://meta.discourse.org/t/adding-a-billing-section-in-the-member-section/81610/6 "2018-02-27T01:22:33Z")

</div>

I haven’t tested it but that looks good to me. The unique I’d is something you make up for the project.

---

<div class="post-metadata">

### Author: ![Francois\_Douville](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/francois_douville/32/94221_2.png) [@Francois\_Douville](https://meta.discourse.org/u/Francois_Douville)
#### Post date: [February 27, 2018, 1:34am UTC](https://meta.discourse.org/t/adding-a-billing-section-in-the-member-section/81610/7 "2018-02-27T01:34:50Z")

</div>

It worked! Thanks so much!

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

---

<div class="post-metadata">

### Author: ![Francois\_Douville](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/francois_douville/32/94221_2.png) [@Francois\_Douville](https://meta.discourse.org/u/Francois_Douville)
#### Post date: [February 28, 2018, 5:31pm UTC](https://meta.discourse.org/t/adding-a-billing-section-in-the-member-section/81610/8 "2018-02-28T17:31:16Z")

</div>

I wrote a different code to make it appear at the place I want

```
<script type="text/discourse-plugin" version="0.8">
    api.onPageChange(() =>{
        addNav();
    });
    function addNav(){
        if($('.affiliation-link').length){
            // do nothing 
        } else {
            li = '<li class="no-glyph nav-interface affiliation-link"><a href="https://lepeuplier.memberful.com/account">Facturation</a></li>';
            $(".user-preferences-page .preferences-nav").append(li);
        }
    }

</script>

```

 ![22](https://global.discourse-cdn.com/meta/original/3X/c/a/caafe84a2a49146ba5e4ea14d30883bc379759a7.jpg)