How can I find Discourse template locations to set it in the code? Especially I’m interested in the correct name of the usercard [image] [image]Developing Discourse Themes & Theme Components decorateWidget() With this method you will be able to add html before or after a widget. You use it like this api.decorateWidget('NAME:LOCATION', helper => { });

You aren’t going to be able to use decorateWidget() on a plugin outlet. Try something like this: const h = require("virtual-dom").h; api.createWidget("user-card-custom-field", { html(attrs) { const userCustomFields = attrs.user.custom_fields; if (userCustomFields.user_field_4) { return h('span.poster-user-field', userCustomFields.user_field_4); } } }); {{mount-widget widget="user-card-custom-field" args=(hash user=user)}} The mount-widget is passing the user object we have available from the plugin outlet in core and making it available in the attributes of the user-card-custom-field widget we’ve created. app/assets/javascripts/discourse/app/templates/components/user-card-contents.hbs aa0d4ea76 {{plugin-outlet name="user-card-post-names" args=(hash user=this.user) tagName="div"}} Make sure you’ve added user_field_4 to your public user custom fields or staff user custom fields site settings as needed. Edit Also, unless there’s anything particularly special you need to do, you should be able to avoid widgets altogether and just use the plugin outlet: {{#if user.custom_fields.user_field_1}} {{user.custom_fields.user_field_1}} {{/if}}

There’s a really handy theme component to track down the plugin outlets of our various handlebars templates: (deprecated) Plugin outlet locations theme component. At the end of the first post is a link to a preview of the component on our theme creator site. You can use that to find most plugin outlets without even having to install it on your own site. [Screen Shot 2020-12-10 at 10.35.14 AM] One thing to be aware of is that templates and widgets are two separate concepts. With that said, they can work together if needed by mounting a widget to a plugin outlet of a template. It’s more common to use connectors/components/controllers to work with plugin outlets at this point like you would in a plugin, though. This section of the developers guide covers a lot what you are looking for. I would also recommend going through the GitHub repositories of theme components in our #theme category to see some good examples.

Thank you for the hint! I found the necessary part user-card-post-names:after. [image] 'Plugin Outlet Locations' by @RGJ A customization for Discourse shared on Discourse Theme Creator I tried to use it in the original code, but failed. [image]Ability to place custom fields in post header? api.decorateWidget('poster-name:after', helper => { const attrs = helper.attrs; if (attrs.userCustomFields && attrs.userCustomFields.user_field_4) { return helper.h('span.poster-user-field', helper.attrs.userCustomFields.user_field_4); } }); I changed poster-name:after to user-card-post-names:after, but it didnt work and the custom field is not visible on the usercard. Any ideas on the reason of that?

api.decorateWidget - how can I find the template's names?

Product Support

Ed_Bobkov (Ed) December 11, 2020, 10:51am 5

Thank you so much! Everything is working.

Topic		Replies	Views
Using template hbs to add HTML content to a plugin outlet Development	2	316	June 23, 2025
Using discourse's plugin outlets Development	2	1203	September 24, 2020
Developing Discourse Plugins - Part 2 - Connect to a plugin outlet Developer Guides plugin-guides , tutorial	38	31049	November 23, 2025
How to create a custom activity tab in user profile? Development	8	500	April 17, 2025
Is there a theming 'map'? (An easy way to find plugin-outlets etc) Development	11	2187	February 7, 2020

api.decorateWidget - how can I find the template's names?

Related topics