Come integrare un plugin personalizzato nell'interfaccia di discourse

[Elizeo_Rocha]

Sto sviluppando un nuovo plugin per la mia istanza Discourse. Sebbene il plugin stesso funzioni correttamente, ho difficoltà a integrarlo nell’interfaccia utente di Discourse. Ho esaminato la documentazione disponibile, ma alcune parti mi sono ancora poco chiare. Dato che sono nuovo in questo campo, apprezzerei molto una guida dettagliata e passo passo su come aggiungere il plugin all’interfaccia utente. Anche un semplice esempio (come una “scatola gialla” evidenziata) sarebbe molto utile per comprendere il processo.

Grazie per il tuo aiuto!

[merefield (Robert)]

@Elizeo_Rocha

aggiungi il plugin all’interfaccia utente

Questo è un po’ vago. Puoi essere più specifico? Cosa vuoi aggiungere esattamente all’interfaccia utente?

Hai esaminato il codice sorgente dei Plugin esistenti per vedere cosa stanno facendo? (Questo è uno dei vantaggi dell’open source)

[Elizeo_Rocha]

@merefield Vorrei fondamentalmente aggiungere un plugin alla mia istanza Discourse che visualizzi una piccola casella sulla mia pagina. Il mio obiettivo è capire come farlo, ad esempio un plugin che visualizzi ‘Hello, World!’ in una di queste aree, in modo da poter creare qualcosa di più complesso in futuro

[Arkshine]

Dovresti usare un plugin outlet.

Using Plugin Outlet Connectors from a Theme or Plugin

Discourse includes hundreds of Plugin Outlets which can be used to inject new content or replace existing contend in the Discourse UI. ‘Outlet arguments’ are made available so that content can be customized based on the context. Choosing an outlet To find the name of a plugin outlet, search Discourse core for “<PluginOutlet”, or use the plugin outlet locations theme component. (e.g. topic-above-posts). Wrapper outlets Some outlets in core look like <PluginOutlet @name="foo" />. These allow you…

Uno strumento utile per capire la posizione e il nome del plugin outlet:

Introducing Discourse developer toolbar

When running the latest version of Discourse core in a development environment, you’ll notice a new toolbar on the left-hand-side of the screen: [Developer Tools] This provides one-click access to commonly-needed developer tools. So far, we have: Plugin Outlet Debug This shows all plugin outlets, with tooltips showing realtime values of all of the available @outletArgs. This was inspired by the popular plugin outlet locations theme component, and the plugin before it. But un…

[Elizeo_Rocha]

Grazie! Ci proverò e tornerò con il mio feedback.

[Elizeo_Rocha]

Ha funzionato! Ho installato l’estensione Chrome Ember.js e sono stato in grado di individuare il PluginOutlet sul mio sito. Dopo aver seguito la documentazione, tutto ha funzionato come previsto.

[pfaffman (Jay Pfaffman)]

Dai un’occhiata anche a questi componenti del tema Link personalizzati nell’intestazione e Link personalizzati nell’intestazione (icone).

Se tutto ciò che vuoi fare è aggiungere un pulsante, non hai bisogno di un plugin.

[Heliosurge (Dan DeMontmorency)]

Non dimenticare il tuo TC

Custom Components -- add button or text at any plugin outlet

Summary Add button or text anywhere Repository https://github.com/literatecomputing/discourse-custom-components Install Guide How to install a theme or theme component New to Discourse Themes? Beginner’s guide to using Discourse Themes Install this theme component Add a link button or arbitrary text at any plugin outlet. (Ignore the watermarks in the images–I took these screenshots on a staging/test site.) …