Also today I realized that the User Profile page actually displays the custom field as it should, although compared to the user card, now the custom field (Website) is displayed last instead of first…
1 Like
I feel like I’ve seen a discussion of this, but I can’t find it now.
I’ve got a custom profile field that holds a user’s website implemented using this tutorial, but allowing for any external site to be entered, rather than just linking to Twitter or something. The problem I have is that about 80% of the users don’t bother to put “http(s)://” in front of the URL they enter. They (rightly) expect that “www.example.com” should just work. So how do I make it just work?
Edited to add: Figured it out. Below is the entire if block of javascript I used to determine whether to attempt to show an external link. The inner if is what determines whether the external URL needs to have “http” added to it, and takes care of doing it.
if (userFields && userFields[churchURLFieldId]) {
const rawChurchURL = userFields[churchURLFieldId];
var url = rawChurchURL;
if (!/^https?:\/\//i.test(rawChurchURL)) {
url = 'http://' + rawChurchURL;
}
const link = "<a href='"+url+"' target='_blank'>"+userFields[churchNameFieldId];+"</a>";
return Ember.Object.create({ link, name: churchURL.get('name') });
} else {
return null;
}
1 Like
Is there a way to edit existing user profile fields rather than adding new one? So that the existing twitter field value can be edited to contain anchor tag
the main post that allows us to add new clickable profile fields using connectors/handlebar outlets etc, those get “added” and so I had to hide the existing profile fields
e.g. I could add a clickable twitter field and so have to hide the existing twitter field
Now the newly added twitter field will be in a separate div rather than belonging to that same ember div which was pre-existing, resulting in weird css
Would using /connectors/user-profile-public-fields/Twitter instead of using /connectors/user-profile-primary/ help here?
This is very nice, i forked it and tried to make it a bit more general as a theme component without the Namati specific stuff. Hope you don’t mind!
Added a separate post as well to make it easier to find for others:
2 Likes
Hi all, just wanted to share that I made a very basic plugin version of this. It just lets you specify which user field to make into a link, and—optionally—a prefix (e.g. https://mysite.com/users/). Just thought I’d share in case anyone would rather install a theme component instead of modify code. It’s based on the code in the original post in this thread.
On a side note, for my particular use case, I don’t want any user to be able to edit it; rather, I plan to update it via the discourse API. In that case, would a “custom field” be better than a “user field”? I see both in the API, but custom_fields are blank.
7 Likes
@wilson29thid would you be willing to set up a theme topic for this component? It would be great to have this as an installable theme component rather than requiring people to copy/paste the code every time.
5 Likes
Sure - does creating a topic here with that tag make it installable?
1 Like
It’s installable already via the git URL. Creating a topic will just help people to find it more easily
1 Like
Slightly different question. I want to add a link which opens in a different window into description of a user field on the sign up page. That page doesn’t recognise links wrapped in [this](format).
I want users to agree that they’ve read our community values before joining, and having a link there will help if they’ve missed them. Right now i’ve just told them to copy/paste the full link into their browser.
How does this work with Discourse 3.2 and Ember 5?
I’ve updated the version: <script type="text/discourse-plugin" version="1.13.0"> and changed api.registerConnectorClass to api.renderInOutlet as suggested here but I get in the browser console: [THEME 27] Error: klass is not an Ember component
I’ve exchanged property for computed like suggested here but get in the browser console: [THEME 27] ReferenceError: computed is not defined
Oh I forgot the import, so I add the missing import EmberObject, { computed } from '@ember/object'; after the opening script tag but that results in a SyntaxError: "/discourse/theme-27/discourse/initializers/theme-field-140-common-html-script-3: ‘import’ and ‘export’ may only appear at the top level.
1 Like
Hmm yeah, the techniques suggested in the OP are pretty outdated (which makes sense, given it was written in 2016 
).
Nowadays this kind of thing should be packaged up in a git repository and published as a theme-component for people to install and configure via the settings.
2 Likes
I did end up re-working @wilson29thid’ TC here though it does still have a deprecation warning that I need to fix at some point.
1 Like
This functionality of the OP can now be found in a new mini component: