# Put user custom field on the user account page

**URL:** https://meta.discourse.org/t/put-user-custom-field-on-the-user-account-page/134090
**Category:** Development
**Created:** [22 november 2019 om 00:02 UTC](https://meta.discourse.org/t/put-user-custom-field-on-the-user-account-page/134090 "2019-11-22T00:02:50Z")
**Posts on this page:** 1
**Showing post:** 3

<div class="post-metadata">

### Author: ![fzngagan](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/fzngagan/32/259349_2.png) [@fzngagan](https://meta.discourse.org/u/fzngagan)
#### Post date: [23 november 2019 om 03:26 UTC](https://meta.discourse.org/t/put-user-custom-field-on-the-user-account-page/134090/3 "2019-11-23T03:26:48Z")

</div>

Ok, I made it work but its somewhat tricky.

Create a connector class with this code.

```plaintext
import { set } from "@ember/object";
import EmberObject from "@ember/object";

export default {
@discourseComputed("model.user_fields.@each.value")
  publicUserFields() {
    const siteUserFields = this.site.get("user_fields");
    if (!isEmpty(siteUserFields)) {
      const userFields = this.get("model.user_fields");
      return siteUserFields
        .filterBy("show_on_user_card", true)
        .sortBy("position")
        .map(field => {
          set(field, "dasherized_name", field.get("name").dasherize());
          const value = userFields ? userFields[field.get("id")] : null;
          return isEmpty(value) ? null : EmberObject.create({ value, field });
        })
        .compact();
    }
  },
}

```

On the connector template,

```plaintext
{{#if publicUserFields}}
        <div class="card-row fifth-row">
          <div class="public-user-fields">
            {{#each publicUserFields as |uf|}}
              {{#if uf.value}}
                <div class="public-user-field {{uf.field.dasherized_name}}">
                  <span class="user-field-name">{{uf.field.name}}:</span>
                  <span class="user-field-value">{{uf.value}}</span>
                </div>
              {{/if}}
            {{/each}}
          </div>
        </div>
{{/if}}

```

---

_[View the full topic](https://meta.discourse.org/t/put-user-custom-field-on-the-user-account-page/134090)._