I want to be able to tweak some of the styling in the search results (dropdown from the magnifying class in the top right). Now that seems to generate components on the fly (in app/assets/javascripts/discourse/app/lib/search.js) instead of using a template. I seem to be unable to do api.modifyClass("component:search-result-post", { didInsertElement() { this._super(...arguments); }, }); or something similar. How can I get a trigger/event and modify some of the generated HTML ?

Hi Richard, Can you elaborate on what modifications you are looking for? As starting point, I believe you would need to play around: api.reopenWidget(`search-result-post`, { html(attrs) { // } }) Here for post, but you have also: tag, category, group, user, and topic. app/assets/javascripts/discourse/app/widgets/search-menu-results.js 7f486cbc9 constructor(html, term) { super({ html: ` ${html} ` }); this.term = term; } decorate($html) { highlightSearch($html[0], this.term); } } function createSearchResult({ type, linkField, builder }) { return createWidget(`search-result-${type}`, { tagName: "ul.list", buildAttributes() { return { "aria-label": `${type} ${I18n.t("search.results")}`, }; }, html(attrs) {

Update: the HTML generation in that widget was pretty complex and it had a lot of external dependencies. I also didn’t want to copy all that code to our plugin, so I ended up doing this api.reopenWidget(`search-result-topic`, { html(attrs) { const html = this._super(attrs); // modify html as we see fit return html; } }); Modifying the already generated HTML is probably not the most elegant way to do it, but it saved me from having to copy a large block of code from core to the plugin, making the plugin more robust against future core updates.

Modifying search results

Development

Arkshine March 23, 2023, 11:38am 5

Yeah, I also noticed that when I did try on my side. I believe you don’t have much choice here.

Topic		Replies	Views
How to insert new DOM element to search-menu widget Development	4	673	January 28, 2019
Add class to full page search result items? Development	2	794	April 18, 2023
Using modifyClass to change core behavior Developer Guides	6	2797	March 4, 2026
Customize template used by post widget Development	1	1903	September 14, 2018
Modifying style attribute dynamically on Topic List Item Development	11	472	January 31, 2025

Modifying search results

Related topics