# (Retired) Link username to external profile

**URL:** https://meta.discourse.org/t/retired-link-username-to-external-profile/55327
**Category:** Site Management
**Created:** [Janeiro 7, 2017, 3:37pm UTC](https://meta.discourse.org/t/retired-link-username-to-external-profile/55327 "2017-01-07T15:37:01Z")
**Posts on this page:** 14
**Page:** 1

<div class="post-metadata">

### Author: ![Discourse](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/discourse/32/148734_2.png) [@Discourse](https://meta.discourse.org/u/Discourse)
#### Post date: [Janeiro 7, 2017, 3:37pm UTC](https://meta.discourse.org/t/retired-link-username-to-external-profile/55327/1 "2017-01-07T15:37:01Z")

</div>

Let’s say you want to add a link of User’s main profile page on Discourse user profile page and user card, clicking on that link will take user to main (external) website.

The link of main website user profile page will be like:

```plaintext
http://site.com/username

```

Where `username` is the Discourse username of that user. (It should be same on both main site and Discourse forum)

Let’s get started!

### Add custom CSS

Paste this CSS code in _Admin_ \> _Customize_ \> _CSS/HTML_ \> `CSS` section:

```plaintext
#user-card .metadata h3 {
  float: left;
}

h3.user-card-public-field {
 clear: both;   
}

```

### Add custom JS

Paste this JS code in _Admin_ \> _Customize_ \> _CSS/HTML_ \> `</head>` section:

```plaintext
<script type="text/discourse-plugin" version="0.8.7">
    api.registerConnectorClass('user-profile-primary', 'site-link', {
      setupComponent(args, component) {
        component.set('siteLink', args.model.get('siteLink'));
      }
    });

    api.registerConnectorClass('user-card-metadata', 'site-link', {
      setupComponent(args, component) {
        component.set('siteLink', args.user.get('siteLink'));
      }
    });

    api.modifyClass('model:user', {
      siteLink: function() {
          const username = this.get('username');

          if (username) {
              const url = `http://site.com/${username}`;
              const link = `<a href=${url} target='_blank'>${url}</a>`;

              return Ember.Object.create({ link, name: "User Profile" });
          } else {
              return null;
          }
      }.property('username')
    });
</script>

<script type='text/x-handlebars' data-template-name='/connectors/user-profile-primary/site-link'>
  {{#if siteLink}}
    <div class="public-user-fields">
      <div class="public-user-field">
        <span class="user-field-name">{{siteLink.name}}</span>:
        <span class="user-field-value">{{{siteLink.link}}}</span>
      </div>
    </div>
  {{/if}}
</script>

<script type='text/x-handlebars' data-template-name='/connectors/user-card-metadata/site-link'>
  {{#if siteLink}}
    <h3 class="user-card-public-field">
      <span class="user-field-name">{{siteLink.name}}</span>:
      <span class="user-field-value">{{{siteLink.link}}}</span>
    </h3>
  {{/if}}
</script>

```

Update:

```plaintext
const url = `http://site.com/${username}`;

```

with your website user profile link.

### Voilà 🎉

That’s it, you will now see user _Profile_ link on user profile page:

 ![](https://global.discourse-cdn.com/meta/original/3X/9/d/9dfc5e91d7f7876a701a96d0350e48ad4278d7c3.png)

and user card:

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

* * *

Related: [(Retired) Use an ID in a custom user field to link to a user's external profile](https://meta.discourse.org/t/use-an-id-in-a-custom-user-field-to-link-to-a-users-external-profile/41218)

---

<div class="post-metadata">

### Author: ![pblog](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pblog/32/121268_2.png) [@pblog](https://meta.discourse.org/u/pblog)
#### Post date: [Janeiro 7, 2017, 3:48pm UTC](https://meta.discourse.org/t/retired-link-username-to-external-profile/55327/2 "2017-01-07T15:48:45Z")

</div>

Works like a charm. Thanks for adding this guide @techAPJ

---

<div class="post-metadata">

### Author: ![SidV](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sidv/32/119460_2.png) [@SidV](https://meta.discourse.org/u/SidV)
#### Post date: [Janeiro 9, 2017, 11:06am UTC](https://meta.discourse.org/t/retired-link-username-to-external-profile/55327/3 "2017-01-09T11:06:54Z")

</div>

@pblog, (or someone) could you please add an screenshot for final result?

---

<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: [Janeiro 9, 2017, 11:40am UTC](https://meta.discourse.org/t/retired-link-username-to-external-profile/55327/4 "2017-01-09T11:40:53Z")

</div>

Okay, added images in OP.

---

<div class="post-metadata">

### Author: ![Denis\_Didkovsky](https://avatars.discourse-cdn.com/v4/letter/d/53a042/32.png) [@Denis\_Didkovsky](https://meta.discourse.org/u/Denis_Didkovsky)
#### Post date: [Janeiro 22, 2017, 11:27am UTC](https://meta.discourse.org/t/retired-link-username-to-external-profile/55327/5 "2017-01-22T11:27:28Z")

</div>

Dear Arpit, does this approach really update userfield siteLink?  
We used it “as is” and siteLink in empty under user/preferences siteLink although it is visible over user card  
thx

---

<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: [Janeiro 25, 2017, 5:45pm UTC](https://meta.discourse.org/t/retired-link-username-to-external-profile/55327/6 "2017-01-25T17:45:49Z")

</div>

> [@Denis\_Didkovsky](#):
>
> does this approach really update userfield siteLink?

You mean user “Web Site”, right?

No, the code in first post does not update user Website field. It just adds a link of main/external user profile on user page and user card.

---

<div class="post-metadata">

### Author: ![sunnyt7](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sunnyt7/32/71920_2.png) [@sunnyt7](https://meta.discourse.org/u/sunnyt7)
#### Post date: [Maio 20, 2017, 2:49am UTC](https://meta.discourse.org/t/retired-link-username-to-external-profile/55327/7 "2017-05-20T02:49:30Z")

</div>

Sorry for the newbie question, but could someone post example code for if external\_id was used as opposed to username?

I have single sign on enabled, and it shows the proper External ID at the bottom of the admin interface of the user account.

---

<div class="post-metadata">

### Author: ![daath](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/daath/32/115536_2.png) [@daath](https://meta.discourse.org/u/daath)
#### Post date: [Junho 22, 2017, 3:49pm UTC](https://meta.discourse.org/t/retired-link-username-to-external-profile/55327/8 "2017-06-22T15:49:43Z")

</div>

Any chance this example could get an update? Apparently it will not work, since `api.container.lookupFactory` is a private API and will break stuff 😜

> [@sunnyt7](#):
>
> Sorry for the newbie question, but could someone post example code for if external\_id was used as opposed to username?
> 
> I have single sign on enabled, and it shows the proper External ID at the bottom of the admin interface of the user account.

I asked the same a long time ago. You’d have to write a plugin that exposes external\_id - I asked recently if it had become enabled, since they changed a lot of stuff, but haven’t received an answer, so I guess it still requires a plugin…

---

<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: [Junho 23, 2017, 6:12pm UTC](https://meta.discourse.org/t/retired-link-username-to-external-profile/55327/9 "2017-06-23T18:12:30Z")

</div>

Okay, I updated the code in first post to use `api.modifyClass` instead of `api.container.lookupFactory`.

---

<div class="post-metadata">

### Author: ![pnoeric](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pnoeric/32/177144_2.png) [@pnoeric](https://meta.discourse.org/u/pnoeric)
#### Post date: [Abril 13, 2020, 7:48pm UTC](https://meta.discourse.org/t/retired-link-username-to-external-profile/55327/10 "2020-04-13T19:48:26Z")

</div>

> [@techAPJ](#):
>
> Digamos que você queira adicionar um link para a página principal do perfil do usuário na página de perfil do usuário do Discourse e no cartão de usuário; ao clicar nesse link, o usuário será levado ao site principal (externo).

@techAPJ, esse código é ótimo. Quero fazer um pequeno ajuste e talvez você saiba… como posso obter o `external_id` no final da URL (ou seja, `const url = 'http://site.com/${external_id}'`)? Tentei alterar o código para pegar o `external_id` do objeto do usuário, mas diz que a propriedade está indefinida.

---

<div class="post-metadata">

### Author: ![Shauny](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/shauny/32/362012_2.png) [@Shauny](https://meta.discourse.org/u/Shauny)
#### Post date: [Fevereiro 2, 2024, 4:51pm UTC](https://meta.discourse.org/t/retired-link-username-to-external-profile/55327/11 "2024-02-02T16:51:43Z")

</div>

Este código está obsoleto, você pode atualizá-lo, por favor? Tentei ajustá-lo, mas não funcionou.

> **[Aviso do Administrador]** Um ou mais de seus plugins ou componentes de tema precisam ser atualizados porque são incompatíveis com o Discourse 3.2.  
> Mais informações podem ser encontradas na [base de conhecimento da Communiteq](https://www.communiteq.com/discoursehosting/kb/required-updates-for-theme-components/).  
> Detalhes: [TEMA 1 ‘Padrão’] As extensões de protótipo de função foram preteridas, por favor, migre de function(){}.property(‘bar’) para computed(‘bar’, function() {}).

---

<div class="post-metadata">

### Author: ![david](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/david/32/157490_2.png) [@david](https://meta.discourse.org/u/david)
#### Post date: [Fevereiro 2, 2024, 5:00pm UTC](https://meta.discourse.org/t/retired-link-username-to-external-profile/55327/12 "2024-02-02T17:00:51Z")

</div>

Parece que isso é muito semelhante a outro guia. Assim como naquele, as estratégias sugeridas no tópico original estão extremamente desatualizadas. A melhor opção a partir de agora será incorporar a funcionalidade em um componente de tema gerenciado pelo Git, para que as pessoas não precisem copiar e colar código.

> [@(Aposentado) Use um ID em um campo de usuário personalizado para vincular ao perfil externo de um usuário](https://meta.discourse.org/t/retired-use-an-id-in-a-custom-user-field-to-link-to-a-users-external-profile/41218/60?u=david):
>
> Hmm, sim, as técnicas sugeridas no post original estão bem desatualizadas (o que faz sentido, já que foi escrito em 2016 sweat_smile). Hoje em dia, esse tipo de coisa deve ser empacotado em um repositório git e publicado como um #customização:componente-de-tema para que as pessoas possam instalar e configurar pelas configurações.

Estamos avaliando a possibilidade de criar um #Customization > Theme component oficial para cobrir ambos os casos de uso e atualizaremos os dois tópicos quando isso estiver pronto.

---

<div class="post-metadata">

### Author: ![JammyDodger](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jammydodger/32/254611_2.png) [@JammyDodger](https://meta.discourse.org/u/JammyDodger)
#### Post date: [Fevereiro 2, 2024, 5:02pm UTC](https://meta.discourse.org/t/retired-link-username-to-external-profile/55327/13 "2024-02-02T17:02:57Z")

</div>



---

<div class="post-metadata">

### Author: ![JammyDodger](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jammydodger/32/254611_2.png) [@JammyDodger](https://meta.discourse.org/u/JammyDodger)
#### Post date: [Maio 25, 2024, 7:06am UTC](https://meta.discourse.org/t/retired-link-username-to-external-profile/55327/14 "2024-05-25T07:06:23Z")

</div>